Código Script para crear enlaces internos automáticos en Blogger

como crear enlaces internos 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.

 

Leer también¿Cuál es la mejor pagina web para ver series y películas anime desde el teléfono Android?

Crea 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:

Leer tambiénCómo acelerar tu teléfono Samsung Galaxy desactivando la aplicación Game Optimizing Service

1. Copia el primer código CSS a continuación y pégalo antes del </head>

<b:if cond='data:blog.pageType != &quot;index&quot;'> <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(&quot;data:image/svg+xml,%3Csvg viewBox=&#39;0 0 24 24&#39; xmlns=&#39;http://www.w3.org/2000/svg&#39;%3E%3Cpath d=&#39;M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z&#39; fill=&#39;%23fff&#39;/%3E%3C/svg%3E&quot;) 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/>.

Leer tambiénCómo convertir un viejo router como repetidor wifi sin cables para ampliar la señal de internet

<b:if cond='data:view.isPost'> <script type='text/javascript'> //<![CDATA[ // Multi Related Post (function() {var jumlah = 4;let post = document['querySelectorAll']('.post-body br, .post-body p'),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='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=100&quot;'/> </b:if> </b:loop> </b:if> <script type='text/javascript'> //<![CDATA[ (function gourabdesignmultiRelated() {var text = 'Also read :';let r = Math['floor']((relatedTitles['length'] - 1) * 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.

Leer tambiénCómo descargar los videos y las transmisiones de Twitch desde el teléfono Android

Esto 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.

 

Si quieres conocer otros artículos parecidos a Código Script para crear enlaces internos automáticos en Blogger puedes visitar la categoría blogger.

Temas relacionados

Subir

Usamos cookies para asegurar que te damos la mejor experiencia en nuestra web. Si continúas usando este sitio, asumiremos que estás de acuerdo con ello. Mas info