Mostrando entradas con la etiqueta Diseño-añadir gadget-código HTML. Mostrar todas las entradas
Mostrando entradas con la etiqueta Diseño-añadir gadget-código HTML. Mostrar todas las entradas

lunes, 2 de julio de 2012

Gadget para que enlacen tu blog

Este gadget nos servirá como un agregador de modo que con un sólo click el lector podrá poner en su blog nuestro banner para que nos enlacen sin necesidad de seleccionar, copiar y pegar, sólo hay que hacer click en el botón y Blogger lo agregará en el blog que el lector elija.
Para insertarlo, iremos como siempre a Diseño-Añadir gadget-Código HTML y pondremos el código de abajo:

<img src="URL de la imagen"/><form action="http://beta.blogger.com/add-widget"method="POST"><input value="FAVORITO" name="widget.title"type="hidden"/><textarea style="display:none;"name="widget.content"><a href="URL del blog"><img src="URL de la imagen" alt="Título del blog" /></a></textarea><inputvalue="http://buzz.blogger.com" name="infoUrl"type="hidden"/><inputvalue="http://www.blogger.com/img/icon_logo32.gif" name="logoUrl" type="hidden"/><input value="Enlaza mi Blog" name="go" type="submit"/></inputvalue="http:></inputvalue="http:></form>

Donde pone Url de la imagen, pondremos el enlace de la imagen que queramos que aparezca.
Donde pone Url del blog, pondremos el enlace de nuestro blog.
Donde pone Título del blog, pondremos el título de nuestro blog.

Puedes ver como queda el mío en la columna lateral derecha.

Poner "Ultimos Comentarios" en una barra lateral en tu blog es muy útil para ti y para los usuarios de tu blog. Además le dará más vidilla.
Vamos a ver algunas formas muy sencillas para añadir este gadget:


1.- Desde el menú Blogger,vamos a : Diseño--> Elementos de pagina--> Añadir un gadget--> "a la izquierda" Mas gadgets--> y hay veremos recents comments...solo queda elegir el tamaño en "px" y el nº de comentarios.

 


2.- Otra vez menú en este caso al Añadir un gadget miraremos en "lo básico", y añadiremos "FEED", y pondremos esto:

 http://url del blog/feeds/comments/full

Que en el caso de mi blog seria : http://degabyla.blogspot.com.es/feeds/comments/full 

Así de esta manera saldrán los últimos comentarios y se irán actualizando, acto seguido de introducir esto, damos a continuar, y ponemos como titulo: "Ultimos Comentarios",  y elegimos también el nº de comentarios, fecha y nombre del/la que comenta.


3.- También puedes entrar en esta página, Way2blogging y te saldrá un cuestionario como éste:


Ahora sólo tienes que rellenarlo con los datos de tu blog y los valores que quieras darle al gadget. Incluso puedes elegir el avatar que quieres que salga por defecto. Después pulsa en el cuadradito que pone GENERATE y te saldrá un botón para añadas el gadget a tu blog de blogger directamente.


Pulsa ahí y ya está, quedará añadido.

Otra opción es ir a Diseño-añadir un gadget-código Html java y poner este código

<script style=text/javascript src="http://helplogger.googlecode.com/svn/trunk/recent comments widget.js"></script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=http://your-blog-name.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><span id=rcw-cr><a href=http://helplogger.blogspot.com/2012/03/recent-comments-widget-for-blogger.html>Recent Comments Widget</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;} </style>

Lo que está en rojo lo tienes que sustituir por la Url de tu blog, en mi caso sería http://degabyla.blogspot.com/ 

Gadget Sistema de puntuaciones

El siguiente gadget nos permitirá poner un sistema de puntuaciones en nuestro blog con el que los usuarios podrán calificar las entradas con dos sistemas de puntuaciones:



Para instalarlos, simplemente tienes que colocar el código correspondiente en HTML al pie de cada entrada que quieras que te evalúen

Gadget Buscador vídeos de YouTube

Este gadget permite añadir en el blog un buscador de vídeos de youtube que tiene una pestaña (en ingles) en la que puedes elegir las ultimas novedades, los mas votados, los mas vistos y, por supuesto una barra para que hagas tu propia búsqueda personalizada.
Los vídeos de youtube aparecen de seis en seis con imágenes con miniaturas y paginación, al hacer click en una de ellas aparece el vídeo para visionarlo.
Lo que no se puede cambiar es el tamaño del Gadget, ya que no se veria a tamaño completo.

Para añadir el gadget del buscador de vídeos de youtube en tu blog , solo tienes que copiar el siguiente código y ponerlo donde quieras mostrarlo, en un nuevo gadget en tu blog o en una entrada como los anteriores


Gadget Top comentaristas



Este otro gadget es un Top comentaristas en forma de nube, con los nombres de las personas que más comentarios han hecho y el número al lado.

Para colocarlo en tu blog como siempre Diseño-añadir gadjget-HTML y copias el código de abajo


Ahora ya sólo cambia http://www.gadgetsblogger.com/  por la dirección de tu blog. Podrás también controlar el número de comentaristas editando la cifra 30 en la línea &ShowHowMany=30.

