Category Archives: Trucos Script/Plugin/Widget

¿Como puedo utilizar entradas de diferentes estilos para distintos miembros de un blog?, Classic-Blogger

Me pareció súper util esta ayuda de Blogger, para los que tienen varios miembros en su blog, si alguien la puede probar seria muy bueno!!!
Este es el link original (en todo caso, es lo mismo 🙂 )

El código <$BlogItemAuthorNickname$> de Blogger puede utilizarse para incluir el nombre visible del autor en todas las entradas. En los blogs de grupo, esta funcionalidad puede servir para crear entradas de distintos diseños en función del usuario que las redacte.

Por ejemplo, un usuario puede publicar entradas en rojo y otro en azul. Otra posibilidad es que sus entradas presenten distintos colores de fondo o diversos tipos de borde. Es posible aplicar todas las opciones de CSS a las entradas de un usuario concreto. A continuación, incluimos un ejemplo sobre el uso de diversos colores.

Imaginemos que dos usuarios, Alice y Bob, comparten un blog. Por lo general, sus entradas serán idénticas, como se muestra aquí:

diferentes_estilos_autores_1.jpg

Sin embargo, eso se nos hace demasiado aburrido y decidimos que las entradas de Alice se visualicen en azul y las de Bob tengan un fondo amarillo. Para empezar, vaya a su plantilla y localice la sección Entradas del blog.

Verá el código <$BlogItemBody$>, encargado de insertar el texto de las entradas. A su alrededor, colocamos un código span con <$BlogItemAuthorNickname$> determinando la clase. De este modo, las entradas de Alice se señalarán con class=”Alice” y las de Bob, con class=”Bob”. El cambio afectará a la visualización de la siguiente manera:

diferentes_estilos_autores_2.jpg

A continuación, debemos añadir a Alice y Bob a nuestra hoja de estilos para dotar estas clases de significado. Dicha hoja de estilos aparece en la parte superior de la plantilla, entre los códigos <style>. Añada las siguientes líneas sobre Alice y Bob:

diferentes_estilos_autores_3.jpg

Para finalizar, guarde los cambios. Cuando lo visite de nuevo, Alice y Bob disfrutarán de sus nuevos formatos, como se muestra a continuación:

diferentes_estilos_autores_4.jpg

Notas:

  • Estos cambios de formato pueden aplicarse a las entradas de los blogs, así como a los títulos, la línea de autor o cualquier elemento que se encuentre entre los códigos <Blogger>...</Blogger>.
  • Si los usuarios modifican su nombre visible o bien si añade nuevos usuarios, tendrá que cambiar la hoja de estilos de su plantilla.
Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.

Agregar un Rastro de Texto al Cursor, Classic Blogger

Con el siguiente código se puede añadir al cursor un rastro de texto, al texto se le puede modificar el color, la fuente, tamaño y velocidad, las indicaciones para las modificaciones están dentro del código.

El código se tiene que colocar después de la etiqueta <head>. (No olvidar hacer un respaldo de la plantilla).

  1. <!-- ONE STEP TO INSTALL RIPPLE TEXT: 1. Copy the coding into the HEAD of your HTML document -->
  2.  
  3. &lt;!-- STEP ONE: PEGAR EL CODIGO DEBAJO DE LA ETIQUETA  en tu documentos html (Plantilla) --&gt;
  4.  
  5. <!-- The JavaScript Source!! http://javascript.internet.com -->
  6. <!-- Ripple Text by kurt.grigg@virgin.net -->
  7.  
  8. &lt;!-- Begin
  9. //Aqui se escribe el texto que va a seguir al mouse
  10. msg='Escribir texto aquí!';
  11. //Aqui se especifica la fuente del texto
  12. font='Verdana,Arial';
  13. size=2; // // solo valores entre 1 y 7!!
  14. //Aqui el color
  15. color='#0000ff';
  16. //Aqui la velocidad
  17. speed=0.5;
  18.  
  19. //A partir de aqui no alterar nada!!
  20. ns=(document.layers);
  21. ie=(document.all);
  22. msg=msg.split('');
  23. n=msg.length;
  24. a=size*10;
  25. ymouse=0;
  26. xmouse=0;
  27. scrll=0;
  28. props=&quot;<font face="+font+" size="+size+" color="+color+">";
  29. if (ns){
  30. for (i=0; i &lt; n; i++)
  31. document.write(''+props+msg[i]+'</font>');
  32. }
  33. if (ie){
  34. document.write('<div id="outer"><div>');
  35. for (i=0; i &lt; n; i++)
  36. document.write('<div id="iemsg" style="height:'+a+';width:'+a+';text-align:center">'+props+msg[i]+'</font></div>');
  37. document.write('</div></div>');
  38. }
  39. (ns)?window.captureEvents(Event.MOUSEMOVE):0;
  40. function Mouse(evnt){
  41. ymouse = (ns)?evnt.pageY+20-(window.pageYOffset):event.y+20;
  42. xmouse = (ns)?evnt.pageX+20:event.x+20;
  43. }
  44. (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
  45. y=new Array();
  46. x=new Array();
  47. Y=new Array();
  48. X=new Array();
  49. for (i=0; i &lt; n; i++){
  50. y[i]=0;
  51. x[i]=0;
  52. Y[i]=0;
  53. X[i]=0;
  54. }
  55. function assign(){
  56. if (ie) outer.style.top=document.body.scrollTop;
  57. for (i=0; i &lt; n; i++){
  58. var d=(ns)?document.layers['nsmsg'+i]:iemsg[i].style;
  59. d.top=y[i]+scrll;
  60. d.left=x[i]+(i*(a/2));
  61. }
  62. }
  63. function ripple(){
  64. scrll=(ns)?window.pageYOffset:0;
  65. y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
  66. x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
  67. for (var i=1; i

Este efecto funciona con Internet Explorer, ejemplo.

Como agregar Una Anotacion

Es aplicable a cualquier plataforma de Blogs.
Si quieren agregar el significado de alguna palabra, o por ejemplo, detallar algun tipo de ingrediente (especial para los que tienen un blog de comidas) aqui esta el codigo que deben escribir, lo importante es la etiqueta acronym:

  1. <acronym title="Aquí va el significado">Aquí la palabra o frase original</acronym>

Es todo, super util el dato, aqui les dejo un ejemplo, de como se ve: (mantengan un rato el cursor sobre la palabra Google)

Google

Suerte!!

Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.