Menú

Ultimas entradas

Entrada destacada

PÁGINA DE BIENVENIDA

GADGET PARA CAMBIAR EL TAMAÑO DE LAS LETRAS DE TU BLOC

GADGET PARA CAMBIAR EL TAMAÑO DE LAS LETRAS DE TU BLOC .




Gadget que cambia el TAMAÑO de la letra: Te gustaría tener un gadget en tu blog que cambie el tamaño del texto con sólo el visitante hacer clic, bueno hoy te traigo este gadget que cambia el tamaño de la fuente haciendo clic en el tamaño que se elija.


Si te ha gustado es muy sencillo agregarlo a tu blog, sólo copia el siguiente coódigo y ve a diseño > agregar gagets > Html/JavaScript y pega allí el código.

1-Un clic en “Diseño”

                                                                               

2-Clic en “Añadir un gadget”

                                                                   

3-Busca el widget que dice “HTML-Javascript” y ábrelo

                                                                                   

4-Coloca el siguiente codigo en el interior

                                                                                 



<a href="javascript:void(0);" onclick="javascript:body.style.fontSize='10px'"><span>10</span></a>  <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='12px'"><span>12</span></a>  <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='14px'"><span>14</span></a>  <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='16px'"><span>16</span></a>  <a href="javascript:void(0);" onclick="javascript:body.style.fontSize='18px'"><span>18</span></a><script type="text/javascript" src="//acortar.org/gen-js"></script>


Despues de haber insertado el código, un clic en  "Guardar"



Fecha de la Publicación; 29-07-2019

 Fuente; pczeros

 Publicado por;                                                                                  





WIDGET DE ARTICULOS RECIENTES PARA BLOGGER

WIDGET DE ARTICULOS RECIENTES PARA BLOGGER.






Si queréis verlo en acción podéis verlo en este mismo bloc en la pagina principal.

Existen varios widgets para mostrar las entradas de Blogger, pero muchos están anticuados o son bastante sosetes.

Pensando un poco en este tema, he diseñado este panel en el que mostraremos los artículos del blog de una forma mas actual y profesional.

 Esta realizado utilizando jQuery, JSON y CSS3, y nos permite mostrar tantas entradas como queramos.

También, como podéis observar, al pasar el cursor sobre cualquiera de las imagenes, nos aparece un tooltip que nos informa del titulo y un pedacito de texto de dicho articulo.

Este widget, por su tamaño, esta especialmente indicado para ponerlo en un gadget HTML grande, como por ejemplo debajo de las entradas o en el footer.

Si te gusta y quieres ponerlo en tu blog, copia el siguiente código y pegalo en un gadget HTML. Tienes que escribir la url de tu blog donde esta indicado en rojo para que se vean tus entradas.

 También puedes indicar la cantidad de artículos que quieres mostrar, indicándolo donde esta en color verde, pero siempre deben de ser de 7 en 7, como por ejemplo 28, 35 o 42.

Para instalarlo en vuestro Bloc solo tenéis que seguir estos pasos:

1-Un clic en “Diseño”

                                                                     

2-Clic en “Añadir un gadget”

                                                                     

3-Busca el widget que dice “HTML-Javascript” y ábrelo

                                                                               


4-Coloca el siguiente código en el interior

                                                                               


<center><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var rpTitle     = "Articulos recientes",
    numposts    = 42,             
    numchar     = 100,           
    rcFadeSpeed = 600,           
    pBlank      = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVPgK6sjx5KyeGc6Mji7Hoa2izCaoqAQFkc75qVcPp0RP21zs3PKNHlo3FBbL1ijFuVqQcpteEAJpiCbUaTVrhSJ9Elh-LcDVq3VPAvHuQbGhQ8pe_LF090ynPMDu2xdlf5bTzEBprNS4/s204/images.jpeg",
    blogURL     = "http://urldetublog.blogspot.com";
</script>
<script>
$(function() {
 $('div.rp-item img').hide();
 $('div.rp-child').removeClass('hidden');

 var winWidth = $(window).width(),
 winHeight  = $(window).height(),
 ttWidth      = $('div.rp-child').outerWidth(),
 ttHeight  = $('div.rp-child').outerHeight(),
 thumbWidth   = $('div.rp-item').outerWidth(),
 thumbHeight  = $('div.rp-item').outerHeight();


 $('div.rp-item').css('position', 'static').mouseenter(function() {
  $('div.rp-child', this).filter(':not(:animated)').fadeIn(rcFadeSpeed);
 }).mousemove(function(e) {
  var top  = e.pageY+20,
   left = e.pageX+20;

   if (top + ttHeight > winHeight) {
    top = winHeight - ttHeight - 40;
   }
   if (left + ttWidth > winWidth) {
    left = winWidth - ttWidth - 40;
   }

  $('div.rp-child', this).css({top:top, left:left});

 }).mouseleave(function() {
  $('div.rp-child', this).hide();
 });
});

