This is an advanced level modification that can be done to the site. You will want to have a basic understanding of HTML, Custom Fields, and Generic Variables before attempting.
Combining Custom Fields with Generic Variable functionalities allows you to customize what displays on a product by product basis.
For this article, I'm going to show how an image can be display on certain products. This could be anything from a banner advertising a sale, extra information on a product, or even a download file of some type.
The first thing we'll want to do, is create a product level custom field. In your admin console, you'll want to go to Tools > Power Features > Custom Field Setup. Here, you will want to create a new Custom Field.
When creating the custom field, I advise giving this a proper name and label, for easy reference later on. For the purposes of this tutorial, these are the settings we'll be choosing:
- Field Type: Products
- Input Type: Single Checkbox
- Value Type: Boolean
The reason why we are setting them like this, is for ease of use. This will create a custom field at the bottom of your "General" tab on a product, that is a checkbox. If its checked, the value for this custom field will be set to True, whereas if not checked the value will be False.
So now that we have the custom field setup, we need to dig into the HTML too, so that we can impose our will. You will want to open the "Product Details" HTML editor, for the next step.
So now that we have the HTML pulled up, we need to determine where we would like the picture to appear. I'm going to make a banner appear above the bread crumb trail on my product details page.
First, we will want to set a generic variable to the value of the custom field.
The above line is placed in the HTML. Basically, this sets the generic variable "BannerImage" to True if the custom field is checked, otherwise it is false.
Now, we need to write the next line that is going to check this generic variable.
<!-- You can put extra HTML in here. Use this if you want something else to display if this custom field ends up being False. Or leave it blank if you don't want to display anything. The ##ELSE## merge code is optional. -->
Since this is written out now, we just need to put it in the appropriate spot in the HTML.
After this is set in the HTML, you just need to check the custom field box on the product itself. This shows the image if the product custom field is enabled. It does not display anything if left unchecked.
This is just an example of a something simple that can be done when these features are combined. With some imagination, you can do some really creative tasks combining these features.