Setup

Sana Commerce 9.3
Your connector

Back Next

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.

Moreover, using various external services, you can create different widgets and embed them in your webstore. You can create notifications, popups, sliders, live chat, testimonial, news or event announcements and attract your customers attention to different special offers and discounts.

For example, you want to provide 24/7 online support to your customers using a chat, so they can reach you directly from your webstore and ask you any questions. This is the quickest way for your customers to get answers to their questions which provides the personalized service.

There are different free and paid chat services, for example WebsiteAlive which provides a paid tool called AliveChat.

Below you can see the example of the AliveChat widget. When you register on the web site, it will automatically generate JavaScript for you which you can then embed on your web store by adding it to the Body end field of the HTML injections.

When you do this, you will see the Let's Chat! button at the bottom of your webstore. It will be available on all pages.

Clicking this button opens a chat window and your customers will be able to contact you and ask the questions they are interested in.

Back Next

Sana User GuideSetup

Sitemap

Installation

Product Versions

Links

Sana Commerce does not accept any liability for the content of this website, or for the consequences of any actions taken on the basis of the information provided. The information below should be interpreted as an example. No rights can be derived from this information.

Sana Commerce – the integrated e-Commerce solution for Microsoft Dynamics and SAP

Updated: January 2021