Los 10 Mandamientos del Blog


Del patrón de los 10 mandamientos que recibió Moisés han hecho algunas puntualizaciones acerca del blogging (y micro-blogging si estás por ejemplo en Twitter).

Así que aquí tienes los Diez Mandamientos de los blogs:

1. Ofrece contenido fresco y personal y la perspectiva con tu blog que tú y sólo tú puedes dar.

2. Escribe con palabras que la gente real pueda entender.

3. No llores por alguien con tu blog. Si tienes un problema con esa persona, ves a ella para resolverlo.

4. No darás falso testimonio contra tu prójimo con tu blog.

5. No te apropiaras de citas del blog de tu prójimo, sin darle crédito.

6. No robarás el contenido del blog de tu prójimo y te lo apropiaras como tuyo.

7. No codiciarás el blog de tu prójimo y serás feliz con el tuyo.

8. No has de pasar más tiempo con blogs, leyendo blogs y/o comentarios en blogs (y mucho menos con cualquier otro tipo de medios de comunicación social), que con tu esposa, hijos y mascotas.

9. Te tomarás tiempo para el descanso y la relajación a intervalos regulares. Salir a la calle y oler las rosas.

10. No te harás un ídolo del blogging. Tu vida se compone de mucho más que eso.

Confieso que he pecado... y aquí tienes la infografía gracias a Alfredo Vela:


Antes de ver como se configura vamos a ver algunas dudas.
Que es dominio?
Es una red de identificación en la red, como .com, .net, etc., estos son nombre de dominio (DNS), y también para ser encontrados fácilmente y tener más categoría, ya que existen subdominios gratis pero nada mejor que ser independiente y ser reconocido con un dominio propio y distinguido.
Que es name.com?
Es una empresa de compra de dominios y bueno no son los únicos existen varios como DomianGodaddy y muchas más, pero para mí la mejor esName.com.
Bueno ahora les diré como configurar un dominio de name.com en Blogger.
  • Nos vamos a My Account

  • Y nos mandara a donde tenemos nuestros dominios comprados en una lista y le damos clic al dominio que queremos configurar.

  • En la sección de la sidebar que dice "Edit Name Servers" ahí como dice es para editar el nombre de los servidores pero yo diría que eso lo dejen como esta, así que vallan a la sección que dice "URL Forwarding".

  • Ahora como nos muestra la imagen de abajo así hay que llenar los campos, de todas maneras les pongo que significan cada una:
Point to: (Redirigir) ahí ponemos nuestro sitio del blog, ejemplo: http://futbol.blogspot.com/ 
Using:
 (Usando) Por defecto esta la opción 301 que significa que la redirección es permanente y si ponemos 302 es redirección temporal, yo diría que es mejor dejarlo así como esta.
Page Title : 
(Titulo del sitio) ejemplo: futbol
Meta Tags 
(Etiquetas del sitio) Aquí ponemos las etiquetas que vallan con nuestro sitio, y la descripción.
 
Una vez agregados los datos le damos a Update.
 
  • Ahora vamos a "DNS Management"
Antes de ver como se configura vamos a ver algunas dudas.
Que es dominio?
Es una red de identificación en la red, como .com, .net, etc., estos son nombre de dominio (DNS), y también para ser encontrados fácilmente y tener más categoría, ya que existen subdominios gratis pero nada mejor que ser independiente y ser reconocido con un dominio propio y distinguido.
Que es name.com?
Es una empresa de compra de dominios y bueno no son los únicos existen varios como DomianGodaddy y muchas más, pero para mí la mejor esName.com.
Bueno ahora les diré como configurar un dominio de name.com en Blogger.
  • Nos vamos a My Account

  • Y nos mandara a donde tenemos nuestros dominios comprados en una lista y le damos clic al dominio que queremos configurar.

  • En la sección de la sidebar que dice "Edit Name Servers" ahí como dice es para editar el nombre de los servidores pero yo diría que eso lo dejen como esta, así que vallan a la sección que dice "URL Forwarding".

  • Ahora como nos muestra la imagen de abajo así hay que llenar los campos, de todas maneras les pongo que significan cada una:
Point to: (Redirigir) ahí ponemos nuestro sitio del blog, ejemplo: http://futbol.blogspot.com/ 
Using:
 (Usando) Por defecto esta la opción 301 que significa que la redirección es permanente y si ponemos 302 es redirección temporal, yo diría que es mejor dejarlo así como esta.
Page Title : 
(Titulo del sitio) ejemplo: futbol
Meta Tags 
(Etiquetas del sitio) Aquí ponemos las etiquetas que vallan con nuestro sitio, y la descripción.
 
