Todavía recuerdo la frustración de compartir una de mis primeras publicaciones de blog en Facebook, solo para ver que mostraba una imagen completamente aleatoria y pixelada. Después de pasar horas en el contenido, fue desalentador verlo mal representado antes de que alguien tuviera la oportunidad de hacer clic.
Esto sucede cuando un sitio web no le da a las plataformas de redes sociales instrucciones claras sobre qué mostrar. Sin esa guía, Facebook simplemente tiene que adivinar, y a menudo adivina mal.
Aquí en WPBeginner, hemos dominado cómo controlar la apariencia de nuestras publicaciones sociales utilizando metadatos Open Graph. En esta guía, te mostraremos los métodos probados que usamos, para que puedas asegurarte de que tu contenido siempre luzca lo mejor posible cuando se comparta.
Puedes usar los enlaces rápidos a continuación para saltar directamente al método que más te interese:
- Agregar metadatos de Facebook Open Graph con AIOSEO
- Configurar metadatos de Facebook Open Graph usando Yoast SEO
- Añadir metadatos Open Graph de Facebook usando código
- Preguntas frecuentes sobre Open Graph de Facebook
- Recursos adicionales sobre Facebook y WordPress
Importante: Por favor, elige solo uno de los métodos a continuación. Usar varios plugins de SEO o agregar el código manualmente mientras un plugin está activo puede crear etiquetas Open Graph conflictivas, lo que puede causar resultados de compartición inesperados. Recomendamos el Método 1 usando AIOSEO para la configuración más fácil y completa.
Método 1: Agregar metadatos de Facebook Open Graph con AIOSEO
All in One SEO es un popular plugin de SEO para WordPress utilizado por más de 3 millones de sitios web. Te permite optimizar fácilmente tu sitio web para motores de búsqueda, así como para plataformas sociales como Facebook y Twitter.
Primero, necesitas instalar y activar el plugin gratuito All in One SEO. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Al activarlo, debes visitar la página All in One SEO » Redes Sociales. Aquí, puedes ingresar la URL de tu página de Facebook y todas tus otras redes sociales.
A continuación, haz clic en la pestaña de Facebook en la parte superior de la página, y verás que la Marca Open Graph está habilitada por defecto.
Puedes hacer clic en el botón ‘Subir o Seleccionar Imagen’ para elegir una imagen OG de Facebook predeterminada si un artículo no tiene una imagen Open Graph.
Si te desplazas hacia abajo, puedes personalizar el nombre de tu sitio, la descripción y más configuraciones. No olvides hacer clic en el botón azul ‘Guardar Cambios’ una vez que hayas terminado.
Ahora que has configurado las metaetiquetas Open Graph para todo el sitio, el siguiente paso es agregar metadatos Open Graph para publicaciones y páginas individuales.
Por defecto, AIOSEO utiliza el título SEO y la meta descripción de tu publicación para el título y la descripción de Open Graph. También puedes establecer manualmente la miniatura de Facebook para cada página y publicación.
Simplemente edita la publicación o página y desplázate hacia abajo hasta la sección ‘Configuración de AIOSEO’ debajo del editor. Desde aquí, cambia a la pestaña Social, y verás una vista previa de tu miniatura.
Puedes establecer la imagen de redes sociales aquí, así como el título y la descripción.
Simplemente desplázate hacia abajo hasta el campo ‘Fuente de la Imagen’. Puedes elegir usar la imagen destacada, subir una imagen personalizada u otras opciones.
Método 2: Establecer metadatos de Open Graph de Facebook usando Yoast SEO
Yoast SEO es otro plugin de SEO para WordPress que puedes usar para agregar metadatos de Facebook Open Graph a cualquier sitio de WordPress.
Lo primero que necesitas hacer es instalar y activar el plugin Yoast SEO. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Una vez activado, los datos de Facebook Open Graph se habilitan por defecto.
Puedes verificar esto yendo a Yoast SEO » Ajustes y desplazándote hacia abajo hasta la sección de Compartir en Redes Sociales. Ahora puedes asegurarte de que la función de datos Open Graph esté habilitada.
Puedes guardar tu configuración o continuar y configurar otras opciones sociales de Facebook.
Puedes proporcionar un ID de aplicación de Facebook si usas uno para tu página de Facebook y estadísticas. También puedes cambiar el título, la descripción y la imagen meta de Open Graph de tu página de inicio.
Por último, puedes establecer una imagen predeterminada que se usará cuando no se establezca ninguna imagen para una publicación o página.
La versión Premium de Yoast SEO también te permite establecer metadatos de Open Graph para publicaciones y páginas individuales. Simplemente edita una publicación o página y desplázate hacia abajo hasta la sección ‘Yoast SEO’ debajo del editor.
Desde aquí, puedes establecer una miniatura de Facebook para esa publicación o página en particular. Si no estableces un título o descripción de publicación, el plugin usará tu título y descripción meta de SEO.
Ahora puedes guardar tu publicación o página, y el plugin almacenará tus metadatos de Open Graph de Facebook.
Método 3: Agregar metadatos de Open Graph de Facebook usando código
Este método generalmente requiere que copies y pegues código en el archivo functions.php de tu tema. Sin embargo, recomendamos agregar el código usando el plugin WPCode en su lugar, lo que hace que sea más fácil y seguro agregar código personalizado en WordPress.
WPCode también viene con una biblioteca de fragmentos de código listos para usar, incluido uno para agregar etiquetas básicas de Open Graph, por lo que solo toma un par de clics.
Primero, instala y activa el plugin gratuito WPCode. Para más detalles, consulta nuestra guía sobre cómo instalar un plugin de WordPress.
Después de la activación, puedes ir a Fragmentos de código » + Agregar fragmento desde tu panel de WordPress.
Busca el fragmento 'Add basic Open Graph Tags' en la biblioteca. Una vez que lo encuentres, colócale el cursor encima y haz clic en el botón 'Usar fragmento'.
Luego, WPCode agregará el código automáticamente por ti, además de configurar la ubicación del método de inserción en todo el sitio.
Después de eso, todo lo que necesitas hacer es activar el fragmento a 'Activo' y hacer clic en el botón 'Actualizar'. Tu tema ahora comenzará a mostrar metadatos de Facebook Open Graph en el encabezado de WordPress.
Si eres un usuario avanzado, aún puedes copiar y pegar el código a continuación en el archivo functions.php de tu tema.
Dado que esto requiere que edites directamente los archivos de tu tema, asegúrate de respaldar los archivos de tu tema antes de realizar cualquier cambio.
//Adding the Open Graph in the Language Attributes
function add_opengraph_doctype( $output ) {
return $output . ' xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"';
}
add_filter('language_attributes', 'add_opengraph_doctype');
//Lets add Open Graph Meta Info
function insert_fb_in_head() {
global $post;
if ( !is_singular()) //if it is not a post or a page
return;
echo '<meta property="fb:app_id" content="Your Facebook App ID" />';
echo '<meta property="og:title" content="' . get_the_title() . '"/>';
echo '<meta property="og:type" content="article"/>';
echo '<meta property="og:url" content="' . get_permalink() . '"/>';
echo '<meta property="og:site_name" content="Your Site Name Goes Here"/>';
if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image
$default_image="http://example.com/image.jpg"; //replace this with a default image on your server or an image in your media library
echo '<meta property="og:image" content="' . $default_image . '"/>';
}
else{
$thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
}
echo "
";
}
add_action( 'wp_head', 'insert_fb_in_head', 5 );
Recuerda agregar el nombre de tu sitio en la Línea 17, donde dice 'Your Site Name Goes Here'. Después de eso, deberías cambiar la URL de imagen predeterminada en la Línea 19 por una de tus propias URLs de imagen.
Recomendamos poner una imagen con tu logo allí, para que si tu publicación no tiene una miniatura, se muestre el logo de tu sitio.
También necesitas agregar tu propio ID de aplicación de Facebook en la Línea 13. Si no tienes una aplicación de Facebook, puedes eliminar la Línea 13 del código.
Preguntas frecuentes sobre Open Graph de Facebook
Hemos ayudado a miles de usuarios a configurar sus ajustes de compartición social, y algunas preguntas surgen con bastante frecuencia. Aquí están las respuestas a las preguntas más comunes sobre cómo agregar metadatos Open Graph de Facebook.
1. ¿Cómo puedo probar si mis etiquetas Open Graph están funcionando correctamente?
La mejor manera de verificar tus etiquetas es con la herramienta oficial de Facebook, el Depurador de Compartir. Simplemente ingresa la URL de tu publicación o página, y la herramienta te mostrará una vista previa de cómo se verá al compartirla y listará cualquier error o advertencia que encuentre.
2. ¿Cuál es el mejor tamaño de imagen para una imagen de Open Graph de Facebook?
Para obtener los mejores resultados en pantallas de alta resolución, Facebook recomienda usar imágenes de al menos 1200 x 630 píxeles. Es importante mantener una relación de aspecto de 1.91:1 para evitar que tu imagen se recorte de forma extraña.
3. ¿Por qué Facebook muestra la imagen incorrecta incluso después de haber configurado una?
Esto suele ser un problema de caché. Facebook guarda los datos de Open Graph que ve por primera vez para una URL. Si actualizas la imagen, necesitas indicarle a Facebook que revise de nuevo ejecutando la URL a través de la herramienta Depurador de Compartir y haciendo clic en el botón 'Volver a analizar'.
4. ¿Las etiquetas de Open Graph afectan el SEO de mi sitio web?
Si bien las etiquetas de Open Graph no impactan directamente en tu clasificación en los motores de búsqueda, tienen un fuerte efecto indirecto. Una publicación social atractiva y de aspecto profesional genera tasas de clics más altas y más tráfico, lo que son señales positivas para los motores de búsqueda.
Recursos adicionales sobre Facebook y WordPress
Esperamos que este artículo te haya ayudado a agregar metadatos de Facebook Open Graph en WordPress. También podrías querer ver otras guías relacionadas sobre cómo usar Facebook en WordPress:
- Mejores Consejos y Tutoriales de Facebook para Usuarios de WordPress
- Cómo Publicar Automáticamente en Facebook desde WordPress
- Cómo Instalar y Configurar Comentarios de Facebook en WordPress
- Cómo crear una fuente personalizada de Facebook en WordPress
- Cómo Mostrar las Reseñas de tu Página de Facebook en WordPress
- Cómo Solucionar el Problema de Miniatura Incorrecta de Facebook en WordPress
- Cómo mostrar el Twitter y Facebook del autor en la página de perfil
- Cómo Crear una Página de Destino para Anuncios de Facebook en WordPress
- Cómo Solucionar el Problema de oEmbed de Facebook e Instagram en WordPress
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.
wpbeginner
@SteveJoseph@joshuatj Josh, no estoy seguro de cuándo revisaste el plugin por última vez, pero nuestro plugin tiene soporte completo para og:description. Ha estado ahí desde la versión 0.1.2. Aquí está el registro de cambios: http://wordpress.org/extend/plugins/facebook-open-graph-meta-in-wordpress/changelog/In en la versión 0.1.3, mejoramos el código de descripción para buscar realmente el código de descripción del plugin de Yoast, y si este no existe, entonces toma el extracto de la publicación si existe.
SteveJoseph
@joshuatj Buen punto y gracias de nuevo por los enlaces y tu ayuda. Lo aprecio mucho. Entre Linter y el plugin de Yoast, creo que estaré bien. Mis mejores deseos.
joshuatj
@SteveJoseph O puedes esperar hasta que Facebook haga su ejecución de Lint.
SteveJoseph
@joshuatj Intenté usar el linter antes, pero eso solo arregló la primera publicación. El resto todavía muestra la información antigua. Sin embargo, me acabo de dar cuenta de que si hago lint a cada página única, entonces muestra la información correcta, que es lo que publicaste arriba. Molesto, pero supongo que esto es lo que necesitaré usar por ahora o revisaré el enlace que proporcionaste y veré si ese plugin me funciona. ¡Muchas gracias, amigo! ¡Saludos!
joshuatj
@SteveJoseph Oops, tienes razón, sí cometí un error tipográfico ahí. Quise decir “Yoast”. http://yoast.com/wordpress/seo/But en realidad, Yoast hace más que solo resolver el problema de la descripción og, por lo que podría no ser lo que quieres. Acabo de usar URL Linter (http://developers.facebook.com/tools/lint/) para tu sitio. Parece que está mostrando esta descripción “Future Tomorrow is the collective online moniker, portfolio site and blog of Steve Joseph. With over 14yrs creative experience across several disciplines and knowledge that far extends beyond “just being a creative”, there is much to share but still more to learn.”. ¿Es eso lo que quieres en el campo de descripción? ¿Intentar “compartir en Facebook” de nuevo?
SteveJoseph
@joshuatj Gracias por la respuesta joshuatj. Desafortunadamente, una búsqueda de “Yeost Facebook Plugin” o “Yeost Plugin” no arrojó resultados útiles para guiarme a esta posible solución. ¿Tienes un enlace directo?
También intenté buscar “Yoast” pensando que podría haber un error tipográfico en tu respuesta y eso todavía no me llevó a una solución. Cualquier ayuda adicional sería muy apreciada. Gracias por tu tiempo.
joshuatj
@SteveJoseph No creo que este plugin se encargue de la descripción. ¿Prueba con el de Yeost?
SteveJoseph
disculpa la falta de enlace – http://futuretomorrow.net/blog/ – haz clic en “share this on Facebook” en cualquier publicación para ver lo que está sucediendo en detalle visual. Gracias de nuevo.
SteveJoseph
Hola,
Probé tanto tu plugin como el método de código y ninguno funcionó. Al hacer clic en “compartir esto en Facebook” desde mi blog, mi título es correcto, la URL es correcta, la imagen es correcta, pero la descripción es antigua e incorrecta. ¿Hay alguna actualización del código o del plugin donde la “descripción” se muestre correctamente? Gracias de antemano.
Saludos,
Steve
joshuatj
¡El plugin es genial! ¡Gracias wpbeginner! Sin embargo, sería genial si también pudiéramos agregar el contenido de la “descripción” para la etiqueta meta <meta property=\"og:description\" content=\"\">
ExpandSM
lo siento, el sitio es http://societyofsocialpreneurs.com/blog
ExpandSM
¡Gracias por este plugin! Tengo un blog que también es un sitio de Buddypress y no puedo hacer que extraiga el extracto de la publicación. ¿Alguna sugerencia?
jaffa
@wpbeginner Gracias por tu respuesta.
Me doy cuenta de que me estoy convirtiendo en la mayor molestia en este hilo y esta será mi última pregunta:
Uso la función 'catch that image' y 'tim thumb' en mi sitio y me preguntaba cómo o si podría implementar eso en esta función para reemplazar el código que busca una imagen destacada.
A veces no uso la imagen destacada, por lo que sería útil si el script pudiera simplemente buscar la primera imagen en la publicación y, si no está, usar la predeterminada.
Thanks in advance
dbrabyn
@wpbeginner @dbrabyn Entendido. Acabo de probarlo y para una publicación sin imagen destacada pero con una imagen de publicación, FB Lint me dice: "La URL de la imagen no cumple con RFC2396 y no se mostrará correctamente." La ausencia de una imagen predeterminada también es un problema. Gracias de todos modos.
wpbeginner
@jaffa Si no tienes estas etiquetas meta, y el usuario DA LIKE a una publicación usando el botón de like en tu blog (FB elegirá una imagen aleatoria para ellos)... Ahora, si ponen el enlace en su perfil de Facebook (entonces tendrán la opción)... La mayoría de las veces la gente hace clic en el botón de like en lugar de copiar el enlace y pegarlo en su cuadro de estado de Facebook. Este plugin realmente soluciona ese problema.
wpbeginner
@dbrabyn El plugin que tenemos en el repositorio realmente hace eso. Busca la imagen destacada y si no se encuentra, recurre a la primera imagen de la publicación... El fragmento de este post no hace eso. Simplemente usa el plugin.
jaffa
¡Finalmente logré que esto funcionara con la ayuda de wpbeginner!
Tengo una pregunta, sin embargo, cuando comparto una página que no tiene ninguna imagen en el contenido, se usa la imagen predeterminada. ¿Es posible especificar más de una imagen predeterminada?
Además, noté que si comparto la página de inicio del sitio web, tengo la opción de elegir entre todas las imágenes de la página, pero al compartir una página normal, me veo obligado a usar solo la predeterminada. ¿Hay alguna forma de ver todas las imágenes de la página?
Gracias
dbrabyn
¿Hay alguna forma de hacer que esta función obtenga la primera imagen de la publicación, luego la imagen destacada y luego la imagen predeterminada? Tal como lo hace get_the_image.
jaffa
¡@wpbeginner lo hará!
Thank you so much
wpbeginner
@jaffa Si nos envía un correo electrónico usando el formulario de contacto, definitivamente podemos investigarlo y ayudarlo a que esto funcione.
jaffa
@wpbeginner No es que no esté satisfecho con el artículo aquí, es solo que no parece que funcione. Siempre visito este sitio porque me ha ayudado mucho y me ha permitido aprender mucho sobre wp.
No pude hacer que el opengraph funcionara y luego comencé a buscar en línea en otros lugares, lo que me llevó a otros artículos que solo me confundieron. Luego volví aquí para intentarlo de nuevo. Tal vez hice algo incorrecto o hay algo que no está bien en mi tema que le impide funcionar. Eso es lo que quise decir con 'lo resolveré'.
Agradezco sus respuestas y ayuda.
Gracias.
wpbeginner
@jaffa No necesitas una aplicación si no quieres. Todavía puedes recuperar análisis para tus botones de 'me gusta' a través de tu cuenta personal. No hay nada que resolver porque el artículo lo explica todo, pero si aún no estás satisfecho, entonces sí, investiga más.
jaffa
¡@wpbeginner ok, gracias!
Otros artículos sugirieron que se necesitaba crear una aplicación, por eso estaba confundido. Olvídalo, lo resolveré.
wpbeginner
@jaffa NO TIENES QUE crear una aplicación de Facebook para este tutorial. Funcionará sin importar. Tenemos la aplicación en nuestra página por otras razones que no se relacionan con el tutorial mencionado en este artículo.
jaffa
@wpbeginner gracias por tu respuesta. Me estaba confundiendo mucho :s
¿Necesito crear una aplicación de Facebook para que esto de Open Graph funcione correctamente? Acabo de revisar el código fuente de esta página y tienes un campo 'fb:app_id' que no está incluido en el código anterior.
Me disculpo por todas las preguntas, si alguien puede dirigirme a alguna documentación sobre Open Graph, con gusto intentaré encontrar algunas respuestas y volveré para compartir cualquier información que pueda encontrar.
Gracias
wpbeginner
@jbjb3077 Look at our article about showing custom fields anywhere on the site. Custom Fields 101 article covers that on our site
wpbeginner
@jaffa No es lo mismo que un ID de aplicación... Tu ID de usuario personal es diferente.
jaffa
esta puede parecer una pregunta muy tonta, pero para que esto funcione, ¿tienes que crear una aplicación de Facebook primero? Solo tengo una página normal de Facebook y nada más y he probado este código muchas veces pero todavía no consigo que funcione. Cuando lo ejecuto a través de la herramienta linter, obtengo el error: ID de aplicación inválido.
¿Es el ejemplo del ID DE USUARIO anterior lo mismo que un ID de aplicación o no?
jbjb3077
@jbjb3077 por favor revisa esto....
mark.bravura
Gracias de nuevo por tu rápida respuesta. Y ese es el corazón de mi pregunta... el plugin Facebook Open Graph Meta For WordPress está extrayendo todos los metadatos correctamente, excepto por los datos de resumen/descripción. De ahí que me pregunte cómo ajustarlo manualmente. ¿Alguna sugerencia?
wpbeginner
@mark.bravura Tu título de publicación se está extrayendo como título. Tu resumen se está extrayendo como descripción. Tu imagen destacada (miniatura) se está extrayendo como miniatura. Modifica cualquiera de esas y podrás modificar los datos og.
mark.bravura
Gracias por la rápida respuesta. Entonces, ¿hay una manera razonablemente fácil de ajustar (acceder/modificar) manualmente los datos OG?
wpbeginner
@mark.bravura La información en realidad ya está almacenada en tu base de datos. Este plugin simplemente la muestra.
mark.bravura
Hola,
Al usar el plugin de metadatos OG, ¿en qué archivo PHP almacena las etiquetas? ¡Gracias!
Liverpoolfcblog
Hola wpbeginner @wpbeginner, el código está funcionando bien. Gracias por eso.
Solo tengo una pregunta. Ejecuté artículos individuales a través del linter de Facebook y todos aparecieron bien. Sin embargo, cuando ejecuté mi página de inicio, dice esto:
Propiedad requerida faltante og:title es requerida
Falta propiedad requerida: og:type es requerida
Falta propiedad requerida: og:url es requerida
Falta propiedad requerida: og:image es requerida
Noté esto en el código: if ( !is_singular()) //si no es una publicación o una página return;
¿Afecta agregar las cuatro anteriores a cómo Facebook ve mi sitio? Por ejemplo, ¿lo categorizará como un sitio web y mostrará el Título?
Salud.
Personal editorial
Puedes eliminar el elemento is_singular y mostrar esto en la página de inicio… La mayoría, si no todos, los blogs de WordPress solo se comparten desde la página de publicación individual. Esa es también la página donde el botón Me gusta es prominente.
Administrador
jbjb3077
hola, las imágenes de mis publicaciones están en un campo personalizado (thumb), tuve un hack con la versión anterior pero ahora no puedo averiguar cómo agregarlo. por favor, ayúdame. este es el código que he reemplazado
if ( get_post_meta($post->ID, ‘thumb’, true) ) { //la publicación tiene imagen destacada $thumbnail_src = get_post_meta($post->ID, “thumb”, true); echo ‘<meta property=”og:image” content=”‘ . esc_attr( $thumbnail_src[0] ) . ‘”/>’; } else{ echo ‘<meta property=”og:image” content=”imagen de mi sitio en una ruta.jpg”/>’; } echo “n”;
Danny Foo
Todavía tengo el problema de la miniatura incluso después de hacer el método de la función.
Por cierto, ¿tienes que actualizar el xmlns:og? La documentación de opengraph de Facebook lo señala como; http://ogp.me/ns#
Nurul Imam
Gracias… Agregué con éxito esta función a mis temas
jaffa
@Elliot – El tema sí soporta miniaturas de publicaciones, estoy usando un tema hijo de Twenty Ten
Aquí he agregado una copia del código dentro de functions.php para agregar soporte para miniaturas;
http://pastebin.com/7Cw480Xy
¿Quizás hice algo mal aquí?
jaffa
Gracias Daniel, agregar eso ayudó a eliminar los errores que estaba recibiendo antes, pero ahora me dice que faltan el título, la URL, la imagen y el tipo, aunque están ahí.
También está mostrando la imagen incorrecta, no parece estar captando la imagen del artículo, sino una imagen aleatoria de la página.
No tengo idea de por qué no puedo hacer que esto funcione, quería evitar usar el plugin pero tal vez sea la única manera.
Gracias chicos por su ayuda.
Daniel Chenery
Oh! I have that issue too. I popped the info in my header.php, lint the homepage = Works
Link a post page = Broken
I just gave up and ignored it!
jaffa
Gracias Daniel por intentar ayudar.
Creo que tendré que rendirme también, no puedo perder todo mi tiempo en esto.
Hubiera estado genial si hubiera funcionado para mí.
Elliott, el chico del diseño web
Presumiblemente, ¿lo has vuelto a analizar con la herramienta de linter antes de volver a probarlo? Además, ¿has puesto el código en tu functions.php o en tu header.php?
jaffa
Sí, seguí tu consejo y usé la herramienta de linter, pero todavía no hay suerte.
Y, coloqué el código en el functions.php.
Elliott, el chico del diseño web
¿Tu tema soporta miniaturas de publicaciones?
jaffa
Agregué el código a mi archivo functions y luego seguí tu artículo sobre cómo agregar el botón Like y Send, y todo parecía estar bien, pero hoy, cuando mi cliente publicó un enlace en el muro de FB al último artículo, no había opción para seleccionar una imagen que acompañara al artículo.
No puedo entender qué salió mal o cómo solucionarlo. Supongo que es el código de FB que agregué lo que causó esto, ya que no he hecho ningún otro cambio.
¿Alguna idea de cuál podría ser el problema?
Personal editorial
Sí, te quita la opción de elegir imágenes... El código elige la IMAGEN por ti. Elige la miniatura de la publicación y la envía como la imagen de ese artículo.
Administrador
jaffa
Gracias por tu respuesta.
No me di cuenta de que quitaba esa opción. Pero todavía no entiendo por qué no mostraba la miniatura cuando he incluido una imagen en miniatura. Simplemente no había ninguna imagen allí en absoluto.
Cuando veo el código fuente, puedo ver un enlace a la imagen en el campo og:image.
Ojalá pudiera hacer que funcionara, quizás tenga que probar el plugin.
Solo una cosa más, he definido varios tamaños de miniatura diferentes en mi tema para usar en varios lugares, así que en lugar de que llame a la imagen de tamaño 'medium', ¿necesito configurarlo para que llame a una de mis miniaturas definidas?
¡Perdón por el comentario largo y confuso, soy nuevo aquí!
Elliott, el chico del diseño web
Facebook will scrape your site every 24hrs or so… so if you’ve made any changes on your site facebook will need to catch up – 24hrs or so later. But, you can force facebook to re-scrape your site by using the linter tool. Before testing the Send button again run anyone of your url’s through http://developers.facebook.com/tools/lint/ to force Facebook to refresh the details, hopefully this should resolve the image issue
jaffa
Gracias Elliott, la herramienta Linter a la que proporcionaste un enlace fue bastante útil.
Después de pasar una URL por ella, el mensaje de error que obtuve fue:
El campo fb:admins contenía algunos IDs inválidos, noté que mi ID de página tiene 15 caracteres pero el que se usó en el ejemplo anterior solo tiene 10.
El otro mensaje que recibí fue:
Pusiste el ID de la aplicación en el campo fb:admins. Debería estar en fb:app_id
¿Debería haber un campo adicional para app_id en el código anterior?
Ahora estoy un poco confundido...
Daniel Chenery
@Jaffa Lo que necesitas hacer es agregar
Debería funcionar.
Daniel Chenery
Lo siento, pensé que la etiqueta
códigomantendría las etiquetas, resulta que no. Déjame intentar publicar eso de nuevo<meta property=”fb:app_id” content=”Tu_App_ID”/>
<meta property=”fb:admins” content=”Tu_Profile_ID”/>
Gretchen
No veo un campo para la imagen predeterminada, solo para el ID y el nombre del sitio. ¿Me falta algo?
Personal editorial
Actualizamos el plugin para corregir un error con el problema de la imagen predeterminada. Ahora, verifica si tu publicación tiene una miniatura... Si no la tiene, entonces elige la primera imagen de tu publicación. Tenemos planes de traer de vuelta la función de imagen predeterminada pronto.
Administrador
Gretchen
¡Bien! Definitivamente me gusta la función de imagen predeterminada, porque no todas mis publicaciones tienen imágenes.
¡Gracias por el gran plugin!
Ayanna Mitchell
Instalé el plugin... pero no hay ningún lugar para agregar una imagen predeterminada. Por favor, ayúdame.
Personal editorial
Mira nuestra respuesta a Gretchen.
Administrador
Ovidiu
I am curios about this part of the code: add_opengraph_doctype the problem is that that function doesn’t seem to do anything on my install
the rest is working fine but this add_opengraph_doctype doesn’t.
¿Es necesario y por qué crees que mi tema no activa eso?
Personal editorial
No hará nada si tu tema no incluye un código estándar (atributos de idioma) que todos los temas de WordPress DEBERÍAN incluir.
Administrador
Ovidiu
Me falta la inclusión de este código: `’ xmlns:og=”http://opengraphprotocol.org/schema/” xmlns:fb=”http://www.facebook.com/2008/fbml”‘`
mi header.php tiene esto al principio:
`
`
¿Qué está mal? ¿Qué me falta?
Ovidiu
ok, parece que se está filtrando... aquí hay un enlace a pastebin: http://pastebin.com/vrsVzFhU
Sheryl
Instalé el plugin de open graph en wordpress. Configuré los ajustes, intercambiando el nombre de mi empresa por el nombre en la URL que publicaste.
¿Y ahora qué?? ¿Qué hago a continuación para que el botón de enviar aparezca debajo de mi botón de me gusta?
Personal editorial
Mira nuestro artículo sobre el botón de enviar. También puedes usar nuestro plugin SmartSharing.
Administrador
Thnok
¿Dónde necesito agregar el código en functions.php? ¿Al principio o dónde?
El plugin no funciona.
Preston
Esto es genial. ¿Alguna guía sobre cómo modificar esto para que Facebook extraiga un resumen del contenido escrito? El plugin no va al contenido, sino que toma el nombre del autor, las categorías y la fecha. ¿Opiniones?
Elliott, el chico del diseño web
sí, solo agrega esto después de la primera declaración if:
echo ‘<meta property="og:description" content="” />’
Preston
Intenté agregar ese código y recibí un error fatal que deshabilitó el plugin. No puedo entender por qué.
Elliott, el chico del diseño web
parece que los comentarios no permiten cierto marcado, sígueme en twitter y te enviaré el código por mensaje directo.
El contenido debe contener la función wp the_excerpt()
Gretchen
¿Supongo que si tenemos una página de Facebook para el sitio web, ingresaríamos el ID de usuario de la página en lugar del de nuestro perfil personal de Facebook?
Chris Bracco
Este código solo agrega las etiquetas OG a publicaciones y páginas individuales. Me gustaría que las etiquetas aparecieran en todas mis páginas, y no puedo encontrar una manera sencilla de lograrlo. ¿Alguna idea?
Personal editorial
¿Tienes botones individuales de me gusta / enviar en tus páginas de archivo, categorías, etiquetas??? Los botones de me gusta solo son buenos en publicaciones / páginas individuales, por eso el código agrega eso. El único otro botón de me gusta agregado en el sitio es la (Caja de Me gusta) para la página de Facebook del sitio. Que no requiere esta información.
Pero si debes hacerlo, elimina la declaración condicional !is_singular.
Administrador
Daniel Chenery
Seguramente parece más fácil simplemente insertar la información en header.php? Estoy seguro de que leí un tutorial sobre eso una vez
Personal editorial
Puedes codificarlo directamente en el header.php, pero es un proceso de múltiples pasos ya que tienes que editar el doctype, luego agregar las otras meta etiquetas… Este es un proceso de un solo paso. Pega y listo. O instala el plugin y listo. Si usas el plugin, entonces estás aún mejor porque las etiquetas permanecen incluso cuando cambias de tema.
Administrador