markup

package
v0.0.0-...-1864ee8 Latest Latest
Warning

This package is not in the latest version of its module.

 Go to latest Published: Feb 25, 2025 License: MIT Imports: 8 Imported by: 0

Documentation

Index

Constants

View Source 
const (
	// AttributeClass is the class attribute for an HTML element.
	AttributeClass = "class"
	// AttributeID is the ID attribute for an HTML element.
	AttributeID = "id"
)

Variables

This section is empty.

Functions

This section is empty.

Types

type Attributes 

type Attributes map[string]string

Attributes specifies additional attributes for an HTML element as key-value pairs. This could be ID, Classes, Data attributes or any other attribute that is relevant to the element.

type Component 

type Component interface {
	// Render the template.
	Render(ctx context.Context, w io.Writer) error
}

Component is the interface that all templates implement.

type HeadProps 

type HeadProps struct {
	// Required meta properties
	Title         string
	Description   string
	Image         string
	DatePublished time.Time
	DateModified  time.Time
	Locale        string // ISO 639-1 defaults to "en_GB"

	// Other
	URL    string // The full URL of the page.
	IsPage bool   // If true, the page is a page, not a post.

	// Additional meta properties
	Private   bool   // If true, the page should not be indexed by search engines.
	Canonical string // The canonical URL of the page.

	// Schema, Meta & Opengraph
	OpenGraph    *OpenGraph
	Twitter      *TwitterCard
	Organisation *schemaorg.Organisation
	Navigation   *schemaorg.BreadcrumbList

	// Other (Code Injection)
	Other string

	// To define additional meta tags and any other HTML, see webkitctx.WithHeadSnippet
	Snippets []webkitctx.MarkupSnippet
}

HeadProps defines the properties that should be included in the head of the document.

func (HeadProps) Render 

func (h HeadProps) Render(ctx context.Context, w io.Writer) error

Render renders the head of the document to the provided writer.

type ImageMimeType 

type ImageMimeType string

ImageMimeType specifies a mimetype four a <source> element that is outputted on the type attribute. 

const (
	ImageMimeTypeAPNG ImageMimeType = "image/apng"
	ImageMimeTypeAVIF ImageMimeType = "image/avif"
	ImageMimeTypeGif  ImageMimeType = "image/gif"
	ImageMimeTypeJPG  ImageMimeType = "image/jpeg"
	ImageMimeTypePNG  ImageMimeType = "image/png"
	ImageMimeTypeSVG  ImageMimeType = "image/svg+xml"
	ImageMimeTypeWebP ImageMimeType = "image/webp"
)

ImageMimeType constants that are defined at: https://developer.mozilla.org/en-US/docs/Web/Media/Formats/Image_types

type ImageOptions 

type ImageOptions func(p *ImageProps)

ImageOptions allows for optional settings to be applied to an <img> or <source>.

func ImageWithAlt 

func ImageWithAlt(alt string) ImageOptions

ImageWithAlt attaches alternative text to the image.

func ImageWithAttribute 

func ImageWithAttribute(key, value string) ImageOptions

ImageWithAttribute attaches a custom attribute to the image that will be rendered in the HTML, for example data-id="main-image".

func ImageWithEagerLoading 

func ImageWithEagerLoading() ImageOptions

ImageWithEagerLoading sets loading=eager to the image.

func ImageWithHeight 

func ImageWithHeight(height int) ImageOptions

ImageWithHeight sets the height of the image.

func ImageWithLazyLoading 

func ImageWithLazyLoading() ImageOptions

ImageWithLazyLoading sets loading=lazy to the image.

func ImageWithWidth 

func ImageWithWidth(width int) ImageOptions

ImageWithWidth sets the width of the image.

type ImageProps 

type ImageProps struct {
	// The URL of the image, which will map to the srcset or src attribute.
	// For example: "/images/dog.jpg"
	URL string

	// Defines text that can replace the image in the page.
	// Note: Will not output if IsSource is true, as alt  is not valid for source elements.
	Alt string

	// Determines if the image is a source element.
	IsSource bool

	// Media specifies the media condition (media query) for the source,
	// For example: "(min-width: 600px)"
	Media string

	// Mimetype such as
	// - image/jpeg
	// - image/png
	// - image/gif
	// - image/avif
	// - image/webp
	// - image/svg+xml
	MimeType ImageMimeType

	// Optional name for an image (used for sizing).
	Name string

	// Determines if loading=lazy should be added to the image.
	Loading LoadingAttribute

	// The intrinsic width of the image in pixels , for example (300).
	// Must be an integer without a unit (optional).
	Width *int

	// The intrinsic height of the image, in pixels, for example (300).
	// Must be an integer without a unit (optional).
	Height *int

	// Attributes specifies additional attributes for the picture element as key-value pairs.
	// For example: markup.Attributes{"id": "main-picture", "class": "responsive-picture"}
	Attributes Attributes
}

