[Coming Soon] SHOPLINE Page Builder (New)


SHOPLINE is about to launch a brand new Page Builder, which greatly optimizes the design for advanced pages. You can design the announcement board, header & footer, and up to six kinds of widgets to create a unique online store layout.

In this article, you'll find:


⚠️ Before you begin:

  • The new page builder currently only supports the Ultra Chic theme.
  • After creating a page using the new page builder, the page can still be displayed even if you switch to other themes, but it cannot be edited and the layout may be messed up. Please take note of this before publishing the page.


1. New page builder overview

Proceed to SHOPLINE Admin > [Online Store Design] > [Pages] and click the [Advanced Page/Edit] button to open the Advanced Page setup.



1. View in web and mobile version 

When editing with the new page editor, you can easily switch between the web/desktop version and the mobile version to make your online store matches your brand style.

*Note: Be sure to click "Save" or "Publish" after editing.

A. Web version


B. Mobile version



2. Language setting

Click the language drop-down menu to edit the page in the supported languages of your store.



3. Page title

The name of the newly added page is "New Page" by default. Click the pencil icon on the right of the title to retitle.



4. Preview page

Click the Preview Page on the top right of the builder to preview the page in a new tab.



5. Save and publish

After adding an advanced page, please be sure to click Save on every edit. The page will appear in the list of Pages, with the label "Support New Page Builder".


*Note: If your advanced page has been added to the Menu Navigation, customers will be able to view this advanced page once it is published. Please be sure to confirm the edited page content before clicking the publish button.


2. Page editing

A. Announcement Bar

You can add three sets of text for the announcement bar, and choose the display method and duration. Please refer to this article for details.



B. Header

You can edit the size and position of the logo, and the alignment of the menu. Please refer to this article for details. 



C. Widgets

There are widgets for content and products. Please refer to the articles below for details.



D. Footer

You can add text, gallery, and social media icons, and adjust the position/alignment. Please refer to this article for details.



3. SEO settings

Select SEO Settings on the left menu bar, you can set the keywords and URL for the page. Please refer to this article for details. 



4. [Coming Soon] Store settings

Select Store Settings on the left menu bar, you can adjust the font, color, and other category settings. 

*Note: Be sure to click "Save" or "Publish" after editing.



A. Color

Click Color to adjust the color of the background, text, and hyperlinks on the page.



B. Font

Click Font to adjust the font of the entire online store website, yet the font size can only be applied to advanced pages.



C. Mobile

Click Mobile to select whether to collapse the menu items and hide menu categories on the mobile version.



D. Product

Click Product to select whether to collapse all sub-categories or crop product images automatically. 



E. Others

Click Others to select whether to display the "Back to Top" button. 



5. Notes

  • If your store is using the Ultra Chic theme, when adding a new advanced page, you will be directed to the new page builder. Previous pages will not be affected, and you can also edit the existing page content with the old page builder 
  • The existing footer will be replaced when you use the new page builder to publish the new footer. Please make sure you want to update the existing footer before publishing.


Read more






Have more questions? Submit a request