Articulos Etiquetados en:

Blogger

Colocar el Fan box de Facebook en Blogger

El Fan box es una aplicación de Facebook tipo botón “me gusta”, pero más grande y se muestra a los usuarios que se hicieron fan de tu Blog, para que lo pongas en la sidebar o donde desees.

Lo primero que tenemos que hacer es ir a Diseño > Elementos de la página > Añadir un elemento HTML/Javascript y pegamos el siguiente código:

<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/es_LA" type="text/javascript"></script><script type="text/javascript">FB.init("1b8f0f706c312c05f42224b5b3399f80");</script><fb:fan connections="8" width="270" profile_id="###############" stream=""></fb:fan>

Solamente cambiamos lo que está con el símbolo “#” por el ID de la página de Facebook. El ID son los 15 dígitos al final de la url, por ejemplo:

Ejemplopaginafacebook


Ahora solamente guardamos los cambios y listo ya tendrán su Fan box en su Blog. Aquí un ejemplo de cómo quedaría:

Fan box vjunker

Oculte las imágenes de los perfiles por razones de privacidad.

Coloca un Chat "gratis" para tu Blog

Tal vez encuentres muchos chats para colocarlo en tu Blog, pero algunos no son lo que esperabas o algo complicados para colocarlos, pero aquí les dejo 4 chats muy buenos y sobre todo que son "gratis".

Cbox – Un chat bastante sencillo, entendible ya que esta en español.

Chat Cbox

 

Gabbly – Otro bonito y sencillo chat, que tampoco necesitas registrarte.

Chat Gabbly

 

Chatango – Excelente chat, a pesar que está en ingles para configurar los colores y opciones, es fácil de entender.

Chat Chatango

 

Xat – Este chat es fácil de colocar y no necesitas registrarte, solamente escoges el fondo, el tipo de iconos, el tamaño de la caja y listo, copias el código y lo colocas donde quieras, para mí el mejor de los tres anteriores.

Chat Xat

 

Y de momento son los que me parecen mas eficaces y fáciles de entender, es cuestión tuya de cual escoger, ahora tus visitantes tendrán otra forma de dejar su opinión o comunicación en tu Blog. :-P

Colocar botón "agregar a favoritos" a tu Blog

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.

Colocar 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 azul por 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.

Checa lo nuevo de Blogger en Draft Blogger

Hace poco conocí esta página de Draft Blogger de lo que trataba, y la verdad que es muy buena, ya que consiste en que aquí sacan los widgets, plantillas, y de más, antes de su lanzamiento al público, digamos como de prueba (beta) o un laboratorio.

Draft in Blogger

Es como si entraras a Blogger normalmente, pero en Draft también tienes que iniciar sesión, te mandara a escritorio (home), tendrás todo igual ya sean tus entradas, tus gadgets, widgets, comentarios, etc., solo cambia la apariencia de la interfaz y claro las nuevas modalidades añadidas que no se encuentran en Blogger. En un tiempo atrás las novedades eran:

  • Diseñador de plantillas
  • Crear pestañas
  • Crear módulos de encuestas automáticamente
  • Subir videos directamente a la entrada

Pero esas novedades ya están en Blogger. Ahora las nuevas que solo las puedes añadir en Draft son:

  • Entradas populares
  • Estadísticas del blog
  • Entradas recientes
  • Comentarios recientes

Pero más adelante les mostrare lo nuevo para colocar en tu Blog. Y bueno les recomiendo que visiten esta página para probar sus nuevas aplicaciones antes de que salgan al público.

Tutoriales Blogger y Wordpress, aplicaciones web, redes sociales, internet, tecnología, geek.
Red de Blogs