ImageProps defines the fields for an individual image or source HTML element. The data type supports both <img> and <source> elements.

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source

func Image 

func Image(provider ImageProvider, opts ...ImageOptions) ImageProps

Image - TODO

func (ImageProps) Render 

func (i ImageProps) Render(ctx context.Context, w io.Writer) error

Render renders an <img> element to the provided writer.

type ImageProvider 

type ImageProvider interface {
	ImageMarkup() ImageProps
}

ImageProvider is a common - TODO

type ImageSize 

type ImageSize string

ImageSize specifies the size of the image, as defined in the static and dynamic renderers. With any luck, all sizes listed below will be rendered. 

const (
	ImageSizeThumbnail ImageSize = "thumbnail"
	ImageSizeMobile    ImageSize = "mobile"
	ImageSizeTablet    ImageSize = "tablet"
	ImageSizeDesktop   ImageSize = "desktop"
)

ImageSize constants that are defined by sharp when resizing images.

type LoadingAttribute 

type LoadingAttribute string

LoadingAttribute specifies the loading attribute for an image. Indicates how the browser should load the image: 

const (
	// LoadingEager loads the image immediately, regardless of whether or not the
	// image is currently within the visible viewport (this is the default value).
	LoadingEager LoadingAttribute = "eager"

	// LoadingLazy Defers loading the image until it reaches a calculated distance
	// from the viewport, as defined by the browser. The intent is to avoid the
	// network and storage bandwidth needed to handle the image until it's
	// reasonably certain that it will be needed. This generally improves
	// the performance of the content in most typical use cases.
	LoadingLazy LoadingAttribute = "lazy"
)

type OpenGraph 

type OpenGraph struct {
	// Basic Metadata - https://ogp.me/#metadata
	Type  string           `json:"type"`
	Title string           `json:"title"`
	URL   string           `json:"url"`
	Image []OpengraphImage `json:"image"`

	// Optional Metadata - https://ogp.me/#optional
	Audio           []OpengraphAudio `json:"audio,omitempty"`
	Description     string           `json:"description,omitempty"`
	Determiner      string           `json:"determiner,omitempty"`
	Locale          string           `json:"locale,omitempty"`
	LocaleAlt       []string         `json:"locale_alternate,omitempty"`
	Video           []OpengraphVideo `json:"video,omitempty"`
	SiteName        string           `json:"site_name,omitempty"`
	SeeAlso         []string         `json:"see_also,omitempty"`
	FacebookAccount string           `json:"fb:app_id,omitempty"`
}

OpenGraph represents web page information according to OGP.

See https://ogp.me/ for more details.

type OpenGraphArticle 

type OpenGraphArticle struct {
	PublishedTime time.Time `json:"published_time,omitempty"`
	ModifiedTime  time.Time `json:"modified_time,omitempty"`
	Author        string    `json:"author,omitempty"`  // Full name author
	Section       string    `json:"section,omitempty"` // Usually the URL, i.e. Blog or Insights
	Tags          []string  `json:"tags,omitempty"`    // Associated tags with the article.
}

OpenGraphArticle represents a structure of "article" type. See https://ogp.me/#type_article for more details.

  • article:published_time
  • article:modified_time
  • article:author
  • article:section
  • article:tag

type OpengraphAudio 

type OpengraphAudio struct {
	URL         string `json:"url,omitempty"`
	SecureURL   string `json:"secure_url,omitempty"`
	ContentType string `json:"type,omitempty"`
}

OpengraphAudio represents a structure of "og:audio". "og:audio" might have the following properties:

  • og:audio:url
  • og:audio:secure_url
  • og:audio:type

type OpengraphImage 

type OpengraphImage struct {
	URL         string `json:"url,omitempty"`
	SecureURL   string `json:"secure_url,omitempty"`
	ContentType string `json:"type,omitempty"`
	Width       int    `json:"width,omitempty"`
	Height      int    `json:"height,omitempty"`
	Alt         string `json:"alt,omitempty"`
}

OpengraphImage represents a structure of "og:image". "og:image" might have following properties:

  • og:image:url
  • og:image:secure_url
  • og:image:type
  • og:image:width
  • og:image:height
  • og:image:alt

type OpengraphVideo 

type OpengraphVideo struct {
	URL         string `json:"url,omitempty"`
	SecureURL   string `json:"secure_url,omitempty"`
	ContentType string `json:"type,omitempty"`
	Width       int    `json:"width,omitempty"`
	Height      int    `json:"height,omitempty"`
	Duration    int    `json:"duration,omitempty"` // Duration in seconds
}