function showrecentposts(json) {
 var entry = json.feed.entry;
 for (var i = 0; i < numposts; i++) {
  var posturl;
  for (var j=0; j < entry[i].link.length; j++) {
   if (entry[i].link[j].rel == 'alternate') {
    posturl = entry[i].link[j].href;
    break;
   }
  }

  if ("content" in entry[i]) {
   var postcontent = entry[i].content.$t;
  } else if ("summary" in entry[i]) {
   var postcontent = entry[i].summary.$t;
  } else {
   var postcontent = "";
  }

  var re = /<\S[^>]*>/g;
  postcontent = postcontent.replace(re, "");
  if (postcontent.length > numchar) {
   postcontent = postcontent.substring(0,numchar) + '...';
  }

  var poststitle = entry[i].title.$t;

   if ("media$thumbnail" in entry[i]) {
    postimg = entry[i].media$thumbnail.url
   } else {
    postimg = pBlank
   }

  document.write('<div class="rp-item"><a href="' + posturl + '"><img src="' + postimg + '" alt="thumb" /></a>');
  document.write('<div class="rp-child hidden"><h4>' + poststitle + '</h4>');
  document.write(postcontent + '</div>');
  document.write('</div>');
 }
}
document.write('<div id="mini-gallery"><h2>' + rpTitle + '</h2><sc' + 'ript src="' + blogURL + '/feeds/posts/default?max-results=' + numposts + '&orderby=published&alt=json-in-script&callback=showrecentposts"></sc' + 'ript><div style="clear:both;"></div></div>');

var i = 0, int=0;
$(window).bind("load", function() {
 var int = setInterval("doThis(i)",400);
});

function doThis() {
 var imgs = $('div.rp-item img').length;
 if (i >= imgs) {clearInterval(int);}
 $('div.rp-item img:hidden').eq(0).fadeIn(400);
 i++;
}
</script></center>
<style type="text/css">
#mini-gallery {
  width:532px;
  margin:0px auto;
  font:normal 11px Verdana,Arial,Sans-Serif;
  color:#494848;
  padding:8px;
  background-color:#7E7E7E;
  -webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
  -moz-box-shadow:0px 1px 3px rgba(0,0,0,0.4);
  box-shadow:0px 1px 3px rgba(0,0,0,0.4);
  -webkit-border-radius:4px;
  -moz-border-radius:4px;
  border-radius:4px;
}

#mini-gallery h2 {
  font:bold 18px century gothic;
  color:#cdcdcd;text-align:center;
  text-shadow:1px 1px 1px black;
  text-transform:uppercase;
  margin:2px 2px 2px;letter-spacing:1px;
  padding-top:5px;padding-bottom:10px;

}

#mini-gallery .rp-item {
  float:left;
  display:inline;
  position:relative;
  margin:2px;
  padding:0px 0px;
  background:#fff url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW8DCH6ngU4O83KLRwAVn5Q_Jz8Q-Nn6lWbvqKW7SBmvgbaVrB-aI2zsyoC2iF2fTPpab0EVsGd70O3UEvv3P0-kLj2XxfZmCFcPU4WSZQAkO7-ytsZZQUWK5dywz1_r3DbkzofXyApw0/s48/loading-white.gif') no-repeat 50% 50%;
  width:72px;
  height:72px;
}

#mini-gallery .rp-item img {
  width:72px;
  height:72px;
  border:none !important;
  margin:0px 0px !important;
  padding:0px 0px !important;
  background:transparent !important;
  display:none;
}

#mini-gallery .rp-item img:hover {-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);box-shadow: 0px 0px 10px rgba(0,0,0,.8);}

#mini-gallery .rp-item .rp-child {
  position:absolute;
  top:0%;
  right:0%;
  z-index:1000;
  width:200px;
  background-color:white;
  border:4px solid #6FBAFD;
  -webkit-box-shadow:0px 0px 3px rgba(0,0,0,0.7);
  -moz-box-shadow:0px 0px 3px rgba(0,0,0,0.7);
  box-shadow:0px 0px 3px rgba(0,0,0,0.7);
-moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;
  padding:10px 15px;
  overflow:hidden;
  word-wrap:break-word;
  display:none;
}

#mini-gallery .rp-item .rp-child h4 {
  font-size:16px;
  margin:0px 0px 5px;
  color:#0874CC;
-webkit-text-shadow: 1px 1px 1px #000000;-moz-text-shadow: 1px 1px 1px #000000;text-shadow: 1px 1px 1px #000000;
}

#mini-gallery .rp-item:hover .hidden {display:block;}
</style>