Gadget Poner una radio en tu blog



Poner una radio online para poner en el blog es una de las cosas que mas se busca. Voy a dejar un gadget que es precisamente eso, una página web con nos ofrece dos reproductores para poner en nuestro blog, que se añadirán como siempre desde Diseño-añadir gadjet.
El primer código es una radio con cuatro canales y el segundo sólo con uno.



Gadget Lista de Backlinks



Este gadget  nos ofrece un sistema de obtener Backlinks Gratis hacia nuestro blog. Se trata de un código que nos genera 32 mini-banners que apuntan a diferentes servicios web que generan páginas dinámicas con enlaces hacia la página o el dominio desde donde fue generado, y que se puede instalar muy facil en nuestro blog igual como un gadget. De esta manera, se obtiene 32 backlinks gratis (casi todos de diferentes dominios) , esto significa que nuestro blog sera indexado más rápido en los buscadores ( google, yahoo, bing ..etc ) y asi recibiras mas visitas hacia tu blog. Estos backlinks son indexables, dofollow y provienen de dominios de alto renombre como : Alexa, W3C, Pingdom, Whois, Pagerankr, Webstore ...etc.
Para colocarlo sólo tienes que entrar en esta página, poner el enlace de tu blog y crear el código. Luego como siempre, lo añades a tu blog en Diseño-añadir gadget-código HTML

Gadget Ultimas entradas




Con este gadget podremos  tener en nuestro blog los posts más recientes con imagenes en miniatura . Tiene otras características como los números de los comentarios, etc...
Para ponerlo, sólo hay que añadir el código en Diseño-añadir gadget-código HTML


Donde pone TUBLOG, tienes que poner el nombre del tuyo.

Poner un botón para subir y bajar

Poner el boton de Subir y Bajar en tu blog te vendrá muy bien sobre todo cuando en la página principal hay muchas entradas o si hay alguna entrada con muchos comentarios.

Para añadirlo vamos a Diseño-añadir gadget-HTML / Javascript y ponemos el siguiente código:

<div id="navigation_up_down_79136"><noscript>Javascript is disable - <a href="http://www.webestools.com/">Webestools</a> - <a href="http://www.webestools.com/navigation-buttons-generator-scroll-top-bottom-shortcut-page-up-down-scroll-buttons-javascript.html">Navigation Buttons Generator html scroll up down</a></noscript><script type="text/javascript" src="http://services.webestools.com/navigation_up_down/1-79136-right.js"></script></div>

Así los botones aparecerán abajo a la derecha de tu blog, pero si quieres que aparezcan a la izquierda, pon este:

<div id="navigation_up_down_79136"><noscript>Javascript is disable - <a href="http://www.webestools.com/">Webestools</a> - <a href="http://www.webestools.com/navigation-buttons-generator-scroll-top-bottom-shortcut-page-up-down-scroll-buttons-javascript.html">Navigation Buttons Generator html scroll up down</a></noscript><script type="text/javascript" src="http://services.webestools.com/navigation_up_down/1-79136-right.js"></script></div>

Y listo, tus lectores se moverán más rápido por tu blog.

Gadget para que no puedan hacer copia y pega

Si no quieres que tus lectores hagan copia y pega de las entradas o artículos de tu blog puedes evitarlo poniendo este gadget, sólo tienes que ir a Diseño-añadir gadget-HTML y poner este código:

<script language="Javascript"><!-- Beginfunction disableselect(e){return false}function reEnable(){return true}document.onselectstart=new Function ("return false" )if (window.sidebar){document.onmousedown=disableselectdocument.onclick=reEnable}// End --></script>

Das a guardar y ya está...Espero que te sea útil

Poner nieve cayendo en tu blog


Ahora que estamos en invierno quizás te apetezca decorar tu blog con un ambiente más acorde a la estación. Por ejemplo puedes poner un gadget para que caiga nieve. Es muy fácil, vamos a Diseño-añadir gadget-código HTML y ponemos este código 




<script type="text/javascript">
  //Configure below to change URL path to the snow image
  var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqchb5WiqnoUTpN_IeDOH3F4pNVtfabpLMijjJZ5tNEj8oSmuROk7xP4u0ySWjdGcC1aBLl94jpzZRtfZz-m1A6NClG8-UCtDS5ph4B2E_Thb3PXaO_I1wjtgZw_NTk5MTKJO2OcmYDEE/s400/snow.gif"
  // Configure below to change number of snow to render
  var no = 30;
  // Configure whether snow should disappear after x seconds (0=never):
  var hidesnowtime = 0;
  // Configure how much snow should drop down before fading ("windowheight" or "pageheight")
  var snowdistance = "pageheight";
