paulnicoue/composables/useAppHead.js

export const useAppHead = (pageTitleChunk) => {

    // --------------------------------------------------
    // DATA
    // --------------------------------------------------

    const siteTitle = 'Paul Nicoué';
    const siteUrl = 'https://paulnicoue.com';
    const pageTitle = pageTitleChunk ? `${siteTitle} | ${pageTitleChunk}` : siteTitle;
    const pageUrl = siteUrl + useRoute().path;
    const metaDescription = `Intégrateur et développeur web.`;
    const metaImageUrl = `${siteUrl}/images/paul-nicoue-logo-1200x675px.png`;

    // --------------------------------------------------
    // HEAD
    // --------------------------------------------------

    return useHead({
        htmlAttrs: {
            lang: 'fr'
        },
        title: pageTitle,
        meta: [
            /* Basic metadata */
            {charset: 'utf-8'},
            {name: 'viewport', content: 'width=device-width'},
            /* Name */
            {id: 'schema_name', itemprop: 'name', content: siteTitle},
            /* Description */
            {name: 'description', content: metaDescription},
            {id: 'schema_description', itemprop: 'description', content: metaDescription},
            /* Author */
            {name: 'author', content: siteTitle},
            /* Image */
            {id: 'schema_image', itemprop: 'image', content: metaImageUrl},
            /* Open Graph */
            {property: 'og:title', content: pageTitle},
            {property: 'og:description', content: metaDescription},
            {property: 'og:image', content: metaImageUrl},
            {property: 'og:image:width', content: '1200'},
            {property: 'og:image:height', content: '675'},
            {property: 'og:url', content: pageUrl},
            {property: 'og:type', content: 'website'},
            /* Twitter Card */
            {name: 'twitter:card', content: 'summary_large_image'},
            {name: 'twitter:title', content: siteTitle},
            {name: 'twitter:description', content: metaDescription},
            {name: 'twitter:image', content: metaImageUrl}
        ],
        link: [
            /* Canonical URL */
            {rel: 'canonical', href: pageUrl},
            /* Favicon */
            {rel: 'icon', sizes: 'any', href: 'favicon/paul-nicoue-favicon.ico'},
            {rel: 'icon', type: 'image/svg+xml', href: 'favicon/paul-nicoue-favicon.svg'},
            {rel: 'apple-touch-icon', href: 'favicon/paul-nicoue-apple-touch-icon.png'},
            {rel: 'manifest', href: 'favicon/paul-nicoue.webmanifest'}
        ],
        style: [
            /* Schema */
            {itemscope: true, itemtype: 'https://schema.org/WebSite', itemref: 'schema_name schema_description schema_image'}
        ],
        script: [
            /* Umami tracking code */
            {
                children:
                    `defer src="https://umami.paulnicoue.com/script.js" data-website-id="2df69370-61fb-424f-9719-d106f3e178b5"`
            }
        ]
    })
}