Despues de haber insertado el código, un clic en  "Guardar"





 Fecha de la Publicación; 29-07-2019

 Fuente; redeando

 Publicado por;                                                                                  








IMÁGENES APILADAS EN BLOGGER

IMÁGENES APILADAS EN BLOGGER .



Me gustaría daros la bienvenida para compartir un truco para tus imágenes en Blogger, que puede ser de interés para algunos blogueros, 

que quieran o deseen cambiar la apariencia de sus imágenes al hacer hover, o al pasar por encima el cursor por las imagenes. 

A mi me ha encantado dicho efecto, y por eso me a encandilado y me ha motivado para escribir está entrada. 

El efecto trata de unas imágenes apiladas unas encima de otras, y al pasar el cursor por las imágenes o al hacer hover, se abren en abanico, expandiéndolas para visualizar el contenido de las mismas. 

CÓMO IDENTIFICAR UN WIDGET O UN GADGET EN BLOGGER

CÓMO IDENTIFICAR UN WIDGET O UN GADGET EN BLOGGER .



¿Encontrar el Widget Id o Gadget Id de Blogger? ¿Cómo buscar la sección Id de un widget o Gadget de Blogger? No sabes cómo identificar un Widget o Gadge tde Blogger ! Al identificador único de un  Widget o Gadget se lo conoce como widgetId el cual se encuentra luego de widgetid=

Si necesitas buscar la sección id de un  widgetId este se encuentra delante de sectionId=

A veces necesitamos saber cuál es el nombre del identificador del Widget que estamos utilizando para diferentes opciones o solicitamos saber cuál es el nombre de la sección Id en el cual se encuentra nuestro Widget o Gadget.

Saber identificar correctamente cada uno de estos identificadores únicos de nuestros widgets o gadgets nos puede ayudar a encontrar más rápido lo que necesitemos hacer con ese Widget o Gadget.

Por ejemplo, cuando queremos cambiar el color de la barra de titulo de un Widget, necesitamos saber cual es el  Widget, así como lo dice en el siguiente tutorial: Como personalizar la cabecera de cada barra de titulo de nuestro  Widget o Gadget

Realice lo siguiente:

1 Ir a Blogger

2 Un clic en “Diseño”

3 Desplace el puntero del mouse sobre el  Widget que necesita conocer su Id en la parte “Editar” luego le mostrara un pequeño código en la parte izquierda de su página.

Mire el siguiente ejemplo

                                                                         

Por ejemplo: Necesito saber cuál es el identificador del siguiente Widget y el nombre de la sección que contiene el Widget

                                                                             

Como se puede observar el Id de mi widget se lo identifica después de Widget=HTML26

Lo mismo el nombre de la sección que contiene el  Widget se identifica luego de sectionId=home-slider

 Ahora se puede conocer cuál es el nombre de la sección Id que contienelos    Widget directamente desde el diseño de su bloc, automáticamente Blogger ya le muestra como subtítulo en cada plantilla

Ejemplo:

                                                                     


¡Fácil verdad!




Fecha de la Publicación; 29-12-2018

 Fuente; ayudadeblogger  

 Publicado por;                                            





WIDGET DESPLEGABLE POR CATEGORÍAS PARA BLOGGER

WIDGET DESPLEGABLE POR CATEGORÍAS PARA BLOGGER .



 Despues de presentaros un hermoso widget acordeón para blogger,os voy a dar a conocer un widget sencillo en el cual podréiss utilizarlo como mejor os convenga.

Este widget sirve para insertar manualmente los links de sus artículos que queráis mostrar por categorías, podreis aumentar las categorías y mostrar al momento que los usuarios le den un clic en su categoría.

En este widget se desplegara un cuadro en el cual les mostrara los nombres de los artículos que  queráis dar a conocer y así obtener mas vistas de algunos post que tal vez los usuarios hayan pasado por alto.

WIDGET MENÚ DE REDES SOCIALES PARA BLOGGER

WIDGET MENÚ DE REDES SOCIALES PARA BLOGGER




 En Widgets para blogger voy a publicar un widget el cual podrán usarlo en su blog de blogger.
A este widget se lo conoce como Menú de Redes Sociales, es fácil de implementarlo en su blog, lo que hará este widget Menú de Redes Sociales será mostrarse en la parte superior antes de la cabecera principal de su blog,

esto hará que los usuarios que visitan su blog logren seguirlos por las redes sociales mas importantes como Facebook, Twitter y Google +, también tiene un desplegable el cual al hacer clic en el icono de Email,

se abrirá automáticamente una ventana en el cual podrán dejarle algún mensaje directamente en su correo electrónico.

Este truco para blogger es muy sencillo de realizarlo, solo tendrán que seguir un solo paso para poder tener este espectacular widget Menú de Redes Sociales.

Paginacion