Content Areas

Poster Items have 3 content areas for displaying content.

You are able to configure these areas insite Poster Item Stack the following way.

Stacks Image 97

For the Markdown Folder integration, use following YAML metadata for displaying a image in the header area.

# Header image, will be displayed in header content area. Seperate in 2 attributes src and alt, to be added in a new line with 2 starting blanks. Optional.
header_image
# Display header image in details view also. Optional.
header_image_details: true

If you want to use a summary content to be displayed in list view, <!--read_more--> will seperate between Summary and Main content. The text above the read_more tag will be displayed in list and detail view, the content below the read_more tag only in detail view.

The header content area (optional) will be displayed above the title and is good for placing a leading image into it. If an image is placed into that area, it will be linked to the Poster Item details automatically.

The summary content area (optional) will be displayed in the list (if activated). When navigating to the Poster Item details, the summary content area will be replaces with the main content area.

Stacks Image 103
In addition, there are settings to change different margin and padding distances. See red, purple, and green color areas and their respective settings in the Poster Main stack.
Stacks Image 107
It is possible to define background (hover) colours, borders, and box shadows for the Poster Items. A good setting for a box shadow would be:

8px 14px 38px rgba(39, 44, 49, .06), 1px 3px 8px rgba(39, 44, 49, .03)

Stacks Image 111
Back to List