Importing Template
Step 1: Choose an SCSS Compiler
There are many compilers out there and my favorite without a doubt is wpcodebox but there are many others to choose from. Here are some options.
Paid Options
Free Options
Step 2: Import SCSS
Navigate to your downloaded files and find the folder labeled "SCSS"
There are two versions of the SCSS to choose from:
"Mega-menu-Vxx.scss" for the users that use Automatic CSS
"Mega-menu-no-acss-Vxx.scss" for the users that do not use Automatic CSS
Open your prefered file in either a text editor or code editor like VS Code.
Copy all of the file contents
Navigate to your preferred script plugin and paste the SCSS into a new SCSS file or SCSS partial IF you know how to use partials.
Step 3: Create a Header Template
If you already have a header template skip to step 4
Navigate to your wordpress dashboard and go to bricks > templates
Click "add new" at the top left
Give it a title of something like "Header"
On the right hand side choose the template type "header"
Click publish
Click edit with bricks
Once bricks editor loads click on the gear icon and then click "template settings"
Click conditions
Add condition
Select "Entire Website"
Step 4: Importing Header JSON
Navigate to downloaded files
Find the folder named "Header Template"
Open the .json file in a text editor or code editor
Copy all of its contents
Navigate back to the bricks editor
Click inside of the page canvas
CMD+V or CTRL+V to paste the header directly into the builder
Save the bricks template on the top right
Step 5: Add JS
navigate to your downloaded files
Open the folder named "js"
open the .js file in a text editor or code editor
copy its contents
add a code element below your new header element
paste code into the javascript area
Turn on "execute code" and "Render without wrapper"
make sure to save your template!
Last updated