dillonkearns/elm-pages/1.1.1

NOTE: the latest version is 12.3.0

Head.Seo

https://ogp.me/# https://developers.facebook.com/docs/sharing/opengraph

This module encapsulates some of the best practices for SEO for your site.

elm-pages will pre-render each of the static pages (in your content directory) so that web crawlers can efficiently and accurately process it. The functions in this module are for use with the head function that you pass to your Pages config (Pages.application).

import Date
import Head
import Head.Seo as Seo




-- justinmimbs/date package
type alias ArticleMetadata =
    { title : String
    , description : String
    , published : Date
    , author : Data.Author.Author
    }


head : ArticleMetadata -> List (Head.Tag Pages.PathKey)
head articleMetadata =
    Seo.summaryLarge
        { canonicalUrlOverride = Nothing
        , siteName = "elm-pages"
        , image =
            { url = Pages.images.icon
            , alt = articleMetadata.description
            , dimensions = Nothing
            , mimeType = Nothing
            }
        , description = articleMetadata.description
        , locale = Nothing
        , title = articleMetadata.title
        }
        |> Seo.article
            { tags = []
            , section = Nothing
            , publishedTime = Just (Date.toIsoString articleMetadata.published)
            , modifiedTime = Nothing
            , expirationTime = Nothing
            }
type alias Common pathKey =
{ title : String
, image : Image pathKey
, canonicalUrlOverride : Maybe (PagePath pathKey)
, description : String
, siteName : String
, audio : Maybe Audio
, video : Maybe Video
, locale : Maybe Locale
, alternateLocales : List Locale
, twitterCard : TwitterCard pathKey
}

These fields apply to any type in the og object types See https://ogp.me/#metadata and https://ogp.me/#optional

Skipping this for now, if there's a use case I can add it in:

  • og:determiner - The word that appears before this object's title in a sentence. An enum of (a, an, the, "", auto). If auto is chosen, the consumer of your data should chose between "a" or "an". Default is "" (blank).
type alias Image pathKey =
{ url : ImagePath pathKey
, alt : String
, dimensions :
Maybe
{ width : Int
, height : Int
}
, mimeType : Maybe MimeType
}
{ tags : List String
, section : Maybe String
, publishedTime : Maybe Iso8601DateTime
, modifiedTime : Maybe Iso8601DateTime
, expirationTime : Maybe Iso8601DateTime
}
-> Common pathKey
-> List (Tag pathKey)
{ canonicalUrlOverride : Maybe (PagePath pathKey)
, siteName : String
, image : Image pathKey
, description : String
, title : String
, audio : Audio
, locale : Maybe Locale
}
-> Common pathKey

Will be displayed as a Player card in twitter See: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/player-card

OpenGraph audio will also be included. The options will also be used to build up the appropriate OpenGraph <meta> tags.

{ firstName : String
, lastName : String
, username : Maybe String
}
-> Common pathKey
-> List (Tag pathKey)
Common pathKey
-> { duration : Maybe Int
, album : Maybe Int
, disc : Maybe Int
, track : Maybe Int
}
-> List (Tag pathKey)
{ canonicalUrlOverride : Maybe (PagePath pathKey)
, siteName : String
, image : Image pathKey
, description : String
, title : String
, locale : Maybe Locale
}
-> Common pathKey

Will be displayed as a large card in twitter See: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/summary

The options will also be used to build up the appropriate OpenGraph <meta> tags.

Note: You cannot include audio or video tags with summaries. If you want one of those, use audioPlayer or videoPlayer

{ canonicalUrlOverride : Maybe (PagePath pathKey)
, siteName : String
, image : Image pathKey
, description : String
, title : String
, locale : Maybe Locale
}
-> Common pathKey

Will be displayed as a large card in twitter See: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/summary-card-with-large-image

The options will also be used to build up the appropriate OpenGraph <meta> tags.

Note: You cannot include audio or video tags with summaries. If you want one of those, use audioPlayer or videoPlayer

{ canonicalUrlOverride : Maybe (PagePath pathKey)
, siteName : String
, image : Image pathKey
, description : String
, title : String
, video : Video
, locale : Maybe Locale
}
-> Common pathKey

Will be displayed as a Player card in twitter See: https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/player-card

OpenGraph video will also be included. The options will also be used to build up the appropriate OpenGraph <meta> tags.

website : Common pathKey -> List (Tag pathKey)