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. For maximum flexibility and usage with the complete Toolset package, please visit the page about creating templates for displaying post types.
1. Creating a Content Template
Go to Toolset -> Content Templates and create a new Content Template.
|1. Create a new Content Template||2. Choose for what content types it’s for||3. Give it a name|
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.
|1. Click to open the CSS or JS editors||2. Add the styling or JS that you need||3. Update the 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.