1. Commerce
  2. Store Front
  3. Marketing
  4. Storefront Merchandising Tools
  5. Featured Product

Featured Product

The Featured Product extension lets you highlight a recommended product on your website. You can customize the appearance and behavior of the featured product and add a text ribbon. You can display the product image or upload a new image to be shown.

Clicking on an item takes shoppers to the product detail page for more information and purchasing options.

Important:

Commerce extensions are only available if provisioned, installed, and activated for a selected domain in your account. For more information, see Commerce Extensions.

Note:

Extensions require SuiteCommerce or the Aconcagua release of SCA or later.

The information for the featured product is taken from the Item record. You can choose whether to show the availability and pricing information. For matrix items with different prices, a price range is displayed. In addition, you can use the product image taken directly from the Item record or upload a new image.

You can add a featured product to multiple areas on your website using Site Management Tools. For more information about Site Management Tools, see Site Management Tools Overview.

This topic explains how to:

Add a Featured Product

To add a featured product to your web store, add the Featured Product content type to a page of your site using SMT.

To add a featured product:

  1. In your website, go to the page where you want to add a featured product.

  2. Log in to SMT.

    For more information about logging in to SMT, see Users and Roles in SMT.

  3. In Edit mode, click Add on the Site Management toolbar.

  4. Drag the Featured Product content type to the page.

    Note:

    If you do not see this content type, ensure that the extension has been installed and is active. Click Settings on the Site Management toolbar to access the Content Manager. Drag the content type from the Inactive Content Types list to the Active Content Type list.

    You can drag a Featured Product content type to multiple areas on the page.

    For more information about the scopes of different SMT areas, see Area and Scope.

  5. Configure the settings to best fit your needs.

    See Configure a Featured Product.

Configure a Featured Product

Configure properties to customize your featured product. You can decide which product information to display, select the image, and choose the ribbon and button texts.

To configure a featured product:

  1. While logged in to SMT on your website, go to the page that contains the featured product.

  2. In the Featured Product box, click Edit.

    This displays the Featured Product Settings in the side panel.

  3. Set the listed fields, using the table below as a reference.

  4. Click Save.

  5. Field

    Description

    Name

    Sets the name for the featured product that appears in the Review Changes list in SMT.

    Visibility

    Determines the visibility option that determines when you want to make the featured product visible.

    For more information about visibility options, see Visibility Dates.

    Product

    Sets the product that you want to feature.

    With the Featured Product extension, you can only feature one item at a time. If you want to feature more than one item, create a special commerce category for the items you want to display and use the Featured Category extension. See Featured Category.

    Hide Product Price

    If checked, hides the price of the featured product.

    If you have set up your website to restrict pricing to registered users and do not check this box, the item’s price is only displayed when the user is logged in.

    Hide Product Availability

    If checked, hides the stock availability of the featured product.

    For an out-of-stock item:

    • If you have set up your web store to show products when out of stock and do not check this box, the item is displayed as out of stock.

    • If you have set up your web store to hide products when out of stock and check this box, the featured product is not displayed.

    Change Image

    Changes the image displayed for the featured product. If no image is selected, the extension uses the image from the Item record.

    Note:

    If there are multiple images associated with the Item record, the first image is used. If there are no images in the Item record or if you have entered the ID of a matrix child item, your theme’s image placeholder is used.

    To upload a new image using the Image Manager, click No File Chosen and select an image. To change the existing image, click Remove Image, then click No File Chosen to select another image.

    Important:

    This field sets the image for the Featured Product extension only. It does not change the image associated with the Item record.

    Ribbon Text

    Sets the ribbon text displayed on the featured product image.

    For example, you can use this field to add the text “Special Offer.” The ribbon style is taken from your theme.

    If you leave this field blank, the ribbon does not appear.

    Button Text

    Sets the text displayed on the button.

    This button redirects shoppers to the product page.

    Button Style

    Determines the type of button displayed.

    The button style is taken from your theme.

    Image Resize ID

    Links to the image resizing option you want the image to use.

    To use this option, you must enter an enabled Image Size ID (Images tab > Image Resizing section) of the Web Site Setup record (Commerce > Websites > Web Site List).

    For more information about Image Resizing, see Image Resizing and Compression.

    Tags

    Sets keywords to help filter your content in the Review Changes list.

    For more information about content tags, see Content Tags and Filter Tools.

