Como Crear una Galería de Imágenes en Blogger

Es muy poco común encontrar una Galería de Imágenes para las entradas o paginas en la plataforma de Blogger, una galería de imágenes en un sitio web se utiliza para ordenar el contenido de varias imágenes agrupándolas en un determinado espacio, este tipo de galerías bien utilizados nos ayuda al posicionamiento de nuestra entrada en internet, porque las imágenes publicadas en blogger se propagan muy rápido en los buscadores actuales de google. 

Siempre tendremos la necesidad de utilizar una galería de imágenes en las entradas de blogger para ordenar nuestro contenido en las publicaciones, no existe muchas opciones o desarrolladores independientes de galerías para imágenes en blogger. En esta oportunidad vamos aprender a integrar una galería de imágenes sencilla, adaptable para utilizarlo en nuestras entradas en blogger.

La aplicación de una galería nativa de la plataforma de imágenes dentro de blogger, aporta las mismas funciones en la organización de fotos e imágenes enumeradas en nuestras entradas, por ese motivo vamos adaptar una función enumerada en las publicaciones de blogger para tener nuestra propia galería de imágenes.

Importante: Antes de implementar esta galería vamos a sacrificar una opción de la edición de entradas en nuestro blog, exactamente la función enumeración esta función que sirve para enumerar nuestros títulos o párrafos. Una vez implementado el código de galería de imágenes para blogger tendremos que utilizar otras opciones

En este tutorial aprenderemos a implementar una galería de imágenes en blogger utilizando la misma galería de fotos en Blogger, adaptado por tutoriales gratis de internet para su buen funcionamiento en ordenadores y móvil.

1ª Entrar a Blogger / Tema / Editar HTML  aquí debemos buscar el código de cierre </style> antes del cierre colocar el siguiente código CSS y le daremos en guardar los cambios.

 

.post-body ol {padding: 0; margin: 0; overflow: hidden; overflow-x: scroll; overflow-y: hidden; margin-bottom: 10px; display: -webkit-box; list-style: none;}
.post-body ol li {margin: 0; padding: 0; margin-right: 10px;}
.post ol li:before { content:none;} 

2º Para implementar nuestra galería en las entradas y paginas debemos añadir o usar el siguiente código en la opción Vista HTML en la edición de nuestras publicaciones. Debemos reemplazar las palabras mayúsculas URL IMAGEN por el enlace url de nuestras imágenes que deseamos mostrar.

 

<ol>
<li><a href="URL IMAGEN 1" class="steem-keychain-checked"><img src="URL IMAGEN 1"></a></li>
<li><a href="URL IMAGEN 2" class="steem-keychain-checked"><img src="URL IMAGEN 2"></a></li>
<li><a href="URL IMAGEN 3" class="steem-keychain-checked"><img src="URL IMAGEN 3"></a></li>
<li><a href="URL IMAGEN 4" class="steem-keychain-checked"><img src="URL IMAGEN 4"></a></li>
<li><a href="URL IMAGEN 5" class="steem-keychain-checked"><img src="URL IMAGEN 5"></a></li>
</ol>

Si observamos se repite URL IMAGEN con numeración 1,2,3,4 tendremos que colocar de la siguiente manera:

URL IMAGEN 1: Aquí colocar enlace url de la imagen por defecto que subimos en el blog.

URL IMAGEN 1: En esta siguiente opción colocar la url de la imagen que subimos en el blog, pero con un ligero cambio en la opción /S.../ debemos modificar aquí la medida de la imagen de acuerdo al ancho de nuestras entradas en nuestro blog (Esta medida varia en las diferentes plantillas blogger pero generalmente varia entre /S650/ y /S700/ pixeles.

1. 
2. 
3. 
4. 
5.