You can use the Layouts CSS and JS Editor to customize the appearance of the site that you build with Toolset Layouts.

Editing the Site’s Styles Using the CSS Editor

The CSS Editor lets you add your own CSS styles, allowing you both to create new styles and to override the default styles of your theme.

The CSS rules that you add will be included in every page of your site’s front-end.

To access the Layouts CSS Editor, go to Toolset->Layouts CSS and JS and then enter your CSS rules.

Layouts CSS Editor
Layouts CSS Editor

Layouts loads the CSS after the theme and plugins have loaded their CSS.

Adding JavaScript Code Globally using the JavaScript Editor

The JavaScript Editor lets you add your own JavaScript code.

Sometimes, you need to add JavaScript code globally to all pages of your website. Doing this by including JS files in your theme’s source code requires custom coding and access to your server. The Toolset Layouts plugin allows you to add JavaScript code right from the WordPress admin area.

Layouts provides an easy way to add JavaScript code globally to all pages that have Layouts assigned.

Go to Toolset -> Layouts CSS and JS and paste your code in the JavaScript Editor tab.

Layouts JavaScript Editor
Layouts JavaScript Editor

Layouts will automatically create a JS file, containing this code, and include it in all pages of your website that have a Layout assigned to them.