Display Settings: Changing How Your Store and Product Pages Look

The Display Settings dialog puts every control for how a page looks in one place. Open it from the page itself, change a setting, click Save, and the page reloads with the change. No more hunting through the Dashboard to find the one checkbox you need.

Where to find it

While you are signed in to your site, a small toolbar shows at the bottom of every page. Click the Settings gear. The dialog that opens depends on the page you are standing on:

  • A product page opens Product Display Settings.
  • Your store page opens Store Display Settings.
  • A category page opens Category Display Settings. See Using a Different Display for One Category.
  • A gallery page opens Gallery Display Settings.
  • Your blog opens Blog Display Settings.

These dialogs read and write the same settings as the Dashboard pages under Dashboard → Design → Store Design and Dashboard → Settings → Store. Change a setting in one place and it changes everywhere.

Product Display Settings

These control the page a shopper sees after clicking one product.

Layout

  • Layout Style — the overall design of your product pages. Click Browse Styles to see a preview of each one. The designs are described in Product Page Layouts.
  • Title Size — scales the product title. Choose Default, Large, Larger, Small, Smaller or Smallest.
  • Density — how tightly the page packs together. Choose Default, Compact, Cozy or Spacious.
  • Quantity Field — lets customers add more than one of a product to their cart at once.

Images

Crop settings for the Product Image and the Product Thumbnail. Each has a Crop to Aspect Ratio choice. After changing image settings, hard refresh your browser or clear its cache to see the change.

Price

  • Price Size — scales the price, with the same choices as Title Size.
  • Display Price Range for Varying Prices — shows a range such as $20 to $35 when prices differ between variations.
  • Append Text to Price — text shown after the price, for example inc GST.
  • Price Text Color — the color of prices. This one is site-wide. It colors prices on product pages, store listings and carts.

Variations & Stock

  • Stock availability display — how the available quantity shows when a product tracks stock. Choose Show exact count, Do not show, Show "In Stock" (no number) or Show count only when low. "Out of Stock" always shows when stock runs out.
  • Low-stock threshold — with Show count only when low, the count appears once stock is at or below this number. The default is 5.
  • Show Total Quantity Available
  • Show Quantity in Variation Select List — shows the quantity next to each choice in the variation list.
  • Hide out-of-stock variations — removes sold-out choices from the variation list.
  • Hide prices in the variation select list — hides the per-variation price next to each choice.

For more on variations, see Product Variations and Options and How to set product inventory on IndieMade.

Sold Out & Availability

  • When a product sells out — Show as "Out of Stock", Do not show, or Move to the sold page.
  • Do not show prices on sold items
  • Enable back in stock notifications — lets customers ask for an email when a sold-out product returns. The email text is edited in Store Settings.
  • Vacation Mode — turns off purchases while you are away.

Shipping Display

  • Show "Free Shipping" — only applies to shipping profiles with a single destination or Flat Rate profiles.
  • Show Shipping Prices — shows the shipping price next to the product price, with the same limits.

Extras

  • Show Similar Picks — shows products from matching categories under the product. You can set the Similar Picks Title and the Number of Similar Items to Display. The default is 4.
  • Enable Favorite Products — lets customers mark products as favorites. See Product Favorites.
  • Show reviews on product pages — needs reviews turned on first. See Product Reviews.
  • Show social sharing icons on product pages

Colors

Product pages follow your Design colors. Change a color here to set it for product pages only: Product Section Background, Title Text Color, Main Text Color, Link Text Color, Border Color, Main Button Color and Text on Main Buttons. Main Page Background is site-wide. See Theme Fonts and Colors.

Store Display Settings

These control your store listing page, where shoppers browse all your products.

Layout

  • Layout Style — how products are arranged on the store page. Click Browse Styles to preview all 14 styles. See Product Page Layouts.
  • Title Size, Price Size and Density — the same choices as on the product page, applied to the listing.
  • Show Price — show prices on store and category listings. Turn this off if your prices vary by option. The price still shows on each product's own page.
  • Show Star Ratings — shows each product's average review rating under its title. Products with no reviews show nothing.
  • Show Add to Cart — adds a buy button to each product on listing pages.
  • Add first Variation or Option to cart — adds the first choice straight to the cart. When off, products with choices open the product page. Personalized products always open the product page.
  • Product Descriptions — None or Shortened summary. With a summary, set Truncate after to the number of characters to show, and Description Size to scale the text.

Browsing & Paging

  • Infinite Scroll — customers keep scrolling to see more products instead of clicking numbered pages.
  • Products per page — how many products show per page, or how many load at once with Infinite Scroll.

Category Menu

A category menu on your store and category pages so customers can filter by category.

  • Show Category Menu
  • Position — Above Header, Below Header or Left Sidebar.
  • Design Style — Classic has bold text with borders and subcategories that fly out to the side. Basic is simple text with subcategories that drop down below. Dropdown is a single Categories button that expands a list.
  • Menu Background, Menu Text, Menu Highlight and Menu Dividers — colors for the menu.

See Showing a Category Menu in Your Store.

Images

Crop settings for the product thumbnails on the store page. Hard refresh your browser after a change.

Tips

  • Save often. Each change reloads the page, so you see the result right away.
  • Press Cancel or click outside the dialog to close it without saving.
  • Sizes and density are relative to the layout. Default is always the layout as the designer intended.

Questions? Email support@indiemade.com.