ArtiStick Guide: Page.details Template

Using the Page.details Template

Available content blocks

Blog Posts

Contact form

Custom HTML

Featured Collection

Featured Product

Gallery

Image with Text

Image with Text Overlay

Map

Page

Rich Text

Video

Creating additional page.details templates

Using the Page.details Template 

In the ArtiStick theme, there is a page.details template that can be used to create an internal page that is completely configured with content blocks in the Theme Editor (which are similar to homepage sections). All of the content blocks in the page.details template can be re-ordered in the theme editor as well, so you have lots of control over the page layout and what's included!

The page.details template is commonly used as an 'About Us' or 'Our Story' page as the content blocks give you various options to include and share details about your brand, shop and products in creative layouts.

In order to use the 'page.details' template, the theme will need to be published! The templates from which you can select are limited to the templates available in your currently published theme.

If you are unable to currently publish your theme and would still like to set up the ‘page.details’ template, we have instructions on how to access unpublished templates here.

Once your theme is published, when adding a Page in your Shopify Admin (Online Store > Pages), the page.details template is named page.details and can be selected under Template > Template Suffix:

Since all of the actual page content will be configured with content blocks in the Theme Editor, you can leave the content field in the page admin area blank!

Once you've created your page in the Admin, you can head into the Theme Editor (Customize) > Select your page from the drop-down page selector (or if you've added the page to your Navigation, you can click the link to the page there!) Your theme editor on the left will then update with the page settings.

Available content blocks

All of your page content gets configured with content blocks that are similar to homepage sections. To add a content block, in the theme editor simply click 'Add Content' and start adding blocks!

The available content blocks are:

Divider

Blog Posts

Contact Form

Custom HTML

Featured Collection

Featured Product

Gallery

Image with Text

Image with Text Overlay

Map

Page

Rich Text

Video

Blog Posts

The blog posts content block will display the most recent posts available in your/one of your Blogs. 

View our article on the Blog Posts section

Contact form

The contact form content block provides an easy way for shoppers to contact you. 

View our article on the Contact form section

Custom HTML

The custom HTML content block lets you easily add additional code, including custom widget scripts. 

View our article on the Custom HTML section

Featured Collection

The featured collection content block is a great opportunity to promote certain products from your shop! 

View our article on the Featured Collection section

Featured Product

The featured product content block is a perfect way to draw attention to one particular product from your shop.

View our article on the Featured Product section

Gallery

The gallery content block is an excellent way to integrate your lifestyle and product shots and beautifully presents your visuals

View our article on the Gallery section

Image with Text

The image with text content block can show off any big or important images you have and you can add any applicable text with a call to action button.

View our article on the Image with Text section

Image with Text Overlay

The image with text overlay content block can be used to display beautiful images with accompanying text and links.

View our article on the Image with Text Overlay section

Map

The map content block can build confidence in your brand as it makes it easy for your customers to find where your located.

View our article on the Map section

Page

The page content block can allow you to easily add content, include third-party widgets or code.

View our article on the Page section

Rich Text

The rich text content block is another great way to add content to the page including headings, text and buttons.

View our article on the Rich Text section

Video 

The video content block allows you to get creative by telling your story or showing your products being used in real life. Youtube, Vimeo and HTML5 videos are supported.

View our article on the Video section

Creating additional page.details templates

By default, any page that is using the page.details template will contain the same content. In order to have unique content on different page.details pages, you will need to duplicate the template.

Note: If you're looking to create a high number (10+) of custom pages with unique features/content-blocks on each, we advise seeking a customized solution from one of our recommended Shopify Experts, with whom you can discuss your custom page requirements and consider the use of Shopify's Metafield implementation for this level of unique customization. An excessive number of additional custom page.details templates will result in difficulties using the Customize settings editor.

In order to duplicate the page.details template, you'll need to edit the theme's code. If you are unfamiliar with making changes to code and need further assistance, we have a list of recommended Shopify Experts who can lend a hand!

Step 1: Head into Online Store > Themes > Actions > Edit Code.

Step 2: Under Templates click Add a new template.

Step 3: Make this new template of the 'page' variety, call it 'details-2' and then click 'Create template'

Important: You must start the name you enter here with the word "details" in order for all features to work. For example, entering "details-2" (which becomes "page.details-2.liquid") or "details-about-page" (which becomes "page.details-about-page.liquid") will work, but "about-page" (which becomes "page.about-page.liquid") will not. 

Edit the template code

Step 4: Remove all the code that is in the file you just created and replace it with this code: 

{% comment %}

  The contents of the page.details-2.liquid template can be found in /sections/page-details__main-2.liquid

{% endcomment %}

{% section 'page-details__main-2' %}

Step 5: Save your template!

Step 6: Under Section click Add a new section.

Step 7: Call this new section 'page-details__main-2' and click 'Create section'

Step 8: Copy all the code from the page-details__main.liquid file into the new page-details__main-2.liquid file.

Step 9: Save your section!

Need even more pages?

This process can be repeated if you need still more different page content for different pages by creating more templates and sections and following the naming conventions as the above instruction, such as:

Template: page.details-3.liquid

Section: page-details__main-3.liquid

...and so on


Leave a comment

Comments will be approved before showing up.