05 dic

Migas de Pan para WordPress: Instalarlas Gracias a RDFa Breadcrumb

escrito por 13 Comentarios publicado en Blog

Migas de Pan para WordPress: Instalarlas Gracias a RDFa Breadcrumb

Tal y como me solicitaba un usuario en un comentario de la entrada: Seo para WordPress: Guía de WordPress Seo by Yoast (Parte I), voy a enseñaros como instalar migas de pan para wordpress utilizando el plugin RDFa Breadcrumb.

La razón por la que no lo expliqué en el otro post es muy simple. Instalar las migas de pan para WordPress requiere tocar las plantillas de nuestro theme. No es algo tan simple como la configuración de WordPress Seo by Yoast. Por lo que si no sabes nada del funcionamiento de los themes de WordPress puede que esta pequeña guía se te atragante un poco.

La ventaja del Plugin RDFa Breadcrumb de WordPress (de entre los muchos que hay para realizar esta tarea) es que este este incluye marcado RFDa para que Google lo reconozca y muestre en las SERPs. O sea, que en vez de mostrar la url en la linea que está debajo del título en los resultados de búsqueda, lo que muestra es la miga de pan. Lo cual queda bastante más claro. Aquí os muestro un ejemplo:

Instalar Migas de Pan para WordPress Gracias a RDFa Breadcrumb

Migas de Pan para WordPress. Resultado de cómo se ve en las búsquedas en Google

Instalando RDFa Breadcrumb

El proceso de instalación de este plugin con el que disponer de migas de pan para WordPress es el mismo que para instalar cualquier otro. Desde el panel de control de WordPress, accedemos al menú Plugins > Añadir Nuevo. Desde ahí ponemos en la casilla de búsqueda RDFa Breadcrumb y nos mostrará una imagen similar a esta:

Migas de Pan para WordPress: Instalando RDFa Breadcrumb

Migas de Pan para WordPress: Instalando RDFa Breadcrumb (Clic para amplicar)

Cómo se puede ver, aparece en la primera posición. Le damos a instalar y una vez que se ha competado el proceso de instalación le damos a activar. Esto nos llevará de nuevo a la página de los plugins. En nuestra lista de plugins, buscamos RDFa Breadcrumb.

Migas de Pan para WordPress: Configuración de RDFa Breadcrumb

Migas de Pan para WordPress: Configuración de RDFa Breadcrumb (Cllic para ampliar)

Y aquí pulsamos la opción Settings con la que podremos configurar RDFa Breadcrumb.

Configurando Cómo se Verán Nuestras Migas de Pan para WordPress

.

Migas de Pan para WordPress: Configuración de RDFa Breadcrumb

Migas de Pan para WordPress: Configuración de RDFa Breadcrumb (clic para ampliar)

Cómo podéis ver, las opciones son poquitas y bien sencillitas. Disponemos tan solo de 5 campos a rellenar:

  • Prefix: Aquí va el código HTML con el que comenzarán tus migas de pan para WordPress. Por defecto es <p> (la entiqueta de apertura de párrafo).
  • Suffix: Aquí va el código HTML con el que se cerrarán tus migas de pan para WordPress. Por defecto es </p> (la entiqueta de cierre de párrafo). Como es evidente, la etiqueta de HTML que pongas de apertura en la opción prefix tendrás que cerrarla aquí.
  • Title: Es e texto con el que cpmenzarán tus migas de pan para WordPress. Puedes poner por ejemplo: Te encuentras aquí. Si lo dejas vacío no aparecerá ningún texto. Tan solo aparecerán as migas de pan.
  • Home Title: Es el nombre con el que aparecerá tu página de inicio. Por defecto es home. Pero si tu página web está en españo lo ideas sería que pusieras Inicio.
  • Breadcrumb Seperator: Este es el separador con el que RDFa Breadcrumb irá separando los enlaces. Por defecto es: ». Esto daría el siguiente resultado: inicio » enlace » enlace. Y así sucesivamente.

¿Cómo muestro Mis Migas de Pan para WordPress?

Una vez realizada la configuración pertinente, llega el momento de colocarlas en nuestro theme. El cómo las vamos a colocar dependerá de en que parte queremos tener las migas de pan. Normalmente, estas se suelen colocar justo antes de que comience el contenido. Pero últimamente, también se ha extendido bastante el colocarlas justo antes de que comience el pié de nuestro WordPress. O incluso al final del todo.

El caso es que para colocar nuestras migas de pan para WordPress con RDFa Breadcrumb tenemos que hacerlo directamente metiendo el código en la plantilla.

Para este caso de ejemplo, voy a colocarlo antes del contenido en el theme twentyeleven que trae WordPress por defecto. Aunque para el resto de themes es igual no tiene porque ser igual. Con lo que tengo que modificar la plantilla del header.php de mi theme. La ruta es:

wp/content > themes > twentyeleven > header.php

Una vez que he abierto el header.php, localizo la línea donde comienza el contenido y resulta que justo la última del documento:

Así que coloco la miga de pan justo debajo con el código que indica la web del plugin RDFa Breadcrumb que es:

Con lo que el resultado es(comentando el texto para el futuro):

Una vez guardado, reviso la página para llevarme una desagradable sorpresa:

