garmeeh / next-seo

Next SEO is a plug in that makes managing your SEO easier in Next.js projects.
MIT License
7.65k stars 397 forks source link

OG image tags are loading as separate meta tags within the <head></head> #857

Closed eduoliveira85 closed 3 years ago

eduoliveira85 commented 3 years ago

Pretty much the title. I'm using the DefaultSeo with a next-seo.config.js method but openGraph images are being loaded wrongly. Here is the code for my config file.

// next-seo.config.js
import { SITE_CANONICAL_URL, SITE_DESCRIPTION, SITE_NAME, SITE_TYPEKIT_LIB, SITE_URL } from "./lib/constants"

const staticFolder = SITE_URL + 'static/'
export default {
  canonical: SITE_CANONICAL_URL,
  defaultTitle: SITE_NAME,
  titleTemplate: `%s | ${SITE_NAME}`,
  description: SITE_DESCRIPTION,
  robotsProps: {
    nosnippet: true,
    notranslate: true,
    noimageindex: true,
    noarchive: false,
    maxSnippet: -1,
    maxImagePreview: 'none',
    maxVideoPreview: -1,
  },
  additionalLinkTags: [
    {
      rel: "stylesheet", 
      href: SITE_TYPEKIT_LIB
    },
    {
      rel: 'icon',
      href: staticFolder + 'favicons/favicon-16.png',
      sizes: '16x16'
    },
    {
      rel: 'icon',
      href: staticFolder + 'favicons/favicon-32.png',
      sizes: '32x32'
    },
    {
      rel: 'apple-touch-icon',
      href: staticFolder + 'favicons/apple-touch-icon.png',
      sizes: '180x180'
    },
    {
      rel: 'mask-icon',
      href: staticFolder + 'safari-pinned.svg',
      color: '#003462'
    },

  ],
  openGraph: {
    type: 'website',
    locale: 'pt_BR',
    url: SITE_URL,
    description: SITE_DESCRIPTION,
    canonical: SITE_CANONICAL_URL,
    site_name: SITE_NAME,
    images: [
      { 
        url: staticFolder + 'og/card_1200x672.jpg',
        width: 1200,
        height: 672,
        alt: 'Wide OG card'
      },
      { 
        url: staticFolder + 'og/card_512x512.jpg',
        width: 512,
        height: 512,
        alt: 'Squared OG Card'
      },
    ]
  },
}

And what is being loaded for that openGraph:images portion: image

These are the only tags loaded incorrectly and I'm not really understanding why. Am I missing something from the documentation about this array of Images?

Using Next 10.2.0 here.

stale[bot] commented 3 years ago

Is this still relevant? If so, what is blocking it? Is there anything you can do to help move it forward?

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.