Skip to main content

Title

Article Detail Template

Here, you can display an individual piece of content about a specific topic. The page can include images, video, text, and callouts to related content and products.

Article detail pages can be more in-depth than other content pages and should be written for reading while still maintaining web content best practices. You can chunk content into shorter subsections with easy-to-scan sub-headers, have concise copy with bulleted lists, and include links to other content when possible.

See a demo of this template - Article 1

See a demo of this template - Article 2

See a demo of this template - Article 3

See a demo of this template - Article 4

 

When To Use This Page

This page will be beneficial when you run into the following scenarios.

  • If most of your content doesn’t live within Product Pages or a Landing Page.
  • You’d like to present rich, deep content about a topic, expertise area or routine.
  • If you’re using the Article Listing Page.
  • If you have lower-level site content beyond a Landing Page.

 

Default Template Components

The following components are default, fixed elements within this page template:

Breadcrumb

A series of clickable links that display the navigational path to the current page

Article Body

The area is used for the actual content of your article.

Social Share (Where Applicable)

The ability for users to share content with their friends and followers on supported social networks

 

Additional Optional Template Components

Sub-Navigation (Right Rail)

Add a section of navigation items related to the page in the right rail area.

Stacked Touts

Up to four 25% width stacked touts can be placed below the page’s sub navigation in the right rail.

Embedded Images

100% width images can be placed within article content.

Embedded Videos

A video player can be embedded within article content.

Embedded Polls

A poll that can be placed anywhere a tout can be placed.

Related Content Component

Area reserved for related content teasers displayed in a carousel-type format.

Approved Tout Combinations

Use any supported combination of touts that adds up to 100% of the content width

Page Hero Image

The main image on the page, and often the largest.

 

Design Details

These helpful diagrams highlight key components across the three Canvas viewports. Components are either required or optional; some can be adjusted, while others must remain as-is.

 

 

 

Template PSDs

Access the PSD files for your Article Detail Template.

Template PDFs

View the PDF files for your Article Detail Template.

Responsive Design

CANVAS sites fluidly respond across three key breakpoints.

See examples of page layouts, features and functionality in CANVAS.

Our demo provides a glimpse of the flexibility of CANVAS and its templates.