Introduction

Content Pages could be used to provide general details about your business, missions, and vision. In X-Cart, pretty much any eCommerce-related aspect is handled by the application. However, by creating your Custom Pages, you might provide additional information related to your terms, employees, news around your business. Basically, anything you think is going to be of interest to your visitors.

In this tutorial, we are going to step-by-step guide you on how to create custom pages and how to display them either at the Primary or the Footer menu.

Accessing the Pages section

For a start, please log in to your X-Cart Admin Area and navigate through the left-hand side menu bar to Content > Pages.

In this section, you can see a list of the Content Pages created by default in X-Cart. As you are probably already aware, the Power icon indicates whether the page is enabled or disabled, and the Crossed Arrow icon lets you organize the pages by dragging and dropping them to the desired position.

Adding Content Pages

To create a custom page, you have to click on the "New page" button.

Upon doing that, you are being redirected to the page creation interface, where you have to configure the page settings and details. First, you have to specify the general page information:

• Name - The value in this field determines the page title on the backend as well as on the storefront.
• Enabled - This checkbox controls whether the page is visible on the storefront. In case you do not want to display it right away, you can untick it now and enable it when you are ready to publish it. 
• Clean URL - The Clean URL, or the so-called SEO-Friendly URL, is automatically created based on the page name. If you want to edit it, please make sure to use only lower case letters and replace all spaces with hyphens (-).
• Content - This WYSIWYG Editor lets you easily customize the page content. Using the handy tools, you can change the font, include images, links, videos, and edit the HTML code.

• Content page title - In this field, you have to define the page title to be used in the browser title bar. If you leave it blank, the page name is going to be used as a title.
• Meta Keyword - In this field, you need to enter all the keywords related to this page. They help search engines to determine what the page is about and rank it relevantly in search results.
• Meta description - This field is intended for the metadata description of the page. The meta description does not appear on the page - search engines use it, and it displays in search results.
• Open graph image - You can upload an image to be used when the page is shared on Facebook.
• Open Graph meta tags - Here, you have to specify the meta tags used for sharing the page on Facebook.
• Show social buttons - This checkbox controls whether Social buttons to be available on the page and allow visitors to share it.

When all the required information is filled in, you have to click either on the "Save" button (remain on the same page) or the "Save & Close" button (go back to the list of pages).

Displaying Content Pages in Menus

Now that your new page is created, it is time to add it as an item to the Primary or Footer menu.

To achieve that, please navigate through the left menu bar to Content > Menus.

When there, you can see the page is split into two tabs representing each of the menus. Depending on in which menu you would like to add the page, you have to ensure you are located under the corresponding tab.

Regardless of the menu, your first step is to click on the "New item" button.

Upon doing that, a new empty row appears where you have to specify the following details:

• Item name - In here, you need to specify the name of the page as it is going to be shown in the menu.
• Link - In this field, you need to enter the URL of the page where your visitors to be redirected upon clicking on the menu item. In our case, we can enter only the relative path, i.e., "about-us" as this is an internal page. If it is an external page, you have to enter the full URL address, i.e., "https://domain.com/abount-us". If you are not sure about the page URL, you can always double-check it back at the "Pages" section. 
• Visible for - This option lets you control the accessibility of the page. If you want to restrict it only to a specific group of users, please make sure to select it from the dropdown menu.

When ready, please click on the "Save changes" button to add the page to the menu.

Note that the page is automatically added at the top of the list. This means it is going to be displayed as the first item in the menu. You can organize the items and change their order by clicking on the corresponding Crossed Arrow icon and dragging the menu item to the desired position.

Once this is done, please go ahead and test if everything appears and works as expected on the storefront. When you ensure the intended result is accomplished, you are all set!

Well done! You have just managed to create a brand new page from scratch and add it to your store menu. We hope this new skill is going to be useful to you. In case you have any additional questions on the topic, please do not hesitate to contact our Support Team.