Menú

Ultimas entradas

Entrada destacada

PÁGINA DE BIENVENIDA

Mostrando entradas con la etiqueta widgets. Mostrar todas las entradas

WIDGET DE IMÁGENES PARA BLOGGER

WIDGET DE IMÁGENES PARA BLOGGER .





 Voy a revelar un truco muy simple para blogger y así lo puedas usar en tu blog de blogger. En trucos para blogger encontraras un widget único con imágenes y una pequeña descripción de tu artículo.

Estoy revelando los grandiosos trucos para blogger con un solo código y podrás obtener este grandioso widget para blogger. Lo podrás usar como tú lo prefieras, en un sidebar o en un post artículo, como tu quieras.

Además podrás aumentar o disminuir las imágenes y como también aumentar el numero de imágenes que quieras mostrar en este widget.




La inserción del código es muy simple, solo debes seguir las instrucciones de configuración al momento de insertar el código.

La idea es dar a conocer los artículos que a veces los usuarios pasan por alto, pero con este widget podrás obtener mas vistas de las páginas que no la tenían.

A continuación mire su demostración en mi blog de demos, al widget lo tengo puesto en el sidebar, pero ustedes también lo podrán poner en algún articulo.




Te gusto verdad!!

Luego de ver su demostración nos dirigimos a trabajar


 Da un clic en “Diseño”




 Da otro clic en “Añadir un gadget”




 Luego se te abrirá una nueva venta en la cual deberás buscar el widget que dice “HTML/Javascript”





Ingresa el siguiente código en su interior









<script language="JavaScript">

imgr = new Array();


imgr[0] = "";

imgr[1] = "";

imgr[2] = "";

imgr[3] = "";

imgr[4] = "";

showRandomImg = true;

tablewidth = 290;

cellspacing = 5;

borderColor = "#fff";

bgTD = "#0b92be";

imgwidth = 185;

imgheight = 250;

fntsize = 14;

acolor = "#FFF";

aBold = true;

icon = " + ";

text = "Comentar";

showPostDate = false;

summaryPost = 0;

summaryFontsize = 1;

summaryColor = "#000";

icon2 = " &rarr; ";

numposts = 5;

home_page = "http://plantillapietro.blogspot.com/feeds/posts/default/-/Farandula";

</script>
<script src="http://sites.google.com/site/musikjisite/js/recent-categori.js" type="text/javascript"></script>

Realiza estos cambios:

Primero debes borrar solo el texto que esta marcado de color purpura plantillapietro.blogspot.com y cámbialo por el nombre de tu pagina web, recuerda solo copia el nombre tal y cual lo tengo señalado, no vayas a copiarlo así; (http://plantillapietro.blogspot.com/) ya que cometerías un error y no se mostrara las imágenes en el widget.

Además también deberás borrar el nombre que se encuentra marcado de color verde Farandula y poner el nombre de cualquier etiqueta que quieras mostrar en este widget, recuerda poner solo un nombre de una etiqueta.

Que es una Etiqueta más información en este enlace

Si quieres aumentar el numero de imágenes en tu widget, deberás buscar este código numposts = 5;   y solo deberás borrar el numero 5 por el numero de imágenes que quieras mostrar en tu widget, por ejemplo podrás poner el numero 8, 10, 12, etc.

Para cambiar el tamaño de la imagen de tu widget busca este código:

imgwidth = 185;

imgheight = 250;

Cambia los números que están marcados de color azul, por ejemplo si quieres aumentar el ancho de la imagen deberías cambiar el numero en este punto imgwidth = 185;  cambia el numero 185 por el numero que tu quieras, al igual si deseas aumentar el tamaño de la imagen de forma vertical, cambia en este punto imgheight = 250;  por el numero que tu quieras.

Si deseas que el widget se vea mas grande deberas buscar este código tablewidth = 290; y cambiar el numero 290 por el numero que tu quieras.

Eso es todo, ahora dale un clic en “Guardar”, ubica tu widget donde tú quieras dar a conocer este nuevo widget.




Data de la Publicación; 12-08-2019

 Fuente;  ayudadeblogger

 Publicado por;                                                                    






CINCO FORMULARIOS DE CONTACTO PARA BLOGGER

CINCO FORMULARIOS DE CONTACTO PARA BLOGGER.



Una de las novedades que me perdí fue el gadget de Formulario de Contacto de Blogger, un formulario con el que nuestros lectores pueden ponerse en comunicación privada con nosotros sin necesidad de que ellos tengan que abrir el correo.

El gadget por sí solo es útil, y aunque no tiene opciones me parece que incluye los campos más básicos y suficientes que la mayoría de los bloggers necesita.

La ventaja de este gadget es que no tenemos que depender de servicios externos que luego nos limitan con un número mensuales de envíos y nos obligan a mantener visible su link.

La desventaja es que su diseño es demasiado simple, y tal vez esa sea una razón por la que muchos usuarios no se atreven a usarlo.

La buena noticia es que esa misma simplicidad de su diseño permite que podamos modificarlo a nuestro gusto y adaptarlo a nuestra plantilla.

Ya saben que no soy muy bueno con el diseño, no obstante ayer dedicando una horas realicé estos ejemplos con los que se podrán dar una idea de la manera como podemos transformar radicalmente estos widgets y pasar de los simple a lo llamativo.


Son 5 diseños, y el código está listo para copiar y pegar. Primero deberás tener el gadget del Formulario, si aún no lo tienes entra en Diseño | Añadir un gadget, se abrirá una ventanita, del menú de la izquierda selecciona Más gadgets y ahí elige Formulario de contacto.




Ya que lo tengas en tu blog entra en Plantilla | Edición de HTML y antes de ]]></b:skin> pega el código del estilo del formulario que prefieras. Guarda los cambios y listo.

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



