Setup

Page Elements & Messages

Page elements & messages are the text items that are shown in the webstore. Page elements & messages cover almost all text items: messages, error messages, validation messages, text of the links and buttons, titles and headers (except for the product titles and content page headers), field names, popup descriptions and titles, alt texts of the images, buttons and input fields and others.

Page elements & messages can be edited in Sana Admin > Setup > Page elements & messages or directly from the webstore in the edit mode using In-site editor.

For more detailed information about how to edit or create page elements & messages directly from the webstore, see 'In-site editor'.

All page elements and messages are separated into text items, error and validation messages and custom stock texts.

The table below provides the description of the tabs:

Tab	Description
All texts	Under this tab you can edit any text items that are shown in the webstore, like text of the links and buttons, field names, popup descriptions and titles, alt texts of the images, buttons and input fields, titles and headers, etc.
Error & validation messages	Under this tab you can edit error and validation messages, for example validation of the required fields.
Custom stock texts	Using custom stock texts you can change stock presentation in the webstore per customer group. Stock indicator, stock amount or a simple text can be used. If you want to change stock presentation to a stock indicator, you can simply add the stock indicator images to the custom stock texts. You can also use a simple text or an indicator with the stock amount using the replacement tag for a stock amount [STOCKAMOUNT]. For example, In Stock ([STOCKAMOUNT]). You can change stock presentation to indicate products that are: Out of stock Low stock In stock Stock presentation can be also different for a single product and product variants. For more information about stock, read about stock and assortment and stock levels in the 'Products' chapter.
HTML injections	Using these fields you can inject the custom JavaScript and CSS directly from Sana Admin and apply it to your webstore.

All texts can be filtered by description and text identifier and sorted by text identifier.

If you edit any page element or message and it is used in different places this page element or message will be updated everywhere it is used in the webstore.

To create a new text item under All texts you need to specify the text identifier and add description in the target language. Adding a new page element or message is only useful in case of customization. It is not possible to add a new text item to a location in the webstore where no text is present.

Name	Description
Text identifier	Text identifier is used to group multiple page elements & messages that are available in different languages using a code.
Description	The actual text that is shown in the webstore.

If you have a multi-lingual webstore you can edit and create new page elements & messages per language by selecting it in the dropdown on the Page elements & messages page in Sana Admin.

For the English language page elements & messages exist in Sana Admin by default. If you install any language pack, page elements & messages will be automatically added by the language pack.

More information about supported languages can be found here.

HTML injections

Sana Commerce provides the webstore theme editor that allows to change the webstore design. Without any knowledge of HTML/ CSS a Sana Admin user can change the webstore logo, background image of the webstore, fonts, size and color of the texts and headers and even more, it is possible to change the color of the webstore graphical elements, borders and backgrounds. For more detailed information on what can be changed using the webstore theme editor, see 'Themes'.

To give you more flexibility in changing the webstore design, Sana Commerce provides an opportunity to inject the custom JavaScript and CSS directly from Sana Admin. JavaScript/ CSS added under the HTML injections tab is rendered by default on all pages of the Sana Commerce webstore, except the error pages.

You can add JavaScript/ CSS directly to the fields under the HTML injections tab or you can also add the custom CSS file to the accessible folder on the Web server via FTP or File manager in Sana Admin and add reference to this file in one of the fields.

Example: <link href="/content/files/custom.css" rel="stylesheet" type="text/css">

You can use the default Web browser developer tool or any similar tool to identify which ID or class should be targeted to change the style of any element. If you add any custom JavaScript or CSS to your webstore, make sure that it does not conflict with any standard functionality.

When you add JavaScript/ CSS to the Head field, it will be added at the end of the <head> tag.
When you add JavaScript/ CSS to the Body start field, it will be added at the beginning of the <body> tag.
When you add JavaScript/ CSS to the Body end field, it will be added at the end of the <body> tag.

With knowledge of CSS and JavaScript and using HTML injections you can change the style of any element in your webstore or you can use it to add some message. For example, you need to add a pop-up to carry out some survey or to show some important message during a commercial campaign and there is no time to implement it by development, then you can do it using HTML injections directly in Sana Admin.

Please, use HTML injections for some minor style changes.