Cómo dividir publicaciones en varias páginas en Blogger
He visto a muchos paginas web que usan la plataforma Blogger hablando en foros, Quora, etc. sobre cómo dividir publicaciones en varias páginas en Blogger. Y si está buscando lo mismo, entonces ha aterrizado en el lugar correcto.
Siempre ha habido cierta confusión acerca de cómo dividir una publicación larga en varias páginas y sé que hay muchas formas de hacerlo.
Pero, antes de explicar cómo hacerlo, conozca los beneficios de dividir publicaciones de blog más largas en páginas diferentes o múltiples en Blogger.
Beneficios de dividir publicaciones largas en varias páginas
Cuando divide sus largas publicaciones de blog, existen numerosos beneficios como:
- Dividir tus publicaciones largas hará que tus publicaciones centradas en imágenes se vean mejor.
- Romper tus publicaciones te dará más oportunidades de ver anuncios.
- Paginar tus publicaciones largas aumentará el número de visitas a la página.
- Hace que sea excesivamente más fácil y comprensible leer tus publicaciones más largas.
- Puede orientar diferentes palabras clave para diferentes páginas.
- Dividir publicaciones más largas en varias páginas reducirá significativamente las altas tasas de rebote.
- Ayuda a los robots de los motores de búsqueda a rastrear sus páginas de manera más fácil y efectiva.
- Ayuda a aumentar la visibilidad de tu blog en las búsquedas.
- Mantiene el interés de sus lectores.
Cómo dividir publicaciones en varias páginas en Blogger
Dividir tus publicaciones extensas en varias páginas es muy fácil y puedes hacerlo siguiendo unos sencillos pasos.
Paso 1: Inicie sesión en su blog de Blogger, seleccione Tema y haga clic en Editar HTML.
Paso 2: Ahora busca la etiqueta <head> y pega el siguiente código jQuery justo debajo de la etiqueta <head> .
Nota: puede omitir este paso si ya ha instalado su plantilla de Blogger anteriormente.
Código
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> Paso 3: Luego busque el código ]]></b:skin> y pegue el siguiente código de hoja de estilo CSS justo arriba del código ]]> </ b:skin >.
Código
.post-pagination {
margin: 40px auto;
text-align: center;
width: 100%;
float:left;
}
.button_1, .button_2, .button_3 {
border: 2px solid #0a0a0a;
font-weight: 900;
padding: 6px 36px;
color:#f4655f;
transition:ease 0.69s !important;
background-color: #24282c;
border-radius: 4px;
}
.button_1:hover, .button_2:hover, .button_3:hover {
background: none repeat scroll 0 0 #f4655f;
color: #fff;
text-decoration: none;} Paso 4: Ahora, a continuación, busque la etiqueta </head> y pegue el siguiente código jQuery justo encima de la etiqueta </head> y esto habilitará las publicaciones de su blog en diferentes páginas.
Código
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.button_1').click(function(){
jQuery('.content_1').fadeIn('slow');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_2').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeIn('slow');
jQuery('.content_3').fadeOut('fast');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_3').css('background','#fff');
jQuery('.button_3').css('color','#F4655F');
return false;
});
jQuery('.button_3').click(function(){
jQuery('.content_1').fadeOut('fast');
jQuery('.content_2').fadeOut('fast');
jQuery('.content_3').fadeIn('slow');
jQuery(this).css('background','#F4655F');
jQuery(this).css('color','#fff');
jQuery('.button_1').css('background','#fff');
jQuery('.button_1').css('color','#F4655F');
jQuery('.button_2').css('background','#fff');
jQuery('.button_2').css('color','#F4655F');
return false;
});
});
</script> Paso 5: Haga clic en Guardar para guardar la configuración de su plantilla.
Entonces, ha completado la inserción del codigo CSS y el jQuery, ahora es crear una publicación de blog.
Por lo tanto, cree una nueva entrada y cambie sus publicaciones al modo HTML y pegue el siguiente código.
Código
<div class="content_1">
Add your content here for 1st page
</div>
<div class="content_2" style="display: none;">
Add your content here for 2nd page
</div>
<div class="content_3" style="display: none;">
Add your content here for 3rd page
</div>
<div class="post-pagination">
<a class="button_1" href="#">1</a>
<a class="button_2" href="#">2</a>
<a class="button_3" href="#">3</a>
</div> Nota : Reemplace el texto Add your content here for 1st page, 2st página y 3st página también con su propio contenido de publicación de blog o cualquier contenido que desee hacer páginas.
He creado esto solo para tres páginas, pero también puede aumentar las páginas si tiene algunos conocimientos básicos de HTML y, de lo contrario, deje un comentario a continuación indicando sus consultas y me pondré en contacto con sus consultas.
Deja una respuesta