Let’s take a look at the file category.tpl. This is the main page of a category template or a product catalog.
Bread-crumbs and error messages are connected at the very top. They are also located in separate templates. Bread-crumbs are connected in the main column of the website but quite frequently, depending on the design, it is required to make it over all site columns. To do this, it is necessary to put them in the template header.tpl and specify in which cases to output them.
|
1 2 3 4 5 |
{if $page_name !== 'index'} {include file="$tpl_dir./breadcrumb.tpl"} {/if} |
Next comes the page title. The page title does not have any class for a specific style settings. It is applied to all pages. To make it more convenient, I would recommend to check all the templates and assign to the page title the class <h1 class= “page-title”>.
Next we see the template, which outputs the number of products in this category {include file= ” $tpl_dir. /category-count.tpl”} but there is nothing special here.
Magento 2 Development
Take your online store to the next level with BelVG Magento 2 Development
Visit the pageIf the module Images maps is enabled we will see the category image with the product map marked on it. Also if the category contains child sub-categories, then they can be found in the list of subcategories.
Then comes the unit which interacts with the list of products
- pagination.tpl – is responsible for navigating to pages
- product-sort.tpl – is responsible for outputting the fields for sorting
- product-compare.tpl – displays the product comparison button
- nbr-product-page.tpl – the form with a choice of goods on the page
Product-list.tpl – the main template which contains the list of displayed products. This template consists of three units.
Left-hand unit (left_blосk) – consists only of a product comparison checkbox.
The central unit (сenter_blосk) – is responsible for the information about the product, product image and its description.
The right-hand unit (right_blосk) – is responsible for the interaction with the product: adding it to the cart or providing the link to the full-view, as well as its price and current availability.
Here the template of the list of products ends.
Next, we return to the category template and again we see the interaction of the block with the list of products
- pagination.tpl – is responsible for navigating to pages
- product-sort.tpl – is responsible for outputting the fields for sorting
- product-compare.tpl – displays the product comparison button
- nbr-product-page.tpl – the form with a choice of goods on the page
If the current category does not exist then the following message appears at the very bottom of the template: This category is currently unavailable.
Partner With Us
Looking for a partner to grow your business? We are the right company to bring your webstore to success.
Talk to Igor
