WIDGET DE IMÁGENES CON TITULO PARA BLOGGER
enero 01, 2019
Es impresionante lo que blogger puede hacer en las plantillas, es más que un diseño web profesional.
Actualmente la plataforma de blogger renovó su Editor HTML con nuevas y sorprendentes mejoras en su editor, cave recalcar que blogger es lo mejor para el diseño de paginas web completamente gratis,
es por esto que para muchos pro blogger profesionales e Ingenieros de Sistemas se les hace muy fácil codificar en blogger y realizar trucos muy interesantes para todos.
Hoy voy a compartir con ustedes un widget muy interesante y fácil de implementarlo en nuestro blog de Blogger.
A continuación mire su demostración en mi blog de demos, el widget se encuentra en el centro de la plantilla el cual lleva el nombre de "FARANDULA", vosotros lopodréis poner donde os venga en gana.
Bloc de Demos
El widget que van ha aprender en este post Tutorial se lo conoce como Widget de imágenes y titulo, el cual le mostrara varias imágenes basadas en etiquetas,
con un titulo a lado derecho de la imagen e integrado si tiene o no comentarios en sus post. Es un truco muy fácil solo deben seguir mis instrucciones y lo podrán obtener.
Te gusto!!!!
Ahora vamos a trabajar
1 Ir a blogger
2 Da un clic en “Diseño”
3 También caberas dar un clic en “Añadir un gadget” y se desprenderá una nueva ventana
4 Busca el widget que dice “HTML/Javascript”
Ahora inserta en su interior las siguientes líneas de código
<div class='widget-content'>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
showRandomImg = true;
tablewidth = 287;
cellspacing = 5;
borderColor = "#FFF";
bgTD = "#fff";
imgwidth = 200;
imgheight = 150;
fntsize = 12;
acolor = "#000";
aBold = true;
icon = " ";
text = "Comentarios";
showPostDate = false;
summaryPost = false;
summaryFontsize = 11;
summaryColor = "#000";
icon2 = " → ";
numposts = 5;
home_page = "http://plantillapietro.blogspot.com/feeds/posts/default/-/Farandula";
</script>
<script src="http://sites.google.com/site/musikjisite/js/recent-categorialbum.js" type="text/javascript"></script></div>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[1] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[2] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[3] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
imgr[4] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6XTrrnP3AFzuUJ3cnS78JpFaQ98ybMx_jTbluTXBf9EGOha-scWiY5AfRYotJT2vvAF5d04hougITS1i8WMC9Na6ts1nVukXdoc3uTWN1FM2wvUajKEmCxDmEC5wEkxb7cVKx6KHtR1eK/s1600-r/no-image.png";
showRandomImg = true;
tablewidth = 287;
cellspacing = 5;
borderColor = "#FFF";
bgTD = "#fff";
imgwidth = 200;
imgheight = 150;
fntsize = 12;
acolor = "#000";
aBold = true;
icon = " ";
text = "Comentarios";
showPostDate = false;
summaryPost = false;
summaryFontsize = 11;
summaryColor = "#000";
icon2 = " → ";
numposts = 5;
home_page = "http://plantillapietro.blogspot.com/feeds/posts/default/-/Farandula";
</script>
<script src="http://sites.google.com/site/musikjisite/js/recent-categorialbum.js" type="text/javascript"></script></div>
Realiza estos cambios:
En este punto es muy importante insertar bien el nombre de tu blog, con mucho cuidado borra el texto que esta marcado de color azul plantillapietro.blogspot.com , deberás cambiarlo por el nombre de tu blog, no copiaras directamente el link de tu blog ya que no te puedes dar cuenta si se fue una línea de mas y por eso no podría funcionar este widget, recuerda solo pon el nombre perteneciente de tu blog tal y cual lo muestro yo, además deberás cambiar el nombre que esta marcado de color rojo Farandula y poner el nombre de una de tus etiquetas, esto hará que aparezcan tus temas en este widget.
Que es una Etiqueta, más información en este enlace
Si quieres aumentar el numero de imágenes en el widget, tendrás que buscar este código numposts = 5; y solo cambiar el numero 5 por el numero que tu quieras que aparezca en tu nuevo widget.
Luego de realizar los cambios pertinentes, es momento de dar un clic en “Guardar”, y ubica tu nuevo widget de imágenes donde tú quieras, eso es todo.
0 comentarios