[Sergio Iglesias](https://sergioiglesias.net) · Blog sobre Joomla

# Cómo crear, agregar y modificar meta-etiquetas personalizadas en Joomla!

[ Añadir a fuentes preferidas ](https://www.google.com/preferences/source?q=sergioiglesias.net)   15 Diciembre 2014    [Tips Joomla](https://sergioiglesias.net/blog/joomla)   2 - 3 minutos    Visitas: 33454  -
- [ Formación Joomla ](https://sergioiglesias.net/etiquetas/formacion-joomla)
- [ Desarrollo Joomla ](https://sergioiglesias.net/etiquetas/desarrollo-joomla)

  ![](https://sergioiglesias.net/images/blog/tips/meta-tags.jpg) En este artículo vamos a ver como agregar **meta-etiquetas (meta-tags)** desde cualquier fichero php de un componente Joomla!. Veremos el caso concreto de las **etiquetas propias de facebook** y cómo modificar las estándar de **meta-description y meta-keywords**.

Vamos a ver las meta-tags en Joomla!

### API de Joomla!

En la biblioteca JFactory tenemos las funciones relacionadas con los "documentos" a través de getDocument(). Por lo tanto, lo primero que haremos será crear una variable para que podamos acceder a dichas funciones.

 ```
$doc = JFactory::getDocument();
```

La función que nos interesa para este caso **addCustomTag**.

### Etiquetas de Facebook en Joomla!

Cuando compartimos algo en esta red social podemos seleccionar qué mostrar a partir de las etiquetas propias de Facebook. Estas etiquetas son las siguientes:

 ```
<meta property="og:title" content="Título del artículo"/><br></br><meta property="og:type" content="tipo"/><br></br><meta property="og:url" content="http://www.dominio.com/url-del-articulo"/><br></br><meta property="og:image" content="http://www.dominio.com/directorio/imagen-del-articulo.jpg"/><br></br><meta property="og:description" content="Texto introductorio del artículo que vamos a compartir"/>
```

Para generar estas etiquetas tendremos que añadir en nuestro código lo siguiente:

 ```
$doc = JFactory::getDocument();
$doc->addCustomTag( '<meta content="Título del artículo" property="og:title"></meta>' );
$doc->addCustomTag( '<meta content="tipo" property="og:type"></meta>' );
$doc->addCustomTag( '<meta content="http://www.dominio.com/url-del-articulo" property="og:url"></meta>' );
$doc->addCustomTag( '<meta content="http://www.dominio.com/directorio/imagen-del-articulo.jpg" property="og:image"></meta>' );
$doc->addCustomTag( '<meta content="Texto introductorio del artículo que vamos a compartir" property="og:description"></meta>' );
```

Con este código Joomla! añade las meta-etiquetas de Facebook entre de las etiquetasdel HTML que genera el artículo.

### Etiquetas estándar en Joomla!

Muy parecido a lo que acabamos de ver para Facebook tendremos que hacer para modificar las etiquetas description y keywords. En este caso tendremos que hacer otra llamada a **JFactory**.

 ```
$app = JFactory::getApplication();
$app->addMetaTag('description', 'Descripción del artículo que se va a mostrar');
$app->addMetaTag('keywords', 'palabra clave1, palabra clave2, palabra clave3');
```

Esto generará entre las etiquetaslas siguientes meta-etiquetas:

 ```
<meta name="description" content="Descripción del artículo que se va a mostrar" />
<meta name="keywords" content="palabra clave1, palabra clave2, palabra clave3" />
```

---

\[actualización - 16/12/2014\] A petición de Manuel (BoleMC)

### Cómo hacerlo de forma dinámica para que cada artículo tenga su propia personalización

Para realizar esta acción tendremos que hacer un override del componente com\_content de la vista de artículos (article).

*Para saber cómo crear un override os recomiendo hacer el [curso sobre desarrollo de plantillas](https://sergioiglesias.net/cursos/curso-desarrollo-plantillas) que os he preparado.*

Una vez en el override, tendremos que añadir las siguientes líneas de código al inicio del fichero php (templates/tuplantilla/html/com\_content/article/default.php):

 ```
$doc = JFactory::getDocument();
// extraemos las imagenes de intro y full text
$images  = json_decode($this->item->images);
$doc->addCustomTag( '<meta content="'.$this->item->title.'" property="og:title"></meta>' );
$doc->addCustomTag( '<meta content="tipo" property="og:type"></meta>' );
$doc->addCustomTag( '<meta content="'.JURI::current().'" property="og:url"></meta>' );
$doc->addCustomTag( '<meta content="'.JURI::base().$images->image_fulltext.'" property="og:image"></meta>' );
// Si queremos coger la imagen de intro tendríamos que cambiar $images->image_fulltext por $images->image_intro
$doc->addCustomTag( '<meta content="'.$this->item->metadesc.'" property="og:description"></meta>' );
```

---

\[actualización - 11/07/2015\] Tras un artículo de [Guillermo Bravo](https://www.facebook.com/joomla.adicto/posts/10153082852952138)

### Vamos a poner las etiquetas de Twitter Card

 ```
$doc = JFactory::getDocument();
// extraemos las imagenes de intro y full text
$images  = json_decode($this->item->images);
$doc->addCustomTag( '<meta content="'.$this->item->title.'" property="twitter:title"></meta>' );
$doc->addCustomTag( '<meta content="summary_large_image" property="twitter:card"></meta>' );
$doc->addCustomTag( '<meta content="'.JURI::base().'" property="twitter:site"></meta>' );
$doc->addCustomTag( '<meta content="@sergiois" property="twitter:creator"></meta>' );
$doc->addCustomTag( '<meta content="'.JURI::current().'" property="twitter:url"></meta>' );
$doc->addCustomTag( '<meta content="'.JURI::base().$images->image_fulltext.'" property="twitter:image"></meta>' );
// Si queremos coger la imagen de intro tendríamos que cambiar $images->image_fulltext por $images->image_intro
$doc->addCustomTag( '<meta content="'.$this->item->metadesc.'" property="twitter:description"></meta>' );
```

---

Espero que os haya resultado sencillo este tip para Joomla!. Cualquier comentario ya sabéis que es bienvenido.

[ Añadir a fuentes preferidas ](https://www.google.com/preferences/source?q=sergioiglesias.net)Gratuito · Primer paso recomendado

### ¿No sabes bien en qué estado

está tu web Joomla?

Antes de decidir si hay que arreglar, migrar o mantener, conviene saber qué está pasando. Reviso el estado de tu web — versión de Joomla, extensiones y lo que se pueda ver — y te digo qué conviene hacer y en qué orden.

Versión de Joomla y ruta de actualización Estado de extensiones Plan de acción con recomendaciones Informe por email + HTML

[ Solicitar revisión gratuita sin compromiso ](https://sergioiglesias.net/revision-joomla-gratis)Respuesta en 24–48 h laborables

[![Sergio Iglesias](https://sergioiglesias.net/images/sergiois-joomla-web.png)](https://sergioiglesias.net/sobre-mi)##### Consultor Web Joomla Senior

Soy [Sergio Iglesias](https://sergioiglesias.net/sobre-mi). Ayudo a empresas, instituciones y profesionales a convertir su web en una herramienta real de negocio: segura, escalable y fácil de gestionar. Soy especialista en migraciones complejas de Joomla sin pérdida de datos, desarrollo de extensiones y plantillas a medida y ofrezco mantenimiento y evolución de tu CMS.

[](https://x.com/sergiois "Sergio Iglesias en X") [](https://www.linkedin.com/in/sergiois "Sergio Iglesias en Linkedin") [](https://github.com/sergiois "Sergio Iglesias en Github") [](https://sergiois.github.io/ "Extensiones Joomla de Sergio Iglesias")

### Suscríbete a mi newsletter

¿Te ha gustado el artículo? Suscríbete a mi newsletter y recibe contenido exclusivo.
Podrás hacer gratis un **Curso de desarrollo de plantillas Joomla**.

[Quiero apuntarme!](https://sergioiglesias.net/newsletter)

###  32 comentarios

- [ ![](https://www.gravatar.com/avatar/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f?s=48&r=G&d=mp) ](https://www.gravatar.com/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f)

     sergiois

     [ Viernes, 22 May 2015 08:33 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=47#akengage-comment-47)

      Hola Christian,<br /><br />Gracias por comentar en este blog ;-)<br /><br />He entrado en tu sitio web y he probado a compartir varias noticias y lo hace de forma correcta. Lo he probado de varias maneras y, en todas, el resultado es el mismo.<br />He visto que tienes varios servicios de compartir: sharethis y algún plugin (o los propios que trae el template). Pero, a priori, parece que va bien como te comento.<br /><br />Lo que sí he visto es que en alguna noticia, en el código, se generan 2 etiquetas y la última que hay no es correcta. Pero aún así, se comparte bien.<br /><br />De todas formas hay que estar siempre pendiente de los cambios que se producen en esta red social.<br /><br />Si has hecho algún cambio y se ha solucionado, perfecto!!<br /><br />Gracias de nuevo por comentar.<br /><br />Un saludo,
- [ ![](https://www.gravatar.com/avatar/c7e4fc460bb75fca10c35a8c28c8d8755193c0386d6f7de4d8f8e8dc7aeea2f4?s=48&r=G&d=mp) ](https://www.gravatar.com/c7e4fc460bb75fca10c35a8c28c8d8755193c0386d6f7de4d8f8e8dc7aeea2f4)

     Christian Ocaña

     [ Jueves, 21 May 2015 21:31 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=46#akengage-comment-46)

      Buenas tardes, Sergio, te escribo desde Ecuador.<br />El caso es que cuando comparto en facebook de forma automática, no consigo que salga la imagen que corresponde al articulo, mi plantilla es teline v y en un principio iba bien, puse las meta etiquetas de tu página pero sigo sin tener los resultados, agradecería un poco de ayuda.<br />Muchas gracias Sergio. y felicidades por tu página.
- [ ![](https://www.gravatar.com/avatar/980e41a8875d85b1ae2488a6d8cbd9f04523a6dfbf52a31672e5403ee6eb0d9e?s=48&r=G&d=mp) ](https://www.gravatar.com/980e41a8875d85b1ae2488a6d8cbd9f04523a6dfbf52a31672e5403ee6eb0d9e)

     Camilo Ortiz

     [ Viernes, 20 Marzo 2015 15:10 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=27#akengage-comment-27)

      Bueno, les comento... no sé por qué razón en el Open Graph Object Debugger https://developers.facebook.com/tools/debug/ (erramienta para eliminar el caché de facebook ) al escanear el enlace me toma la imagen correcta, pero si yo reviso la información de Graph API evidentemente toma primero los dos logos de la página y cualquier otra imagen menos la del articulo, al revisar intenté varias opciones tratando de modificar los logos, pero finalmente los dejé como estaba y me dí cuenta que insertando la misma imagen (de opciones de imagenes y enlaces) dentro del artículo y colocandole descripción y título lo deja como primera opción de publicación, no entiendo esto porqué y pues es depronto algo lógico pero Joomla en (Opciones de imagenes y enlaces) no se puede cargar la imagen con el título.<br />Es una solución algo diferente pero me funciona por fin. Si alguien puede darle una explicación lógica y una solución más profesional por favor no dude en comunicarmelo.. Gracias
- [ ![](https://www.gravatar.com/avatar/980e41a8875d85b1ae2488a6d8cbd9f04523a6dfbf52a31672e5403ee6eb0d9e?s=48&r=G&d=mp) ](https://www.gravatar.com/980e41a8875d85b1ae2488a6d8cbd9f04523a6dfbf52a31672e5403ee6eb0d9e)

     Camilo Ortiz

     [ Viernes, 20 Marzo 2015 00:44 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=26#akengage-comment-26)

      Hola buenas noches,<br />Tengo Joomla 3.4 con una plantilla que no tiene por defecto compartir todo lo que cargo como articulos que se visualizan como blog, entonces descargué un plugin de Addthis para insertar los botones de diferentes redes sociales despues de cada articulo, todo perfecto, pero al compartir en facebook no salían las imagenes que cargaba para los artículos, entonces navegando me encontré que necesitaba unos META open graph para poder lograr esto, entonces me encontré con un plugin llamado "simple facebook meta", me mostraba la imagen, titulo y contenido text en un popup despues de dar click en el boton de compartir en facebook(Addthis) pero al hacerle click en compartir(en el popup) y revisarlo en el perfil de facebook me daba cuenta que cambiaba la imagen automáticamente por la del logo de la página y el texto perfecto. no sé porque sucede esto esta la url: http://kaprichosas.com/blog-kaprichosas Ayuda por favor.
- [ ![](https://www.gravatar.com/avatar/47fba1b4fcae8ad20c9a361809781cbbbdf56d9d128a0dbe119a40eb6e06053f?s=48&r=G&d=mp) ](https://www.gravatar.com/47fba1b4fcae8ad20c9a361809781cbbbdf56d9d128a0dbe119a40eb6e06053f)

     Marcos

     [ Martes, 20 Enero 2015 15:43 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=15#akengage-comment-15)

      Gracias por la rápida respuesta, mi plantilla es JM Joomclassifieds y este es mi sitio web : www.buychollos.com
- [ ![](https://www.gravatar.com/avatar/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f?s=48&r=G&d=mp) ](https://www.gravatar.com/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f)

     sergiois

     [ Martes, 20 Enero 2015 13:05 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=14#akengage-comment-14)

      Hola Marcos,<br /><br />Lo primero, gracias por escribir. En cuanto a tu consulta, esto depende de la plantilla que utilices en tu sitio web. Puede que la plantilla tenga overrides o no del com_content. Si puedes poner la URL para ver de qué plantilla se trata o si quieres puedes ponerte en contacto conmigo a través del formulario de contacto.<br /><br />Un saludo,
- [ ![](https://www.gravatar.com/avatar/47fba1b4fcae8ad20c9a361809781cbbbdf56d9d128a0dbe119a40eb6e06053f?s=48&r=G&d=mp) ](https://www.gravatar.com/47fba1b4fcae8ad20c9a361809781cbbbdf56d9d128a0dbe119a40eb6e06053f)

     Marcos

     [ Martes, 20 Enero 2015 12:58 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=13#akengage-comment-13)

      Hola Sergio, me estoy volviendo loco para que facebook comparta bien las imágenes de cada articulo que subo a mi web, conseguí hacerlo con una imagen y descripción estáticas pero lo que quiero es lo que dices de las imágenes y descripciones dinámicas para cada articulo, pero no se llegar al archivo php que propones (templates/tuplantilla/html/com_content/article/default.php), entiendo que se llega a el por ftp pero es que sigo esa ruta y a mi no me aparece así. Agradezco cualquier ayuda, gracias.
- [ ![](https://www.gravatar.com/avatar/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f?s=48&r=G&d=mp) ](https://www.gravatar.com/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f)

     sergiois

     [ Martes, 16 Diciembre 2014 13:08 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=10#akengage-comment-10)

      De nada Bole!! Un placer como siempre ;-)
- [ ![](https://www.gravatar.com/avatar/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef?s=48&r=G&d=mp) ](https://www.gravatar.com/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef)

     Manuel

     [ Martes, 16 Diciembre 2014 13:01 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=9#akengage-comment-9)

      Es lo que pasa por estar a 2 bandas jejeje Gracias Sergio, no Isidro :P
- [ ![](https://www.gravatar.com/avatar/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef?s=48&r=G&d=mp) ](https://www.gravatar.com/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef)

     Manuel

     [ Martes, 16 Diciembre 2014 12:59 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=8#akengage-comment-8)

      Muchas gracias Isidro :)
- [ ![](https://www.gravatar.com/avatar/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f?s=48&r=G&d=mp) ](https://www.gravatar.com/b66fba1a78a3ea7b41e98a8e43ec390a0f33e7df0759e8a53879ec6be4be9d0f)

     sergiois

     [ Martes, 16 Diciembre 2014 10:21 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=7#akengage-comment-7)

      Hola Manuel!! Bienvenido al blog y gracias por comentar.<br /><br />Acabo de actualizar el artículo con lo que comentas. Espero que tanto a ti como a otros usuarios os venga bien.<br /><br />Un saludo!!
- [ ![](https://www.gravatar.com/avatar/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef?s=48&r=G&d=mp) ](https://www.gravatar.com/49ce43933877668657db1dc728f0c964b5d2438f7aff5ae00822facaf44ba8ef)

     Manuel

     [ Martes, 16 Diciembre 2014 01:49 ](https://sergioiglesias.net/blog/joomla/como-crear-agregar-y-modificar-meta-etiquetas-personalizadas-en-joomla?akengage_limitstart=20&akengage_cid=6#akengage-comment-6)

      Gracias por el tip Sergio.<br />Pero lo que compartes es con unos metas específicos ¿como sería para que los coja de manera dinámica? ya que como es lógico cada página debe tener sus propios metas de open graph por ejemplo. Gracias de nuevo por compartir tus conocimientos :)

###  Deja tu comentario

 En respuesta a Some User

 Nombre \*

 Dirección de email \*

 Texto del comentario \*

 Doy mi consentimiento para que mi información personal sea recopilada y procesada por este sitio para aceptar y mostrar mi comentario, así como para notificarme sobre las respuestas a él según la [Declaración de privacidad](https://sergioiglesias.net/politica-privacidad) del sitio. \*