OpengraphVideo represents a structure of "og:video". "og:video" might have following properties:

  • og:video:url
  • og:video:secure_url
  • og:video:type
  • og:video:width
  • og:video:height

type PictureOptions 

type PictureOptions func(p *PictureProps)

PictureOptions allows for optional settings to be applied to a <picture>.

func PictureWithAlt 

func PictureWithAlt(alt string) PictureOptions

PictureWithAlt attaches alternative text to the picture.

func PictureWithAttribute 

func PictureWithAttribute(key, value string) PictureOptions

PictureWithAttribute attaches a custom attribute to the image that will be rendered in the HTML, for example data-id="main-image".

func PictureWithClasses 

func PictureWithClasses(classes ...string) PictureOptions

PictureWithClasses appends any CSS classes to the picture.

func PictureWithEagerLoading 

func PictureWithEagerLoading() PictureOptions

PictureWithEagerLoading sets loading=eager to the picture.

func PictureWithHiddenMediaSources 

func PictureWithHiddenMediaSources() PictureOptions

PictureWithHiddenMediaSources modifies the picture so sizes where sources with size attributes are hidden.

func PictureWithLazyLoading 

func PictureWithLazyLoading() PictureOptions

PictureWithLazyLoading sets loading=lazy to the picture.

func PictureWithSize 

func PictureWithSize(sizes ...string) PictureOptions

PictureWithSize filters the sources to only include those that contain any of the specified size strings in their name.

When multiple sizes are provided: - The last matching size will be used as the base source for URL, Width, and Height. - Only the last size applies filtering (excluding exact matches). - Earlier sizes include all matching sources.

type PictureProps 

type PictureProps struct {
	// The URL of the image, which will map to the src attribute.
	// For example: "/images/dog.jpg"
	URL string

	// Defines text that can replace the image in the page.
	Alt string

	// Maps to <source> elements within the <picture> element.
	// The browser will consider each child <source> element and choose the best match among them.
	Sources []ImageProps

	// List of class names to apply to the <picture> element.
	Classes []string

	// A unique identifier for the <picture> element.
	ID string

	// Determines if loading=lazy should be added to the image.
	Loading LoadingAttribute

	// The intrinsic width of the image in pixels , for example (300).
	// Must be an integer without a unit (optional).
	Width *int

	// The intrinsic height of the image, in pixels, for example (300).
	// Must be an integer without a unit (optional).
	Height *int

	// HideMediaSourcesWithSizeAttrs indicates if only next-gen image formats (AVIF & WebP)
	// should be used. When true, this will hide any <source> elements with size attributes,
	// effectively excluding them from the rendering process.
	HideMediaSizes bool

	// Attributes specifies additional attributes for the picture element as key-value pairs.
	// For example: markup.Attributes{"data-attribute-size": "large"}
	Attributes Attributes
}

PictureProps defines the fields for to render a <picture> element onto the DOM.

The <picture> HTML element contains zero or more <source> elements and one <img> element to offer alternative versions of an image for different display/device scenarios.

See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture

func Picture 

func Picture(provider PictureProvider, opts ...PictureOptions) PictureProps

Picture returns picture properties and transforms the options, so it can be rendered to the DOM.

func (PictureProps) Image 

func (p PictureProps) Image() ImageProps

Image transforms the PictureProps into an ImageProps type.

This is useful when you want to render a single image element, instead of the entire picture.

func (PictureProps) Render 

func (p PictureProps) Render(ctx context.Context, w io.Writer) error

Render renders a <picture> element to the provided writer.

type PictureProvider 

type PictureProvider interface {
	PictureMarkup() PictureProps
}

PictureProvider is a common interface that's used for implementing a standardised way of writing a <picture> element to the DOM.

Any type can implement this and pass it to the Picture() func.

type TwitterCard 

type TwitterCard struct {
	// Required properties
	Site        string `json:"twitter:site,omitempty"`        // The Twitter @username the card should be attributed to.
	Creator     string `json:"twitter:creator,omitempty"`     // The Twitter @username of the content creator.
	Title       string `json:"twitter:title"`                 // A concise title for the related content.
	Description string `json:"twitter:description,omitempty"` // A description that concisely summarizes the content.
	Image       string `json:"twitter:image,omitempty"`       // A URL to a unique image representing the content of the page.

	// Optional properties
	ImageAlt string `json:"twitter:image:alt,omitempty"` // A text description of the image conveying the essential nature of an image to users who are visually impaired.
}

TwitterCard represents web page information according to Twitter Card specifications. See https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/getting-started for more details.

Source Files

View all Source files

Directories

Path Synopsis
internal
templates

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL
go.dev uses cookies from Google to deliver and enhance the quality of its services and to analyze traffic. Learn more.