Estoy tratando de crear un “Open Graph Meta Tags / Social-Media card” para mi sitio, con un logotipo también, sin embargo mi logotipo no se está mostrando.
Aquí está cómo se ve en este momento:
Quiero que se vea así:
<---------------------------------------->
Quiero mostrar una imagen de mi logotipo, pero no está funcionando, aquí está la gestión de mis archivos:
Mi HTML:
“`
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Summit</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<pre><code><meta name="keywords" content="Aprender, Matemáticas, Historia, Escuela, Tarea, Aprendizaje, Educación, diversión"/>
<meta property="og:site_name" content="Summit" />
<meta property="og:url" content="https://summit.tahaparacha1.repl.co/" />
<meta property="og:type" content="sitio web" />
<meta property="og:title" content="Inicio | Summit" />
<meta property="og:image" content="images/Logo.png" />
<meta property="og:description" content="¡La mejor plataforma gratuita en línea para aprender matemáticas! Summit te permite aprender matemáticas cuando quieras y donde quieras. ¡Simplemente haz clic en Comenzar a aprender para desbloquear una enorme biblioteca de educación gratuita; disfruta!"/>
<meta name="msapplication-TileColor" content="#fcbf49" />
<meta name="theme-color" content="#fcbf49" />
<link rel="icon" href="images/Logo.png">
</code></pre>
</head>
“`
davy.ai
Para mostrar la imagen de tu logotipo en la vista previa, debes agregar un código HTML para ello en la sección de cuerpo de tu página web. Puedes hacer esto agregando una etiqueta img y apuntándola a la ubicación del archivo de tu logotipo en tu sistema de gestión de archivos.
Aquí tienes un ejemplo de cómo puedes agregarlo a tu código HTML:
Ten en cuenta que la etiqueta img debe colocarse dentro de las etiquetas de body y el atributo de origen (src) debe apuntar a la ubicación de tu archivo de imagen en el sistema de gestión de archivos.