Product Detail Template Overview

Looking for more ways to customize your Four51 Buyer sites? Product Detail Templates are a great tool to use for customizing the Product Detail Pages on both 1.0 and 2.0 sites at the Company, Category and Product levels.  Four51 currently offers 12 different designs to choose from that are all fully responsive on 2.0 sites. In addition, each template can be further customized using the code editor on the Product Detail Template Page.

Creating a New Product Detail Template
Before assigning a PDT, you will have to create one. Start by navigating to the Buyer company you wish to assign a PDT to. Then click on "Product Catalog" in the left navigation. Next, click on "Product Detail Templates" in the left navigation which will bring you to the "Customize Product Detail Page" editor. Here, you can create a new PDT based on one of the available templates in the Product Detail Template Catalog.



To create a new PDT to assign to a Company, Category or Product, start by selecting "*New" from the Name dropdown at the top of the page. Then name the PDT something that is easily remembered so you know which one it is when you assign it. Navigate through the Product Detail Template Catalog to find the PDT you wish to implement and click on the View's thumbnail image. This thumbnail image displays an example of how the Product Detail Page will appear after it is applied. Once one has been selected, click "Save" above the Product Detail Template Catalog window. This will save the selected PDT to the Name entered above. Further 2.0 Product Detail Page customizations can be made by editing the code in the OrderCloud 2.0 code editor window on this page.

Assigning a Product Detail Template: Company
After one or more PDTs have been created and saved, they can be assigned at the Company, Category or Product level. To assign it to the Company level, go to the Buyer company and click "Edit Company Information." Then you will see a dropdown next to "Product Detail Template" with the names of the saved PDTs. Select the appropriate one and then click Save.




Assigning a Product Detail Template: Category
To assign a PDT at the Category level, navigate to "Product Catalog" in the left navigation and select the Category you wish to assign the PDT to. Scroll to the bottom where the "Product Detail Template" dropdown selection is, then select the appropriate PDT and click Save.




Assigning a Product Detail Template: Product
To assign a PDT at the Product level, navigate to the product's Property page. About halfway down you will see the "Product Detail Template dropdown selection. Select the appropriate PDT and click Save. This will assign the PDT to the specific product.



When logging into the Buyer site to view the implemented PDT design on a Product Detail Page, please be sure to refresh the Buyer site to update the code.

Reference Material: None

Related Articles:

Labels: Product Detail Template, Product Detail Page, customization