Modify default rendering template

Previous tutorials were explaining how to deal with the additional rendering templates storage locations and the way they are loaded by the plugin. Now is the time to see the practical side: how to actually modify one of the default rendering templates and create your own.

Add templates storage folder

As it was suggested in the previous tutorial, create folder called ‘gdpc‘ in the WordPress ‘wp-content‘ folder. Open plugin Settings panel and on the first (Basic) tab find Render Templates Locations. In the locations list add simply this: gdpc. Save settings.

Adding rendering templates locations
Adding rendering templates locations

Creating copy of template for editing

You need to decide what template you want to modify. Lets select this template file: single.full-twocolumns.inc. Copy this file from plugin ‘tpl‘ folder into the new ‘wp-content/gdpc‘ folder. If you leave template to have same name, it will override the default template. But for now, we will create new template. Rename this new file to this: single.full-twocolumns-mod.inc.

When naming templates, always not that first part of the name (in this case single) must remain intact, it points to the type of the template.

Modify the template information

Open this new file for editing. First 5 lines starting with @@@ characters are used to by the plugin, and you need to changes some of them. Lines Class, Scope and Block are not to be changed. But, you need to change Name line, and use it to give the template unique name. Original template had this name: Full Two Columns. You change this to Full Two Columns Modded. If you want, add the description also, but this is not required.

Change the template content and layout

Everything bellow first @@@ lines is actual content of the template, and now we need to modify it. All special tags used by the plugin are in this format %TAGNAME:OPERATION|PARAMETERS%. Usually, on top of the template layout part is the set of DIRECTIVE tags. Leave this on always. Rest of the template is pretty much combination of PHP and HTML with addition of the plugin specific tags.

Lets say we want to create the template that only displays the list of of properties, and nothing else for the product. This would be useful if you embed product data into posts with shortcodes. So, remove everything from the template except for the DIV with gdpc-properties class.

[php]@@@:NAME:Full Two Columns Modded:@@@
@@@:CLASS:single:@@@
@@@:SCOPE:public:@@@
@@@:DESCRIPTION: :@@@
@@@:BLOCK:main:@@@
%DIRECTIVE:PROPERTIES|TWO_COLUMNS%
<div class="gdpc-single-default">
<div class="gdpc-properties">
<h3 class="gdpc-product-page-title"><?php _e("Product Specification", "gd-products-center"); ?></h3>
<div class="gdpc-properties-left">
%PROPERTIES:LEFT|TABLE%
</div>
<div class="gdpc-properties-right">
%PROPERTIES:RIGHT|TABLE%
</div>
<div class="gdpc-clear"></div>
</div>
</div>[/php]

So, this is the new template that will display only properties in two columns. If you need more changes, add them, any new classes or anything else.

Scan for new template

Now is the time to let plugin now that new template is available. To do this, open Tools panel, and on the Maintenance tab get to Cleanup block. Select T3 Templates, and click Execute button.

Scan for new rendering templates
Scan for new rendering templates

There is a quicker way to this same operation by using plugin menu item in the WordPress toolbar. Under Tools you will find Scan for new templates option. That’s all you need to do, and the template will be available for use, and you will see it listed on the Templates panel. Also, all templates selection drop down will list new template. If you need to use it in the shortcode or function, template name for such use is also listed on the Templates panel, but simply this is the name of the file without extension and class part. In this case this will be ‘full-twocolumns-mod‘.

Whenever you add new templates, you need to run scan operation to make sure than templates are loaded.

Comments

Leave a Reply