1 Un clic en “Plantilla”

                                                                     



   2 Un clic en “Editar HTML”

                                                                         


  Ahora se te abrirá el Editor HTML de tu plantilla

                                                                               


En  este punto deberás presionar la tecla “Control” de tu teclado seguido de la tecla “F” para que aparezca el buscador integrado en la parte superior derecha de tu editor,
debes esperar unos segundos hasta que se muestre, aquí es donde tendrás que insertar el código para buscarlo e insertar los códigos correspondientes en el editor,

                                                                                         

3 Busca el siguiente código


]></b:skin>


4  Una vez que hayas encontrado el código deberás insertar las siguientes líneas de código justo arriba del código que encontraste

Estilo Básico



/* Formulario de Contacto, Estilo Básico
----------------------------------------------- */
/* Contenedor principal */
.contact-form-widget {
width:100%;
max-width: 280px;
margin: 0 auto;
margin-bottom: 25px;
float: left;
padding: 10px;
background: #d5dde6;
color: #000;
border: 1px solid #C1C1C1;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
border-radius: 5px;
}
/* Estilos de los campos */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
border-radius: 40px;
}
/* Campo del mensaje */
.contact-form-email-message {
padding: 5px;
border-radius: 5px;
}
/* Botón de enviar */
.contact-form-button-submit {
float: right;
width: 25%;
max-width: 35%;
height: auto;
background: #28597a;
padding: 2px 5px;
border-radius: 15px;
border: none;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #fff;
font-size: 13px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
font-weight: normal;
margin-bottom: 10px;
}
/* Botón de enviar al pasar el cursor */
.contact-form-button-submit:hover{
background: #4a7694;
border: none;
}

Estilo Postal



/* Formulario de Contacto, Estilo Postal
----------------------------------------------- */
/* Contenedor principal */
.contact-form-widget {
width:100%;
max-width: 280px;
margin: 0 auto;
margin-bottom: 25px;
padding: 10px;
border:none;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7FYmSj2H8jYMTmKg_v5XOI_4LvIUaMrIi_kE1sqORfH2YTEXzz4pY7YBfF2EfSmqLjSKxOsqjir1M6paZrOO27ZVvehKBxAsXe1EkZgXaX294mXyGbPGbhm3Gpp-yOl56dsgeizqpiPcY/s74/postal.png);
color: #000;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
/* Estilos del contenedor interno */
.contact-form-widget div.form {
background: #fff;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMA7YbHBwioppOyCgevXTAcUxmQ9LGXFPNZNtzT9rrbONCyaGxBxg8pinE0ybvXEOwJ3iUKVejsqRXyx0PtVXbsETINV2NvS0pIDrokbovQv5D27yYThdQ0Lt0ndpTiagVmADpJKcxpqPe/s133/stamp.png);
background-repeat: no-repeat;
background-position: 95% 85%;
padding: 1px 10px;
}
/* Estilos de los campos */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
}
/* Campo del mensaje */
.contact-form-email-message {
width: 60%;
max-width: 60%;
padding: 5px;
}
/* Botón de enviar */
.contact-form-button-submit {
width: 25%;
max-width: 35%;
height: auto;
background: #28597a;
padding: 2px 5px;
border-radius: 5px;
border: none;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #fff;
font-size: 13px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
font-weight: normal;
margin-bottom: 10px;
}
/* Botón de enviar al pasar el cursor */
.contact-form-button-submit:hover{
background: #a14248;
border: none;
}

Estilo Negro Limón