Remove a Featured Product

Depending on whether you have published the content to your website, use SMT to delete the featured product content type from your site in one of two ways:

  • Discard the featured product if you have not published the content.

  • Remove the featured product if you have already published the content.

To discard a featured product (Unpublished Content):

  1. While logged in to SMT on your website, select the Review & Publish Changes list from the Site Management toolbar.

  2. Select the Featured Product content in the list.

  3. Click Discard.

  4. Click OK.

To remove a featured product (Published Content):

  1. While logged in to SMT on your website, go to the page that contains the featured product content you want to remove.

  2. In Edit mode, click the Featured Product box.

    This highlights the featured product content and displays the content controls.

  3. Click Remove.

  4. Click OK.

Use a Custom Field Set

To optimize your website performance, you can create a custom field set using only the fields required by the extension and choose this field set to be used with Featured Product.

You can create a custom field set by running a script. Then you can select this field set on the SuiteCommerce Configuration record.

Important:

If you do not select a custom field set to be used, the extension defaults to using the details field set.

The minimum fields required by the Featured Product extension are:

Field ID

Field Name

itemimages_detail

Item Images (Detail)

itemoptions_detail

Item Options (Detail)

internalid

Internal ID

matrixchilditems_detail

Matrix Child Items (Detail)

onlinecustomerprice_detail

Price for Current Customer (Detail)

quantityavailable

Available

displayname

Display Name

itemid

Name

storedetaileddescription

Detailed Description

storedisplayname2

Store Display Name 2

isinstock

In Stock

To use a custom field set:

  1. Create a custom field set

  2. Select the custom field set

Create a custom field set

Using the code sample included in this section, create a custom field set using the required fields.

To create a custom field set:

  1. Copy the contents of the Field Set Script below to a text editor.

  2. Edit the siteID variable with the site ID you want to use.

    The site ID is displayed in the URL when you navigate to the Web Site Setup page for the desired site.

    Note:

    The default value of 9999 fails, since no site is ever assigned an ID of 9999.

  3. Optional: Edit the fieldsetId and fieldsetName variables with the field set ID and field set name you want to use.

  4. Execute the script in the SuiteScript debugger:

    1. Go to Customization > Scripting > Script Debugger.

    2. Enter the SuiteScript Debugger domain (by clicking the link as indicated) and then re-enter your login credentials if prompted.

    3. From the API Version dropdown, select 1.0.

      Important: This script can only be run against SuiteScript Version 1.0.

    4. Copy and paste your modified script code into the debugger.

    5. Click Debug Script and then hit the Continue button.

    After the script has executed, field sets are properly populated and can be verified in the Field Sets tab of the Web Site Setup record.

Field Set Script

              var siteID = 99999 // change to the site ID you want to use
,   fieldsetName = 'Featured Product Extension Field Set' // change to the field set name you want to use
,   fieldsetId = 'featuredproduct_fieldset' // change to the field set ID you want to use
,   siteRecord = nlapiLoadRecord('website', siteID);
 
siteRecord.selectNewLineItem('fieldset');
siteRecord.setCurrentLineItemValue('fieldset', 'fieldsetname', fieldsetName);
siteRecord.setCurrentLineItemValue('fieldset', 'fieldsetid', fieldsetId);
siteRecord.setCurrentLineItemValue('fieldset', 'fieldsetrecordtype', 'ITEM');
var fields = 'itemimages_detail,itemoptions_detail,internalid,matrixchilditems_detail,onlinecustomerprice_detail,quantityavailable,displayname,itemid,storedetaileddescription,storedisplayname2,isinstock';
 
siteRecord.setCurrentLineItemValue('fieldset', 'fieldsetfields', fields);
siteRecord.commitLineItem('fieldset');
 
recId = nlapiSubmitRecord(siteRecord);

Select the custom field set

After creating the custom field set, you can select this field set to be used with the Featured Product extension.

To select the field set:

  1. After creating the custom field set, go to Commerce > Websites > Configuration.

  2. Select the website and domain where the Featured Product extension is activated and click Configure.

  3. Go to the Extensions tab, Featured Product subtab.

  4. In the Field Set ID field, select the custom field set you created in the previous step.

    If no field set is selected, the extension will continue using the details field set.

  5. Click Save.

Related Topics

General Notices