1. Commerce
  2. Store Front
  3. Themes & Extensions
  4. Commerce Themes
  5. Configuring Themes
  6. Configuring Global Theme Settings
  7. Configuring the Home Page

Configuring the Home Page

Note:

Themes require SuiteCommerce or the Aconcagua release of SuiteCommerce Advanced or later.

Important:

Commerce themes are only available if provisioned, installed, and activated for a selected domain in your account. For details, see Installing Theme and Extension SuiteApps.

Important:

To configure a theme, you must also have the companion theme extension activated. For details, see Available Commerce Themes and Supported Features and Activating Themes and Extensions.

You can configure properties to customize a Commerce theme’s home page. For more information about how to configure the home page, explore these topics:

Configuring General Settings

This section explains how to configure the general settings on a Commerce theme’s home page. Most of these settings apply to all six themes, unless otherwise noted.

To configure general settings:

  1. Go to Commerce > Websites > Configuration.

  2. Select the website and domain where the theme is activated and click Configure.

  3. Go to the theme name subtab.

  4. Go to the Home subtab.

  5. Use the table below to fill out the fields.

    Field

    Description

    Applies To

    Autoplay Carousel

    Check this box to make the carousel automatically scroll to the next image. For more information, see Configuring Carousel Images.

    All themes

    Carousel Speed (milliseconds)

    Enter the duration in millisecond before the carousel scrolls to the next image. The default is 5000 milliseconds. For more information, see Configuring Carousel Images.

    All themes

    Announcement

    Enter the text to show in the announcement area on the Home page.

    Horizon Theme

    Free Text Title

    Enter the title to display in the carousel.

    • Bridge Theme

    • Summit Theme

    • Threads Theme

    Free Text Subtitle

    Enter the subtitle to display in the carousel.

    Threads Theme

    Free Text

    Enter the text to display in the carousel.

    • Bridge Theme

    • Summit Theme

    • Threads Theme

    Button Text

    Enter the button text that appears on the image in the carousel. If this field is left blank, the button doesn't display.

    Threads Theme

    HREF

    Enter the URL that you want users to go to when they click the button.

    Threads Theme

  6. When you're finished making changes, click Save.

Configuring Carousel Images

Carousel images are a collection of pictures that appear on a Commerce theme’s home page. You can upload several images, adjust how they display, and set overlay text. Each image can link to an external or internal URL, and you can add a call-to-action button. You can also make the images slide automatically and pick how long each one shows. For details, see Configuring General Settings. Most of these settings apply to all six themes, unless otherwise noted.