///////////Stop Config//////////////////////////////////
  var ie4up = (document.all) ? 1 : 0;
  var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
  var dx, xp, yp;    // coordinate and position variables
  var am, stx, sty;  // amplitude and step variables
  var i, doc_width = 800, doc_height = 600;
  if (ns6up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
  } else if (ie4up) {
    doc_width = iecompattest().clientWidth;
    doc_height = iecompattest().clientHeight;
  }
  dx = new Array();
  xp = new Array();
  yp = new Array();
  am = new Array();
  stx = new Array();
  sty = new Array();
  snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "http://2.bp.blogspot.com/-MsCdyoGtGdA/UX5gk72qNoI/AAAAAAAAAfQ/LaKTmUG-aJM/s1600/snow+falling+effect.gif" : snowsrc
  for (i = 0; i < no; ++ i) {
    dx[i] = 0;                        // set coordinate variables
    xp[i] = Math.random()*(doc_width-50);  // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*20;         // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random();     // set step variables
        if (ie4up||ns6up) {
      if (i == 0) {
        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
      } else {
        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
      }
    }
  }
  function snowIE_NS6() {  // IE and NS6 main animation function
    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
        doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
    for (i = 0; i < no; ++ i) {  // iterate for every dot
      yp[i] += sty[i];
      if (yp[i] > doc_height-50) {
        xp[i] = Math.random()*(doc_width-am[i]-30);
        yp[i] = 0;
        stx[i] = 0.02 + Math.random()/10;
        sty[i] = 0.7 + Math.random();
      }
      dx[i] += stx[i];
      document.getElementById("dot"+i).style.top=yp[i]+"px";
      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
    }
    snowtimer=setTimeout("snowIE_NS6()", 10);
  }
    function hidesnow(){
        if (window.snowtimer) clearTimeout(snowtimer)
        for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
    }
if (ie4up||ns6up){
    snowIE_NS6();
        if (hidesnowtime>0)
        setTimeout("hidesnow()", hidesnowtime*1000)
        }
</script>

Puedes cambiar el número 30 que está en negrita por cualquier otro según los copos que quieres que caigan.

Gadget del enlace directo con texto

Hay veces en las que queremos hacer por ejemplo un intercambio de enlaces o que la Url de nuestro blog aparezca en algún sitio, pero queda mucho mejor si aparece un texto, como puede ser el título del blog. Con este gadget tan sencillo podrás poner cualquier texto que al pinchar encima de él lleve a la Url que tú quieras. Para colocarlo como siempre lo haremos desde Diseño-Añadir nuevo gadget-Html, lo pegamos y ya está.

<a href="URL que quieres enlazar">TEXTO QUE QUIERES QUE APAREZCA</a>

Por ejemplo, el texto de abajo te lleva directamente a este blog.

Como poner debajo de las entradas una lista de posts relacionados

Una manera de que tus visitantes puedan ver de un vistazo más cosas que les pueden interesar de tu blog, es poner debajo de las entradas una lista de otros posts que les pueden interesar. Es muy fácil hacerlo si sigues estos pasos:

Primero tenemos que ir a esta página: http://www.linkwithin.com/learn y nos saldrá un cuadro como este


Donde pone email pones tu dirección de correo y debajo la Url de tu blog. Donde pone Plataform, pinchas en la flechita y te saldrá un desplegable con varias opciones para que elijas la plataforma de tu blog, por ejemplo Blogger y en con la otra flechita de abajo podrás elegir cuantos posts quieres que se mencionen en el listado. Yo suelo poner 5 porque me queda perfecto con el ancho de la entrada, pero eso a tu gusto.
Si tu blog esta escrito con letras de color claro sobre fondo oscuro, marcas el caudradito de My blog...y ya está, ahora pulsas en Get Widget! y te llevará a una página donde te saldrá esto


Pincha en Install Widget y saldrá un cuadro como este


Puedes cambiar el título si quieres, si no, lo dejas como esta y pinchas en Editar contenido y se te abrirá un cuadro con código HTML.


Y ahora ya sólo nos queda colocarlo en su sitio así que vamos a hacer Copia y pega como con cualquier código. Lo copiamos y nos vamos a nuestro blog a Diseño-añadir gadget-código HTML y lo pegamos. Damos a Guardar y ya tendremos el gadget añadido. En mi caso, es el primer cajetín que sale en la columna de la derecha. Pero quedará mucho mejor si lo movemos debajo del cuadro de las entradas


Para eso, solo tendremos que pinchar con el ratón y arrastrarlo. Y nos quedará así. Ya solo nos queda pinchar en Guardar disposición


Y ya tendremos debajo de cada entrada una relación de otros posts para que nuestros visitantes puedan verlos.
Si las entradas tienen imagen, el listado saldrá con imagen y en horizontal un post al lado del otro, si no es así te saldrá una lista en vertical y sin imagen. En este blog podrás ver como quedan las dos.







Gadget Estadísticas de tu blog

El gadget que os presento ahora es para poner las estadísticas de tu blog. Te muestra el número de entradas, de comentarios y los días que lleva on line.

Añadirlo es muy sencillo. Vas a Diseño-añadir gadget-código HTML y copiar el siguiente código:
y guardarlo.

 

Para que funcione  cambia esta fecha : DiasOnline (22, 1, 2009, "" ), por la fecha que abriste tu blog, puedes saberlo viendo la fecha de tu primer post; primero va el día, luego el mes y por último el año.

Y está dirección : http://nombre-de-mi-blog.blogspot.com, dos veces por la dirección de tu blog.