/* Formulario de Contacto, Estilo Negro Limón
----------------------------------------------- */
/* Contenedor principal */
.contact-form-widget {
width:100%;
max-width: 280px;
margin: 0 auto;
margin-bottom: 25px;
padding: 10px;
border:none;
background: #282828;
border-bottom: 35px solid #98bd3c;
color: #98bd3c;
}
/* Estilos de los campos */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
}
/* Campo del mensaje */
.contact-form-email-message {
padding: 5px;
}
/* Botón de enviar */
.contact-form-button-submit {
width: 25%;
max-width: 35%;
height: auto;
background: #98bd3c;
padding: 2px 5px;
border-radius: 2px;
border: none;
color: #282828;
font-size: 13px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
font-weight: normal;
margin-bottom: 10px;
}
/* Botón de enviar al pasar el cursor */
.contact-form-button-submit:hover{
background: #F9D423;
color: #282828;
border: none;
}

Estilo Girly



/* Formulario de Contacto, Estilo Girly
----------------------------------------------- */
/* Contenedor principal */
.contact-form-widget {
width:100%;
max-width: 280px;
margin: 0 auto;
margin-bottom: 25px;
padding: 10px;
border-top: 35px solid #d44897;
border-bottom: 10px solid #d44897;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWq_K-jKStn9jCRLNCPl6oPhRBy2dBRaqfG27arGCV-dKo3tlyNEPEg6ejPtSSpRZFirVU8qmqQf47l7Ml2J9ZCyB9oTGK8Nt76bDD_JL1VJ0xqIvSO4p6aKEwJfPU5rDnqzVf9_O8mdz3/s55/pink.png);
color:#424242;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
border-radius: 18px;
}
/* Estilos del contenedor interno */
.contact-form-widget:before {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR5p2X-bT2K-J0GL3U1_edOkK3Ihur27r_oc5VBV43vBA3a9tHQYgp3DTYJaDT8bS7h6i4NMrsC-AcGub886VP59Xf0enMuIGRrLhbwBvqjgtPZAnMVGOojjczbbnMIm7xeX6Do3csG7m3/s160/lazo.png);
background-repeat: no-repeat;
background-position: 100% 0;
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
pointer-events: none;
}
/* Estilos de los campos */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
}
/* Campo del mensaje */
.contact-form-email-message {
padding: 5px;
}
/* Botón de enviar */
.contact-form-button-submit {
width: 25%;
max-width: 35%;
height: auto;
background: #d44897;
padding: 2px 5px;
border-radius: 2px;
border: none;
color: #fff;
font-size: 13px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
font-weight: normal;
margin-bottom: 10px;
}
/* Botón de enviar al pasar el cursor */
.contact-form-button-submit:hover{
background: #d1f6ff;
color: #424242;
border: none;
}


Estilo Metálico



/* Formulario de Contacto, Estilo Metálico
----------------------------------------------- */
/* Contenedor principal */
.contact-form-widget {
width:100%;
max-width: 280px;
margin: 0 auto;
margin-bottom: 25px;
padding: 10px;
border-top: 35px solid #424242;
border-bottom: 25px solid #424242;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQwSZZ37kpS-3CynIXyNP44L2wGpnLjM1EuyJw_CEjrN2LjWw4NDH8h_9ymOD28pw3vduVw4Xh_hyDTVc9_ItjkWSkS-UdcVt5eDiQUF9Ied4n6WaTCN4aHRpudJ-GFGVrNhuL9tivoBKo/s128/metal.gif);
color:#424242;
text-shadow: 1px 1px 1px #FFFAFB;
box-shadow: -6px 6px 6px 0px rgba(50, 50, 50, 0.65);
border-radius: 18px;
float: left;
}
/* Estilos de los campos */
.contact-form-name, .contact-form-email, .contact-form-email-message {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
box-shadow:inset 1px 1px 5px 1px #808080;
}
/* Campo del mensaje */
.contact-form-email-message {
padding: 5px;
}
/* Botón de enviar */
.contact-form-button-submit {
width: 40%;
max-width: 40%;
height: auto;
border: none;
border-top: 1px solid #9c9c9c;
background: #424242;
background: -webkit-gradient(linear, left top, left bottom, from(#424242), to(#575757));
background: -webkit-linear-gradient(top, #424242, #575757);
background: -moz-linear-gradient(top, #424242, #575757);
background: -ms-linear-gradient(top, #424242, #575757);
background: -o-linear-gradient(top, #424242, #575757);
padding: 2px 5px;
border-radius: 8px;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #fff;
font-size: 13px;
font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
margin-bottom: 10px;
float: right;
}
/* Botón de enviar al pasar el cursor */
.contact-form-button-submit:hover{
background: #424242;
color: #ccc;
border: none;
}

En color verde he puesto a qué área pertenece cada grupo de estilos por si alguien le quiere modificar algo, o por si alguien se anima a hacer sus propio diseño.
En todos los casos el ancho máximo del gadget se controla en esta parte: max-width: 280px;
Toma en cuenta que algunos estilos al ser CSS3 podrían no verse de la misma manera en todos los navegadores, sobre todo en Internet Explorer.


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

 Fuente; ciudadblogger

 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;                                                                                  








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;                                            





Paginacion