Como estira facebook las imagenes de la web

webbogado · #1 (**permalink**) 18/02/2016, 06:20

Buenas. Alguien me puede decir como hace facebook para estirar las imagenes cuando copias el link en el estado? O como hago para que salga una imagen y un titulo bien presentable

rodocoyote15 · #2 (**permalink**) 18/02/2016, 15:15

Hay muchas librerías que puedes utilizar con Jquery para mostrar imagenes, carruseles, sliders, etc. , aunque si deseas algo muy personalizado, tienes que realizarlo con las correspondientes hojas de estilo. Saludos

webbogado · #3 (**permalink**) 19/02/2016, 07:09

Creo que no me entendiste, tenes Facebook?

Mira cuando copias un link en tu estado como para publicar, Facebook estira automáticamente una imagen y un texto, quiero saber cual es el procedimiento que toma facebook para estirar esa imagen de tu pagina web, o como hago que facebook estire de mi pagina web la imagen que yo deseo y el titulo que yo deseo

xfxstudios · #4 (**permalink**) 19/02/2016, 07:53

Cita:

Iniciado por webbogado

Creo que no me entendiste, tenes Facebook?

Mira cuando copias un link en tu estado como para publicar, Facebook estira automáticamente una imagen y un texto, quiero saber cual es el procedimiento que toma facebook para estirar esa imagen de tu pagina web, o como hago que facebook estire de mi pagina web la imagen que yo deseo y el titulo que yo deseo

Investiga y encontrarás lo que necesitas sin ser sarcastico

TEMA

pateketrueke · #5 (**permalink**) 19/02/2016, 11:11

Caray, además con el término "estirar" uno se confunde más, yo pensaba que estirar era algo así como alargar algo, un objeto elástico, etc.

jhonjaider1000 · #6 (**permalink**) 19/02/2016, 16:17

Hola amigo, hacer esto en realidad es muy sencillo, si conoces los meta tags de HTML, y los has usado alguna vez en tus sitios, ya tienes la solución en tus manos;

Facebook nos obliga a crear metatags propiamente para el, por tanto también nos presenta una herramienta con la cual puedes ver que información mostrará facebook de tú página; el enlace a la herramienta es el siguiente:

https://developers.facebook.com/tools/debug/

Allí solo debes ingresar el link de tu página, hacer click en el botón Debug, y así Facebook te mostrará como se verá tu sitio cuando sea publicado en esta red social, es posible que si alguna vez has tratado de compartir el enlace de tú página, Facebook ya ha guardado la información de esta, por tanto esta herramienta también te permite volver a depurar la información que cambies en los meta tags, y esto se hace con los botones que aparecen en la barra inferior que aparecen despues de que hayas ingresado el link y hecho click en el botón que inicialmente se llamaba Debug.

Pero esto es solo una herramienta para visualizar la información que tomará facebook para mostrar en sus enlaces a tu sitio, así que a continuación lo que debes hacer para conseguir el objetivo de esta pequeña guía.

Como te mencionaba debes usar meta tags propiamente escritos para el, por tanto a continuación te dejo todos los meta tags que necesitas para personalizar cómo se verá tu sitio en una publicación en facebook, los dos primeros son los meta tags que generalmente por defecto deberías poner en todos tus sitios para que los buscadores y demás redes sociales sepan que contenido especifico mostrar, he puesto solo dos, en realidad hay más, pero mi objetivo era mostrarte los meta tags necesarios donde también te explico que debe ir en cada uno, para que cuando compartas el link de tu sitio en Facebook, obtengas un enlace agradable que cualquiera desea visitar.

NOTA: Los siguientes meta tags deben ir en el Encabezado de la página, es decir entre las etiquetas <head></head>

Código HTML:

Ver original<meta name="description" content="Descripción del sitio para otras páginas en general.">
<meta name="keywords" content="Las famosas palabras claves, una lista no mayor a 20,30, ya que google en la actualidad no le presta mucha atención a esto">
<meta property="og:image" content="http://tudomino.com/images/imagen_que_deseas_que_vea_facebook.jpg">
<meta name="author" content="El nombre del autor, o el archivo con los posibles autores del sitio.">
<meta property="og:locale" content="es_ES">
<meta property="og:type" content="website">
<meta property="og:title" content="Título de la página, el mismo que pones en el el title del head del index de la página">
<meta property="og:description" content="Descripción del sitio, generalmente el texto que dices que facebook toma.">
<meta property="og:url" content="http://tudominio.com">
<meta property="og:site_name" content="El nombre que toma facebook para mostrar la página.">

Y esto es todo!

Espero que te haya servido mi ayuda, cualquier duda no olvides preguntar