You can easily customize the Elegance Framework for Joomla 3 with your own custom code, for example: CSS, JS, metatags, links and verification code by using the custom fields in that section of settings.
Before </head>
Any code you place here will appear in the head section of every page of your site. This is useful when you need to add a snippet of verification code, javascript or css links to all pages.
The end result on the front-end will be HTML5 code generated by the browser. The line you can see in the image below was output before ending </head> tag.
Before </body>
Any code you place here will appear in bottom of body section of all pages of your site. For example javascript code can also be at the bottom of page body. In this case it executes after the page is loaded by the browser.
This is useful if you need to input a tracking code for a statistics counter (web analytics) such as Google Analytics(GA), Piwik, Woopra or Clicky. This tracking code will be available on every page of your Joomla web site.
Custom CSS
This field allows you to add custom CSS code directly into the template code without using any external file link. Just paste your styles for classes or ID's or HTML tags to override dafault style based on the template.
Using Custom CSS gives you the power to create your unique design and allow you customize the appearance of selected elements (colors, size etc.). If you have many CSS changes to the template then the best option will be to simply create a custom.css file and add your CSS code there.
If you need a lot of custom CSS code please create a new custom.css file in the template's css directory of your current active Elegance Framework based template.
NOTE! This custom.css file is loaded before the custom css code entered in the template settings, so the second one may override everything.
The path for the custom.css file to be placed would be: templates/elegance/css/custom.css
If the custom.css file is found in the above directory then it will be loaded and applied.
Note! custom.css file is loaded before custom css code from template settings, it means that second one may override everything, also that file with styles.
Custom JS
The procedure of adding JavaScript code is same proceedure as adding the custom css file and you just name the file custom.js.
The path for the custom.js file to be placed would be: templates/elegance/js/custom.js
NOTE! This custom.js file is loaded before the custom javascript code entered in the template settings.
