Tutorial: Cómo configurar metadatos de Twitter para mejorar el efecto visual en los enlaces

  • Autor Autor Norlan30
  • Fecha de inicio Fecha de inicio
N

Norlan30

Beta
Verificación en dos pasos activada
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola amigos les dejo este pequeño tutorial de como configurar las meta de twitter para lograr mas audiencia en esa red social al darle un mejor efecto visual a los enlaces publicados usando las twitter card:

Insertar CODE, HTML o PHP:
<!-- ETIQUETAS META TWITTER -->
<meta content='summary_large_image' name='twitter:card'/>
<meta content='@XXX' name='twitter:site'/>
<meta content='@XXX' name='twitter:creator'/>   
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<!-- SI ES LA PÁGINA HOME --> 
<meta content='XXX' name='twitter:title'/>
<meta content='XXX' name='twitter:description'/>
<b:else/>
<!-- SI NO ES LA HOME (POST, PAGINA, ETC.) -->
<meta expr:content='data:blog.url' name='twitter:url'/>
<meta expr:content='data:blog.pageName' name='twitter:title'/>
<meta expr:content='data:blog.postImageUrl' name='twitter:image'/>
<b:if cond='data:blog.metaDescription'>
<!-- SI EL POST TIENE DESCRIPCION (SEARCH DESCRIPTION)  -->
<meta expr:content='data:blog.metaDescription' name='twitter:description'/>
<b:else/>
<!-- SI EL POST NO TIENE DESCRIPCION (SEARCH DESCRIPTION)  -->
<meta content='Lee el post completo. esta buenisimo Retwittealo si te gusta y compártelo en las redes sociales' name='twitter:description'/>
</b:if>
</b:if>
<!--FIN DE ETIQUETAS META TWITTER-->

Este código lo tienen que poner antes de
Insertar CODE, HTML o PHP:
<b:skin><![CDATA[
y renplasar las "XXX" por sus datos de twitter y descripción titulo de su blog. y esto seria todo . funciona muy bien .😛8:​
 
disculpa mi ignorancia jeje :welcoming: pero esto cómo se usa?
 
disculpa mi ignorancia jeje :welcoming: pero esto cómo se usa?

Amigo las twitter card son la manera en que twitter interpreta una url. si las configuras bien cuando publicas un enlace a tu entrada en twitter mostrara la imagen principal de la entrada logrando mas audiencia que solo el simple enlace . para implementarla solo copia y pega antes de </head>. cambiando las XXX por tus datos..
 
Eso esta genial!!! Andaba buscando algo como esto 😛
 
disculpa mi ignorancia jeje :welcoming: pero esto cómo se usa?

Es como el opengraph de Facebook. Si no sabes lo que es opengraph resumidamente puedo decirte que son un conjunto de variables mediante las cuales Facebook interpreta un enlace compartido desde tu web. No te ha pasado que haz compartido un enlace de alguna web y la "imagen para compartir" no coincide con la entrada? Eso se soluciona con Opengraph (en twitter se llama cards o wildcards)
 
Eso esta genial!!! Andaba buscando algo como esto 😛

si es muy buscado y muchos tutoriales no funcionan . asta que encontre este metodo y funciona al 100%
 
Esto está genial!!! Voy corriendo a ponerlo en mis sitios. Espero conseguir más tráfico con ellas.
 
muchas gracias, yo lo instale y me acorde que no tengo el twitter xD
 
Muchas gracias, es muy útil.
 
Gracias y yo pensaba que solo podias publicar enlaces y texto de tu web
 
Muchas gracias lo implementare en mi blog :encouragement:
 
pueden mandar una captura de como queda? :moon: nose utulizarlo pero se ve genial! 🙄
 
funciona muy bien
 
Excelente aporte, gracias :encouragement:
 
Genio!!!! lo he probado en este momento y funcionó a la perfección! No tienes el mismo sistema para facebook y google +? ya que al compartirlo si sale la imágen y el título tanto en facebook como en google + pero en la descripción sale la descripción del sitio general y no de cada post, en cambio en twitter ahora si sale todo perfecto gracias, excelente y muy útil aporte! =)
 
Gracias! hace un tiempo lo busque pero no lo encontraba! :encouragement:
 
si quereis ver como queda la entrada poneis el enlace aqui
https://cards-dev.twitter.com/validator
yo paso todos los enlaces por esa web para ver como queda .
Importante que le pongais descripcion a la entrada .
Yo lo tengo puesto como meta no se si sera igual .
 
thaks for the info
 
feliz año nuevo

hola a todos y feliz año nuevo, oigan intente implementar estas metas tag en mi blogger y no eh podido cuando le doy al card validador me dice esto

INFO: Page fetched successfully
INFO: 12 metatags were found
INFO: twitter:card = summary_large_image tag found
ERROR: Required meta tag missing (twitter:text:description)

no se que debo poner o como debo arregarlo si alguien me pudiera ayudar se los agradeceria mucho.
 
Wuaoo, por eso es que me encanta este foro, cada día se aprende mas, gracias amigo por esta importante información sobre las redes sociales.:drunk:
 

Temas similares

Atrás
Arriba