Summary
Tailor the appearance of the store, and include your brand colors and logos.
eCommerce is available to all customers.
Your eCommerce site has separate color and image controls from the rest of your portal. You can make your store different from the site, or maintain your brand look and feel throughout.
See Image sizes overview: logos, course images and certificates for optimal image sizes and resolution details.
Access permissions
Only admins with full portal permissions can set up the eCommerce features. See Portal setup: create admin accounts.
Prerequisites
To access the Store settings, you need to turn on eCommerce features on your portal. See Collection: eCommerce to get started.
After you turn on eCommerce, several more headings appear in secondary navigation. To access the settings:
- From main navigation go to Settings > eCommerce > General Settings.
- Select Store from secondary navigation.
Tip: after any change, from Actions menu select View Your Store to preview the changes.
The following screenshot shows the secondary navigation for an admin, that includes Store and View Your Store.
Store colors
Customize the colors of your store.
- In Store Colors, enter an RGB or hex code for each color:
- Header Color: applies to header and footer of your store
- Link Color: links, active tabs and Add to Cart buttons use this color
- Hero Color: if you do not upload a Hero Image, the Hero Color fills the top section of the eCommerce page.
- Alternately, to select colors visually:
- Select the color sample to open the Color Picker
- Select and drag the ring in the picker to select a color
- Save to finish.
The following screenshot shows the color picker in use.
Store header and logos
Set up logos and header text to appear in the store. These logos can be different from your main portal.
- In Store Header, customize text for:
- Store Hero Heading: enter a heading - if left blank, the store uses the Store Logo
- Short Description: up to 220 characters
- Hero Button Text: optional - a Call to Action, which links to the About page main content
- Upload the store logos, which appear only on the eCommerce part of the portal:
- Store logo
- Squared logo
- Optionally: select Show Background Overlay, which adds a textured background to a plain Hero Color.
- Save to finish.
Card Layout Style
Decide on the layout of your course images and descriptions on "cards".
- Choose Card Layout Style for the product cards in your store, 1 of:
- two cards per row
- one card per row, with text details
- Save to finish.
Hero Image
A hero image provides the background in the top section of your store. Uploaded images are centered on all screen sizes. The optimal size for a LearnUpon hero image is 1400x520 pixels.
- Select Upload Hero Image to add an image.
- Optionally, toggle Show dark overlay over hero image. This option can improve contrast between your image and your text.
- Save to finish.
About page main content
This text appears in your store's About page, and is indexed by search engines like Google. Enter text which helps customers find your products. If you leave this field empty, the application hides the About page and the Hero Button.
- Select Add Main Content to open the text editor.
- Use the CK Editor to enter and format text, and select Apply.
- Save to finish.
About page sidebar content
This text appears in the sidebar of your store's About page, if you entered text in About page main content.
- Select Add Sidebar Content to open the text editor.
- Use the CK Editor to enter and format text, and select Apply.
- Save to finish.
Hero Video
When you add a video to the Hero Image space, the Short Description and Hero Button are aligned left, and the video is aligned right.
- In Hero Video, enter a YouTube or Vimeo URL.
- Save to finish.
See: