How to embed CSS or HTML on your site pages

There can be instances when you want to apply external CSS to your Enlitly site. Although Enlitly does not provide an option to upload CSS, you do have an option to embed CSS code on each page.

Typical use cases –

a. Embed code from Facebook Pixel, Messenger or Google Analytics

b. Embed a chat widget or embed a calendar pop up widget.

c. Override font on your site page. If you would like to have your primary font for all texts on the site, you can embed below CSS in the header portion of your site page (as described in the article).

<style> *:not(fa){font-family: var(–font-family) !important;} </style>

Here is how you can embed CSS on your page? #

a. Open the site editor by clicking on edit page.

b. Go to page level settings. This option is available on the top right side of the editor.

c. You should see an option “Head Tracking Code” Desc: Embed any valid HTML code

Here you can embed your CSS or any valid HTML code that goes in the header of the page

d. You also have separate option to insert code in the body of the page. The option starts with “Body Tracking Code” Desc: Embed any valid HTML code.

After copying the code, simply click outside the area. This will auto-save the code.

To see the changes, view the page in the browser. Note that page level setting doesn’t require publishing. You can directly view the effect of your changes using view live site option.