Una vez agregados los datos le damos a Update.
 
  • Ahora vamos a "DNS Management"

  • Ahí mismo vamos hacer un nuevo registro CNAME, como muestra la imagen así hay que llenar los datos y al último le damos Submit.
 
    Hasta ahí acabamos con name.com
    Suerte!

    • Ahí mismo vamos hacer un nuevo registro CNAME, como muestra la imagen así hay que llenar los datos y al último le damos Submit.
     
      Hasta ahí acabamos con name.com
      Suerte!  Por V-Junker

      Colocar una imágen flotante en el Blog


      Una imagen flotante estática en nuestro Blog es algo que casi todos usan en este tiempo, porque no es estorboso para los visitantes y moderno, es visible en todas las páginas, ya sea si bajas o subes la pagina siempre se quedara estática donde la coloques.
      Podemos colocar una imagen de tu logo, un icono de sígueme en Twitter, hazte fan en Facebook, por dar algunos ejemplos.
      Bueno primero nos vamos a Diseño > Edición de HTML y colocamos el siguiente código antes de </body>
      <a href='URL de tu Blog o de otro sitio' style='display:scroll;position:fixed;bottom:150px;right:0px;'><img src='URL de la imagen'/></a>
      Url de tu Blog o sitio: Es a donde quieres que sea redirigida la imagen, si no quieres eso, entonces en vez de la Url ponemos una #
      Bottom: Significa la posición donde quieres que este tu imagen por defecto esta en 150px, así como se ve en mi imagen flotante, pero si la quieres hasta abajo lo dejamos en 0px, o más arriba le ponemos un 250px, como gusten.
      Right: Esta opción significa que la imagen por defecto se encuentra del lado derecho, pero si la quieres del lado izquierdo lo cambiamos a left
      Si solo quieres poner la imagen flotante y sin enlace, en vez del código anterior ponemos este:
      <a style='display:scroll;position:fixed;bottom:150px;right:0px;'><img src='URL de la imagen'/></a>
      Y listo, la imagen flotante se puede ver en los navegadores de Firefox y Internet Explorer.
      Añado: les dejo dos imágenes muy padres.

      -Vía V-Junker

      Cómo poner un botón "spoiler" en el blog


      Bueno ya todos saben que es un spoiler, pero para los que no saben, entonces un spoiler es una herramienta un botón para mostrar o ocultar cualquier contenido para ahorrar espacio para colocarlo en los posts, es fácil colocar, no es nada de modificar nada extravagante en la plantilla, hay dos maneras diferentes para colocarlo:
      • En forma de Link:
      <div><a href='#' onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.innerHTML = 'Ocultar Contenido';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.innerHTML = 'Mostrar Contenido';}return false" type="button">Mostrar Contenido</a><div style="display: none;">AQUI EL CONTENIDO QUE QUIERAS OCULTAR</div></div>
      Asi quedaría:

      • En forma de Botón:
      <div><input value="Mostrar" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar Contenido';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Mostrar Contenido';}" type="button" /><div style="display: none;">AQUI EL CONTENIDO QUE QUIERAS OCULTAR</div></div>
      Asi quedaría:


      Gadget para que los visitantes se tomen una foto en tu blog


      Esta nueva forma de tomarse una foto en tu blog, para que tus visitantes se den a conocer y divertirse, es lo nuevo de hoy, ya que esta página llamada Trombiblog nos ofrece este servicio y es gratis :-D
      La pagina esta en idioma Francés y Ingles pero es fácil entenderle.
      • Primero nos vamos a Trombiblog y tenemos que registrarnos.
      • Una vez ya registrados nos mandara a la configuración del gadget, como el color y demás.
      • Ya confirmado la configuración nos dará el código.
      • Cópialo y nos vamos a Diseño > Elementos de la página > Añadir un gadget > HTML/Javascript y pegamos el código.
      Lo ven es muy fácil colocarlo ahora es cuestión que tus visitantes se tomen una foto y puedan comentar o calificar las fotos de los demás.
      Así quedaría el gadget:
       
      Y si quieren probarlo tomándose una foto como yo, solo dale en donde dice "Tomate una Foto" XD.

      Colocar el botón Me gusta de Facebook en Blogger



      En Facebook hay un plugin social en forma de botón llamado "me gusta" para las paginas y grupos que te agradan, pero ahora también ese botón lo podemos colocar en las entradas o posts de Blogger, así tus visitantes si les agrado o les sirvió tu información lo compartan en su perfil de Facebook y así tener más tráfico en tu Blog. :D
      Para colocarlo es muy fácil:
      • Primero nos vamos a Diseño>Edición de HTML y expandimos los artilugios.
      • Y buscamos el siguiente código:
      <div class='post-footer-line post-footer-line-1'/>
      • Debajo de esta línea pegamos lo siguiente:
      <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=450&amp;height=60&amp;action=like&amp;font=tahoma&amp;colorscheme=dark&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:20px'/>
      Lo puedes añadir en cualquier parte pero se vería mejor debajo de cada entrada o post, ahora tenemos que cambiar algunos valores para que quede a nuestro gusto o dejarlo como esta, es opcional.
      • layout: Estilo del botón. Valores: standard o button_count.
      • show_faces: Se muestra la foto de avatar de la persona a la que le gusta el artículo. Valores: true o false.
      • width: Anchura del iframe.
      • height: Altura del iframe.
      • action: Texto que se muestra en el botón. Valores like o recommend.
      • font: Fuente de texto ya sea tahoma, arial, comic.
      • colorscheme: Esquema de colores. Podemos utilizar light o dark.
      Ya cuando lo modifiques a tu gusto, guardas y listo. Así quedaría el botón de Me Gusta:

      Vía V-Junker

      
      

      Quitar la leyenda "Mostrar todas las entradas" en Blogger



      Tal vez a algunos no le den importancia a este aviso o notificación, que sale cada vez que seleccionamos una etiqueta y se ve encima de las entradas.
      Para eliminarlo es fácil solamente nos vamos a Diseño > Edición de HTML > Expandimos los artilugios y buscamos el siguiente código:
      <b:include data='top' name='status-message'/>
      Lo eliminamos, vemos la vista previa, y si todo está bien guardamos.
      Visto en | Gemablog Vía V-Junker

      Cómo poner un índice de entradas en Blogger o Site Map


      Realmente este es un excelente script que podemos ponerlo en nuestro Blog, ya que trata de darnos un índice de todas nuestras entradas o posts ordenadamente, ya que nos la separa por medio de etiqueta o categoría, también cada vez que publiquemos una nueva entrada nos mostrara un aviso Nuevo!!
      Ahora para poner un índice en tu Blog haremos lo siguiente:
      • Primero nos vamos a Crear nueva entrada, y ahí mismo le damos a la opción de Edición de HTML, y pegamos el siguiente código:
      <script style="text/javascript" src="http://dl.dropbox.com/u/4317648/Indice_de_entradas.js"></script> <script src="http://NOMBRE_DE_TU_BLOG.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
      Solamente cambiamos lo que está en color rojo por lo que te pide, y el script que está en color azul lo podemos dejar como esta o bien guardarlo y alojarlo en tu propio servidor para que sea más eficaz.
      Y por ultimo, antes de publicar nos vamos a Opciones de entrada y donde dice fecha y hora de la entrada la cambiamos por una fecha anterior, lo recomendable es poner una fecha antes de nuestra primera entrada, también si quieren permitir comentarios o no es su decisión, ahora solamente publicamos la entrada y listo, ya tendrán su índice de entradas en su Blog.

      -Vía V-Junker

      Poner una faviconera en la cabecera del blog


      Hace poco, me encontré como poner una faviconera en Blogger, gracias a Joaco un compañero de Forobeta, y es muy fácil implementarlo en la cabecera (header) de nuestro Blog.
      Si no sabes que es un favicon?, checa la siguiente entrada que publique hace tiempo. La faviconera que vamos a colocar, así quedaría:
      faviconera en la cabezera

      Primero nos vamos a Diseño > Edición de HTML y antes de ]]</b:skin> pegamos lo siguiente:
      #faviconera { padding: 2px; /* espacio general entre los favicons y el borde de la faviconera */ padding-top: 4px; /* espacio superior entre los favicons y el borde de la faviconera */ text-align: center; /* alineacion de los favicones */ border-bottom: 1px solid #DDDDDD; /* estilos del borde inferior */ border-left: 1px solid #DDDDDD; /* estilos del borde izquierdo */ border-right: 1px solid #DDDDDD; /* estilos del borde derecho */ background: #FAFAFA; /* color del fondo de la faviconera */ -moz-border-radius-bottomleft:10px; /* grado de la curva de la esquina inferior izquierda (mozilla firefox) */ -webkit-border-bottom-left-radius:10px; /* grado de la curva de la esquina inferior izquierda (google chrome, safari, opera) */ -moz-border-radius-bottomright:10px; /* grado de la curva de la esquina inferior derecha (mozilla firefox) */ -webkit-border-bottom-right-radius:10px; /* grado de la curva de la esquina inferior derecha (google chrome, safari, opera) */ } #faviconera img { padding:1px; /* espacio entre cada favicon */ border:1px solid #dddddd; /* estilos del borde de las imagenes */ filter:alpha(opacity=50); /* opacidad de los favicones (mozilla firefox) */ opacity:.50; /* opacidad de los favicones (google chrome, safari, opera) */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* opacidad de los favicones (internet explorer)*/ } #faviconera a img:hover { filter:alpha(opacity=100); /* opacidad de los favicones al pasar el cursor (mozilla firefox) */ opacity:1; /* opacidad de los favicones al pasar el cursor (google chrome, safari, opera) */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* opacidad de los favicones al pasar el cursor (internet explorer) */ }
      Luego de hacer esto, buscamos ahí mismo en la plantilla lo siguiente:
      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
      Lo que está en rojo muestra el número de gadgets que podemos colocar en la cabecera (header), tenemos que poner un número más grande, por ejemplo "5" para agregar más gadgets.
      Ahora guardamos los cambios, y nos vamos a Diseño > Elementos de la página > Añadir un elemento HTML/Javascript y agregamos lo siguiente:
      <div id="faviconera"> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> <a href="URL FAVICON"><img src="http://i1205.photobucket.com/albums/bb440/VJunkercom/interrogacionfinal.png" /></a> </div>
      Solamente cambiamos lo que está en rojo por la url del enlace donde va dirigido el favicon y lo que está en azulpor la url de la imagen del favicon que tiene que estar en tamaño 16 x16, ahora guardamos y tenemos que mover el gadget por encima de la cabecera (header) y listo ya tendremos nuestra faviconera.


      Enhanced by Zemanta

      Colocar el botón agragar a Favoritos en Blogger

      Tal vez sea un pequeño truco el que les voy a enseñar, pero algo útil para algunos para que tus visitantes te agreguen a sus favoritos mediante un botón práctico y fácil de colocar, se basa mediante un script.
      Primero nos vamos a Diseño > Elementos de la página > Añadir un elemento HTML/Javascript y pegamos lo siguiente:
      <script language="JavaScript"> function agregar(){ if ((navigator.appName=="Microsoft Internet Explorer") && (parseInt(navigator.appVersion)>=4)) { var url="URL DE TU BLOG"; var titulo="TITULO DE TU BLOG"; window.external.AddFavorite (url,titulo); } else { if(navigator.appName == "Netscape") alert ("Presiona Crtl+D para agregar TITULO DE TU BLOG a tus favoritos"); } } </script> <input value="Agregar a favoritos" onclick="javascript:agregar();" type="button"/>
      Ahora solamente cambiamos lo que está en rojo por lo que se nos pide, guardamos y lo movemos donde queramos que este el botón y listo.

      -Fuente, V-Junker

      Enhanced by Zemanta

      Cómo mostrar autómaticamente los posts de Blogger en Twitter




      Socialize de Feedburner es una excelente herramienta para mostrar a nuestros seguidores de Twitter los posts que publicamos en nuestro Blog. De seguro han visto plugins, scripts y demás, pero la mejor, la que utilizo y nunca he tenido problemas es esta.
      Para activar esta herramienta nos vamos a nuestra cuenta de Feedburner, seleccionamos el Feed que queremos utilizar en Twitter, de ahí le damos clic a Publicize, después a la opción de Socialize.




      De ahí hay que seleccionar la opción de Add a Twitter account donde tenemos que iniciar sesión en Twitter, pero si ya lo están entonces les abrirá una ventana avisándoles si queremos conectar la cuenta con Feedburner, le damos permitir.




      Una vez que veamos que nuestro usuario de Twitter estará seleccionado, solo falta darle unas modificaciones, como tipo de visualización de los títulos (solo el titulo, titulo y texto de la entrada, solo texto de la entrada), así como agregar el enlace hacia el post, texto adicional.
      Mientras estemos modificando las opciones, nos mostrara una vista previa de los cambios hechos.




      Una vez satisfechos por los cambios, activamos la herramienta y por ultimo le damos en guardar.
      Ahora cada vez que publiquemos un post, se mostrara también ha nuestros seguidores de Twitter.




      Si quieres recibir las actualizaciones del momento, te invito a suscribirte a nuestro Feed, al igual que nuestra cuenta deTwitter :D

      Enlace V-Junker
      Related Posts Plugin for WordPress, Blogger...