findFirstImage

Finds the first img tag in a rendered HTML string and returns the src attribute. This function can be used to extract the first image form a block variable to be used separately in any other place like a teaser section of a page card in a pagelist.

@{ +main | findFirstImage }

To get the first image of a Markdown variable, the markdown functions has to be applied before.

@{ text | markdown | findFirstImage }

Example

One use case for this function is to render short previews of pages in a pagelist in order to create overview pages for blog posts.

<@ foreach in pagelist @>
  <a href="@{ url }">
    <h3>@{ title }</h3>
    <p>@{ +main | findFirstParagraph }</p>
    <@ with @{ +main | findFirstImage } { width: 500 } @>
      <img src="@{ :fileResized }" />
    <@ end @>
  </a>
<@ end @>

escape findFirstParagraph

Images play an essential role on the web and in any digital presence. Automad provides responsive images, image galleries, and slideshows as blocks that can be added to any block editor field. These blocks make it easy to display individual images with custom focal points and responsive aspect ratios, as well as manage and present image collections in versatile ways — from structured galleries to responsive slideshows.

Formats a date variable using a specified format string. The format string must be a valid DateTime format. Month and weekday names are automatically translated based on a given locale. To reference the current date, use the :now variable.

Returns a given default value for a variable in case the variable is not defined or empty.

Escapes a string to be safely used in JSON formatted data or similar. This function doesn't expect any parameters.

findFirstParagraph

Finds the first paragraph tag in a rendered HTML string and returns its content. This function can be used to extract the first text block form a block variable to be used separately as a teaser text for the page in a pagelist.

Sanitizes a string for use in URLs or HTML attributes. The resulting string contains only lowercase letters a-z, numbers 0-9, hyphens -, and optionally dots .. This method is also suitable for filenames, as it preserves dots as file extension separators by default.

Shortens a string to a given number of characters and appends an optional ellipsis, without cutting off words. To avoid open or incomplete HTML tags, all tags will be removed before shortening a string.

Strips a substring from the end of a string.