Pero usando la imagen de la entrada anterior y siguiente
Aquí te dejo un ejemplo de cómo crear un Next/Previous Pager Navigation con imagen en Blogger utilizando HTML, CSS y JavaScript:
HTML:
```
<div class="pager-nav">
<a id="prev-link" style="background-image: url('<data
😛revImageThumbnailUrl/>'
😉;"></a>
<a id="next-link" style="background-image: url('<data:nextImageThumbnailUrl/>'
😉;"></a>
</div>
```
CSS:
```
.pager-nav {
text-align: center;
}
.pager-nav a {
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
height: 60px;
width: 60px;
}
```
JavaScript:
```
var blogPager = document.querySelector('.blog-pager');
if (blogPager) {
var prevLink = blogPager.querySelector('.blog-pager-newer-link a');
var nextLink = blogPager.querySelector('.blog-pager-older-link a');
var prevPager = document.getElementById('prev-link');
var nextPager = document.getElementById('next-link');
if (prevLink) {
prevPager.href = prevLink.href;
prevPager.title = prevLink.title;
}
if (nextLink) {
nextPager.href = nextLink.href;
nextPager.title = nextLink.title;
}
}
```
En este ejemplo, estoy utilizando las variables de datos de Blogger `<data
😛revImageThumbnailUrl/>` y `<data:nextImageThumbnailUrl/>` para recuperar la URL de la imagen en miniatura de la entrada anterior y siguiente, respectivamente. También estoy utilizando la propiedad `background-image` en línea en lugar de una regla de estilo CSS separada para agregar imágenes de fondo a los enlaces.
Espero que este ejemplo te sea de ayuda. Si tienes alguna duda, házmelo saber.