Migas de Pan para WordPress Colocando RDFa Breadcrumb

Migas de Pan para WordPress Colocando RDFa Breadcrumb (clic para ampliar)

Las migas salen descolocadas. En el caso de twentyeleven (en el resto de themes seguramente será diferente) lo he arreglado de una manera muy simple. El contenido para que aparezca centrado y sea responsive se encuentra dentro del div con el id content. Así que despues de pensarlo un poco, la solución que he tomado es la siguiente:

Para no repetir el id content, he localizado dicho id en el archivo de estilos css (style.css) del theme. Su contenido es el siguiente:

Y le he añadido otra id más para que tenga las mismas propiedades pero la he llamado breadcrumb:

Acto seguido he vuelto al header.php y le he añadido un nuevo div con el id breadcrumb de la siguiente forma:

Y listo:

Migas de Pan para WordPress Colocando RDFa Breadcrumb

Migas de Pan para WordPress Colocando RDFa Breadcrumb (clic para ampliar)

Ya tenemos nuestras migas de pan para WordPress perfectamente colocadas.

¿Y si quiero poner mis migas de pan para WordPress antes del pie?

Si las quieres colocar antes del pie el proceso es similar. En este caso toca abrir el archivo footer.php y volver a localizar el contenedor main. Solo que ahora es el de cierre. Tal que así:

Y poner justo encima el código anterior. Quedando la cosa de la siguiente manera:

Migas de Pan para WordPress Colocando RDFa Breadcrumb

Migas de Pan para WordPress Colocando RDFa Breadcrumb (clic en la imagen para ampliar)

Y así quedarían nuestras migas para WordPress si las situáramos en el pie. El proceso en la CSS abría que hacerlo igual.

Y con esto tendríamos todo listo. Como podéis comprobar, poner unas migas de pan para wordpress es más difícil que configurar WordPress Seo by Yoast. Pero con un poco de tiempo, puede hacerse.

13 Respuestas to “Migas de Pan para WordPress: Instalarlas Gracias a RDFa Breadcrumb”

  1. Responder El.Ultimo.Anunnaki dice:

    Excelente!!
    Realmente pensé que sería más complicado, pero parece sencillo. Hoy voy a ver si lo implemento en mi WordPress.
    Muy agradecido!!

  2. Responder Mauro Antonio dice:

    Disculpame que te moleste y que haga un poco de Offtopic, tienes alguna plantilla solo para blogs de deporte? Estuve buscando y no encontré mucho en la web :(

    • Responder César dice:

      Pues la verdad es que mo he metido ninguna de esa temática. Pero si que he encontrado alguna. He encontrado de noticias deportivas, instalaciones deportivas (que de esas si tengo un par de ellas). Voy a tratar de poner hoy un par de ellas al menos. Que no se quede vacía esa temática.

      Gracias por tu comentario! Eso si. Ten un poco de cuidado. Porque me lo habían mandado al spam. Por eso he tardado tanto en verlo. Solo repaso el spam los viernes.

  3. Responder maria dice:

    Hola cesar, qué interesante. este plugin es solo para la versión wordpress.org. Yo tengo mi página en wordpress.com, no hay manera de implementarlo aquí?
    muchas gracias. María

    • Responder César dice:

      Hola María

      Pues siento comunicarte que en WordPress.com es imposible implementarlo. WordPress.com no permite el uso de plugins, scripts o css externas.

      Un saludo

  4. Responder Andres D.M dice:

    Gracias por tu excelente aporte.

    Te quería preguntar algo. El plugin seo by yoast también trae migas de pan. Ahora, mi pregunta esta en si: es posible usar esas para no tener que instalar tantos plugins? Pero mi duda radica en que si se mostraría en los buscadores.

    Saludos y mil gracias.

    • Responder César dice:

      Hola Andrés.

      Al igual que tu, defiendo el uso de la cantidad mínima de plugins. Pero para que las migas de pan se muestren en Google, se requiere marcación RDFa. Por lo que si usas las migas de pan de SEO by Yoast (que no la incorporan) no te van a aparecer en Google.

      Un saludo

  5. Responder Sandra dice:

    Muchas gracias!!!! Casi iba a darme por vencida…. :)

  6. Responder Yaiza dice:

    Hola!! mi theme es InterfaceVersión: 1.4
    Por Theme Horse y cuando coloco el código que indica la web del plugin RDFa Breadcrumb en header.php, luego no me aparecen las migas.
    A lo mejor puede ser porque en la ultima linea de mi header.php pone:

    • Responder César dice:

      Hola Yaiza.

      No me aparece que es lo que pone en tu última línea del Header.php. Aun así, te comento. Aunque por línea general los archivos de los themes de php tienen una arquitectura similar en la mayoría de los casos, cada theme posee sus propias peculiaridades. Por lo que aquello que funciona en unos, no tiene porque funcionar en otros. Así que antes de proceder, tendrías que averiguar si tu header php es el lugar correcto o si por el contrario, tienes que ubicarlos en los archivos principales del theme (índex.php, page.php, etc).

      Espero que te sirva de ayuda.

      Un saludo.

Dejar un Comentario

Free WordPress Theme

Premium WordPress Themes
WordPress Themes ThemeForest