Código Script para crear enlaces internos automáticos en Blogger
En WordPress existen varios métodos para agregar enlazados internos automáticos o post relacionados dentro de los artículos creados, también conocidos como interlinking In Article y sabemos lo importante que es esto a nivel de SEO.
Pero... ¿Qué ocurre en el caso de que tengas un sitio web creado con Blogger?
En el caso Blogger, no hay manera de instalar plugins que realice algún procedimiento de manera automática, pero no quiere decir que no puedas añadir algunas que otras funciones y características similares a la de WordPress.
Cómo desactivar el historial de palabras aprendidas en el teclado Gboard de AndroidCrea enlaces internos o Interlinking automático en Blogger 2022
En Blogger es posible añadir algunas funciones especiales como el enlacazo interno o post relacionados InArticle mediante la implementación de un código llamado "Script", estos script se encargan de ejecutar una función determinada por el usuario o creador del programa.
Generalmente para implementar el código en tu pagina de Blogger es importante contar con algunos conocimientos básicos, ya que será necesario acceder al código HTML.
Antes de hacer una modificación y meter mano en el código HTML, realiza una copia de seguridad de tu plantilla de Blogger, luego entra en "Editar HTML" y añade los siguientes códigos.
El siguiente código cuenta con dos partes, la del diseño que se lo conoce como código CSS, y la del Script:
Cómo escuchar música en YouTube con la pantalla apagada y reproducir videos de YouTube en segundo plano1. Copia el primer código CSS a continuación y pégalo antes del </head>
<b:if cond='data:blog.pageType != "index"'> <style type='text/css'> /* Multi Related Post */ .gourabdesignmultiRelated{background-color:#e3feff;color:#002bff;margin:15px auto;display:-moz-box;display:-ms-flexbox;border-radius: 50px;border: 2px solid #00eaff;display:flex;flex-wrap:nowrap;justify-content:space-between;overflow:hidden;transition:all .3s} .gourabdesignmultiRelated:hover{background-color:#feffe6} .gourabdesignmultiRelated .content{padding:6px 27px} .gourabdesignmultiRelated .content .text{margin-right:9px} .gourabdesignmultiRelated .content a{color:#f00;text-decoration:none;line-height:1.5em} .gourabdesignmultiRelated .content a:hover{text-decoration:underline} .gourabdesignmultiRelated .icon{height:auto;min-width:55px;background:#20757d url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='%23fff'/%3E%3C/svg%3E") center / 40px no-repeat;transition:all .3s} </style> </b:if>
2. Ahora buscar el siguiente código <data:post.body/> en el mismo HTML, para eso abre el buscador con las teclas "Ctrl + F" y pega en el campo el código a buscar, una vez encontrado pega el código a continuación justo debajo del <data:post.body/>.
Cómo Eliminar Notificaciones de Virus y Publicidad en Chrome para Android<b:if cond='data:view.isPost'> <script type='text/javascript'> //<,a = jumlah + 1,b = post['length'] / a;c = Array['from']({length: jumlah}, (redfx, blufx) => blufx + 1); for (let d = 0; d < c['length']; d++) {let e = c[d],f = parseInt((b * e)),g = document['createElement']('div');g['className'] = 'gourabdesignmultiRelated';if (post[f]['nodeName'] == 'P') {post[f]['parentNode']['insertBefore'](g, post[f])} else {post[f]['parentNode']['insertBefore'](g, post[f]['nextSibling'])}}})(); var relatedTitles = new Array();var relatedTitlesNum = 0;var relatedUrls = new Array();function related_results_labels(nerdfx) {for (var desfx = 0; desfx < nerdfx['feed']['entry']['length']; desfx++) {var nefx = nerdfx['feed']['entry'][desfx];relatedTitles[relatedTitlesNum] = nefx['title']['$t'];for (var ciafx = 0; ciafx < nefx['link']['length']; ciafx++) {if (nefx['link'][ciafx]['rel'] == 'alternate') {relatedUrls[relatedTitlesNum] = nefx['link'][ciafx]['href'];relatedTitlesNum++;break}}}} function removeRelatedDuplicates() {var viefx = new Array(0);var labfx = new Array(0);for (var desfx = 0; desfx < relatedUrls['length']; desfx++) {if (!contains(viefx, relatedUrls[desfx])) {viefx['length'] += 1;viefx[viefx['length'] - 1] = relatedUrls[desfx];labfx['length'] += 1;labfx[labfx['length'] - 1] = relatedTitles[desfx]}};relatedTitles = labfx;relatedUrls = viefx} function contains(yelfx, yufx) {for (var grefx = 0; grefx < yelfx['length']; grefx++) {if (yelfx[grefx] == yufx) {return true}};return false} //]]> </script> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:view.isPost'> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=100"'/> </b:if> </b:loop> </b:if> <script type='text/javascript'> //< * Math['random']());let i = 0;let jumlah = document['querySelectorAll']('.gourabdesignmultiRelated');while (i < relatedTitles['length'] && i < jumlah['length']) {for (let a = 0; a < jumlah['length']; a++) {jumlah[a]['innerHTML'] = '<span class="content"><span class="text">' + text + '</span><a href="' + relatedUrls[r] + '" title="' + relatedTitles[r] + '">' + relatedTitles[r] + '</a></span><span class="icon"></span>';if (r < relatedTitles['length'] - 1) {r++} else {r = 0};i++}}})(); //]]> </script> </b:if>
En caso de encontrar mas de un <data:post.body/>, tendrás que probar pegando el código debajo de uno o del otro, luego al guardar los cambios en la plantilla HTML, podrás ver exactamente como queda generado automáticamente el interlinking en cada entrada.
Un claro ejemplo es este mismo articulo, al ir deslizando podrás notar algunas sugerencias de entradas a leer.
Cómo hacer captura de pantalla en modo incógnito desde el navegador Chrome para AndroidEsto lo tienes que hacer una única vez, ya que el enlazado interno se realizara automáticamente en cada una de las entradas que tengas y en las posteriores que crees.
Si tienes algo de conocimientos, ya podrás cambiar el estilo del código, ya sea añadiendo o cambiando los colores, tipo de letra, tamaño y demás modificaciones.
Temas relacionados