To configure carousel images:

  1. Go to Commerce > Websites > Configuration.

  2. Select the website and domain where the theme is activated and click Configure.

  3. Go to the theme name subtab.

  4. Go to the Home subtab.

  5. In the Enhanced Carousel field group, click a line in the list.

  6. Use the table below to fill out the fields.

    Field

    Description

    Applies To

    Title

    Enter the title to overlay on the carousel image.

    All themes

    Text

    Enter the text to overlay on the carousel image.

    All themes

    Image URL

    Select the image to display in the carousel when viewed on a desktop. The image should be 1600 pixels wide, and all images should have the same height to avoid display issues. All images should be uploaded to the NetSuite File Cabinet, and stored in an image folder you create under Website Hosting Files > Live Hosting Files. For details, see File Cabinet Overview.

    If you use Cascading Style Sheets (CSS) to add images, they're overridden by the images in the File Cabinet.

    All themes

    Image URL Mobile

    Specify the image to display in the carousel when viewed on mobile devices. All images should be uploaded to the NetSuite File Cabinet, and stored in an image folder you create under Website Hosting Files > Live Hosting Files. For details, see File Cabinet Overview. If you use Cascading Style Sheets (CSS) to insert images, they are overridden by the images stored in the File Cabinet.

    • Bridge Theme

    • Manor Theme

    • Posh Theme

    • Summit Theme

    • Threads Theme

    Link Text

    Enter the link text.

    All themes

    Link Location

    Enter the URL of the internal page that you want users to go to when they click the link.

    All themes

    Class Name

    Select how you want the carousel aligned on the home page: left, center, or right.

    • Manor Theme

    • Posh Theme

    • Threads Theme

    Image as Background

    When this field is enabled, you can set which side of the image to crop on smaller devices. This field is enabled by default.

    • Bridge Theme

    • Manor Theme

    • Posh Theme

    • Summit Theme

    • Threads Theme

    Background Crop Side

    If Image as Background is enabled, use this field to choose which side of the image to crop: left, center, or right.

    • Bridge Theme

    • Manor Theme

    • Posh Theme

    • Summit Theme

    • Threads Theme

    Caption Position

    Select where to position the caption on the carousel image. Choose from the following:

    • Left — Select this option to left-align the caption on the carousel image.

    • Right — Select this option to right-align the caption on the carousel image.

    • Centered — Select this option to center the caption on the carousel image.

    • Left-box — Select this option to apply a background to the caption that is left aligned. This applies only to the Summit Theme.

    • Right-box — Select this option to apply a background to the caption that is right aligned. This applies only to the Summit Theme.

    • Centered-box — Select this option to apply a background to the caption that is centered. This applies only to the Summit Theme.

    • Bridge Theme

    • Summit Theme

    Caption Text Align

    Select how you want the caption text aligned: left, right, or centered.

    • Bridge Theme

    • Manor Theme

    • Posh Theme

    • Summit Theme

    • Threads Theme

    Text Color

    Enter a HEX or HTML color value for the text. This color overrides the one set on the CMS page in Site Management Tools. For more information about CMS page types, see Pages.

    • Bridge Theme

    • Manor Theme

    • Posh Theme

    • Summit Theme

    • Threads Theme

  7. Click Add.

  8. For each image you want to add to the carousel, repeat steps 5 to 7.

  9. When you're finished making changes, click Save.

Configuring Infoblocks

Infoblocks are a collection of image banners on the theme’s home page that link to internal or external pages. Most of these settings apply to all six themes, unless otherwise noted.

To configure infoblocks:

  1. Go to Commerce > Websites > Configuration.

  2. Select the website and domain where the theme is activated and click Configure.

  3. Go to the theme name subtab.

  4. Go to the Home subtab.

  5. In the Infoblocks field group, click a line in the list.

  6. Use the following table to fill out the fields.

    Field

    Description

    Applies To

    Title

    Enter the title to overlay on the infoblock.

    All themes

    Link Location

    Enter the URL of the internal or external page that you want users to go to when they click the infoblock.

    All themes

    Text

    Enter the text to overlay on the infoblock.

    • Bridge Theme

    • Horizon Theme

    • Summit Theme

    • Threads Theme

    Background Color

    Set the background color. The background color only appears if there is no background image. You can use HEX and HTML color values.

    • Bridge Theme

    • Horizon Theme

    • Summit Theme

    • Threads Theme

    Background Image URL

    Set the background image to display. The image should be 1600 pixels wide, and all images should have the same height to avoid display issues. All images should be uploaded to the NetSuite File Cabinet, and stored in an image folder you create under Website Hosting Files > Live Hosting Files. For details, see File Cabinet Overview.

    If you use Cascading Style Sheets (CSS) to add images, they're overridden by the images in the File Cabinet.

    • Bridge Theme

    • Summit Theme

    • Threads Theme

    Image URL

    Set the image. The image should be 1600 pixels wide, and all images should have the same height to avoid display issues. All images should be uploaded to the NetSuite File Cabinet, and stored in an image folder you create under Website Hosting Files > Live Hosting Files. For details, see File Cabinet Overview.

    If you use Cascading Style Sheets (CSS) to add images, they're overridden by the images in the File Cabinet.

    • Horizon Theme

    • Manor Theme

    • Posh Theme

    Link Text

    Enter the link text.

    Horizon Theme

    Span Columns

    Check this box to span the infoblock across all columns.

    Posh Theme

  7. Click Add.

  8. Repeat steps 5 to 7 for each infoblock you want to add.

  9. When you're finished making changes, click Save.

Related Topics

General Notices