Home Screen

Home-screen is an eye-catching part for any on-going customer. The more beautifully you designed your store; more it will attract to your customers & increases the awareness of your brand products.

Through CommerceUp-Platform; you can design your store as want you can. You don't need to take anyone help as all the steps are very easy from adding any widget to add any action. Don't take it so complicated. We will explain you step by step how you can design your store.

1. Click on Home Page->Desktop View Button

2. Add New Widget Section

  • Click on Add New Widget button as shown in the below figure.

  • Choose Widget

There are no of widgets we have for your online store. Widgets are categorized into different parts such as: Banner Widgets, Category Widgets, Brands Widgets, Promotions Widget, Product Widget, Contact-Us Widget and so on. You can choose the widget as per the requirement of your store.

What else you can do here:

a) You can search any widget through search-bar.

b) You can check the preview of widget both for desktop & mobile view

c) You can add the widget by clicking on Add to Page button.

  • Add Widget

For my own store: Here I am chosing a widget: Lonar Lake. To add this widget; click on Add To Page button.

After clicking on Add to Page button- It will show like this on Home Screen.

3.Upload Images in Widget

  • Click on Content button to add images, set header, and to add action on clicking on particular product.

  • You can add the images from your local computer or you can also search the images through Web.

  • To add an image; click on the Upload Image button .Here I am going to add images from my local computer.

  • To add one more image click on the + button as shown in the below figure.

  • You can add the name, description, and name for the action button by selecting an image. Here I am going to add the information for my first added image. In this way, you can add the information for all images by selecting them one by one.

4. Add Actions on Image:

Basically what you want to show when you customer will click on particular image of the widget. This is very important step; as you have to decide. There are different types of actions which you can add & make all widgets images clickable.

Different Types of Actions & their Usage:

  1. None- Means you don't want to make an image clickable. Don't want to show anything.

  2. Open All Products- If you want to show all the products of your store on a single clickable action. Then you can choose this.

  3. Open Category Products- To show the products of any specific category; you have to go with Open Category Products action.

  4. Open Collection Products- Yes, you can open the products for the specific collection.

  5. Open Product Detail- You can add the action in which you can directly open the details of any product

  6. Open Brand Products- If you want to open the products of any brand then chose the Open Brand Products action.

  7. Open Blog- You can open any blog through this action.

  8. Open Static Pages- Through this action you can open any static page.

  9. Open Weblink- You can open any weblink through this action like www.google.com.

  10. Open Brand List- It will show the list of the brand where you can see all the brands of your products.

  11. Open Catalog Page- You can make any catalog page & design it. On this action you can open your own designed catalog page. In simple words page inside page.

  12. Open Blog Category- You can open the blog of any specific category through this link.

  13. Search Filters- You can directly open the filters through this link.

Here I am going to an action for my widgets images.

For first image: I am going to add an action Open Category Products. Please be clear with this point. The category which you are going to add it must be added in the products itself.

I am going to open the Products of Category Beauty. Once a user clicks on the image then products will open which are having the Category Beauty.

For second image: I am going to add an action Open Collection Products.

To Open Collection Products please be ensure that you have already made a Collection for specific Products which you want to show. We have already created a document for: How to create a collection & you can go through it & create a collection.

After adding the actions please click on save button. It will save your changes.

  • You can look at the preview of store before launching it.

5. Add Header on Widget

Yes, you can give a header title & its sub-title for your added widget. Click on the Content section for which you want to add a heading or header.

  • Chose any of the header from the SetUp Section Header & apply on your widget.

  • I am going to chose the first one where my heading title & sub-title will show on left side. Click on save button to save the changes.

  • After saving, the header title & sub-title you can check it on preview of your store.

6. Widget Design Section

With the help of design section you can more beautifully design your store & do no of changes. You can do the changes for: Change Widget Design, Cards used in Widget, and Headers Used in Widget.

Look what you can do:

  • You can set the margin & padding for your images.

  • You can set the border radius, border color, border width of the card.

  • You can set the title-font size, border color, background color, text color for the action buttons.

  • You can set the background color, title font, weight-size for the header.

Last updated