All Collections
Look and Feel
Storefront Builder (X-Cart 5.5.x)
About X-Cart's Storefront Builder (5.5.x)
About X-Cart's Storefront Builder (5.5.x)
Seller Labs avatar
Written by Seller Labs
Updated over a week ago

The Storefront Builder is a tool available for X-Cart 5.5.x versions.

It can be used:

  • to change the layout type of a page (the number of columns and the position of the sidebar - left or right),

  • to reposition/manage the visibility of the information blocks on a page,

  • to conveniently manage the store logo, favicon, and app icon,

  • to quickly access the settings of such page elements as the primary and footer menus,

  • to quickly manage banners and their settings,

  • to add custom CSS styles and JavaScript code,

  • to conveniently access and edit the store templates,

  • to edit text labels,

  • to edit the store's SEO settings and more.

To use the Storefront Builder, you will need the add-on Theme Tweaker to be installed and enabled.


Please note that although the add-on Theme Tweaker is available for X-Cart 5.4.x and earlier versions as well, the Storefront Builder is available exclusively for X-Cart 5.5.x. Compared to the Theme Tweaker for X-Cart 5.4.x and earlier, the X-Cart 5.5.x Storefront Builder provides a step up in user experience.


To access the Storefront Builder tool in your X-Cart store Admin area, navigate to the Themes page by going to Design > Themes, then click the Customize storefront button.

The Storefront Builder opens in a new browser tab. You can tell you are in the Storefront Builder by looking at the page header (it should say "Storefront Builder"):

You can quit the Storefront Builder and go back to the regular Admin area screen by using the Admin Area link in the top left-hand corner:

The left pane of the Storefront Builder provides the Layout Editor controls.

The right pane shows the storefront of your X-Cart store. You can use this pane to navigate to the page you would like to edit. While you are working in the Storefront Builder, this same pane allows you to see the changes you are making in real time.

To get a better view of the right pane contents, you can expand the right pane to fit the size of your browser window by using the Collapse control.

To return to the regular view of the Storefront Builder screen with two panes, use the Expand control.

After making any changes in the Storefront Builder, you need to save them. Use the Save button in the top right-hand corner.

Should you wish to cancel your changes before saving, use the Reset Layout button.

You will need to confirm your wish to reset the layout, since after clicking the Reset Layout button any changes you have made in the editing session will be lost.

Read on:

Did this answer your question?