Content Templates let you design custom templates for WordPress content, using only HTML and no PHP.
When you add custom content types to a site, you should design how ‘single’ items display. Most themes will display your custom content without any custom fields. Content Templates let you create your own templates, including any field that belongs to the content, using simple HTML and without writing PHP.
Please note that this page explains the usage of Content Templates with the Views plugin only. If you are new to Toolset, we recommend that you start with the Getting Started guide. You can jump right in to the section on creating templates for custom post types.
1. Creating a Content Template
Go to the Toolset -> Content Templates page and click to create a new Content Template.
Give your Content Template a name and choose what content type it is for.
When you create the template, you can already choose for what content it will be used. You can select the content that will display with the template at this stage, or leave the new template ‘unassigned’. You can also apply it to content later.
2. Add fields to the template
To add content fields, click on Fields and Views. You will see a list of all the available fields. Click on any field to insert the shortcode into the template.
1. Click on Fields and Views | 2. Choose the field to insert | 3. The shortcode for the field is inserted to the Content Template |
3. Design the Content Template using HTML
Content Templates work like ordinary WordPress content. Use HTML tags set control the layout of the template. You can wrap shortcodes with HTML tags and you can also add classes and styles directly to all shortcodes.
You can also easily arrange post information and fields into columns, by using the Grid button.
The editor includes a convenient syntax highlighter, which lets you easily craft your HTML. It’s very similar to writing ordinary WordPress content, however you’re actually creating page templates. Read more about editing Content Templates to learn about styling with HTML/CSS, adding fields and the different editor options.
4. Inline CSS and Javascript editors for Content Templates (optional)
Content Templates let you add your own CSS and Javascript, without having to edit theme files on the server.
The CSS and Javascript that you add to the Content Template will only load when that template is being used. This allows you to separate between the design of different content types in your site.
1. Click to open the CSS or JS editors | 2. Add the styling or JS that you need | 3. Update the Content Template |
You don’t need to worry about loading that CSS and Javascript. Views adds it automatically to the output of any content that uses that Content Template.
5. Assign the Content Template to the site’s content
When you create the Content Template, you choose what content will use it. To change this initial setting, go to the Usage section.
6. See the Content Template in action
Once you’ve assigned the Content Template to the content, view it on the front-end.
Keep in mind that the Content Template designs the content part of the page. The page header, menu, sidebars and footer still come from the theme.
A word on View Templates
When designing how the View lists the contents, you can use the Loop Wizard and select the option to group all the fields as a separate Content Template. This is called a View Template.
However, View Templates can only be used for one, specific View and cannot be reused inside other Views. Additionally, while View Templates are listed on the Toolset -> Content Templates page, you cannot delete them.