Code Block Element

Last Update: March 30, 2024

The Code Block Element lets you add HTML or CSS code to the page without WordPress changing the format. This comes in handy when you need to add custom code to your page. Read on to see how to use this Element, and watch the video for a visual overview.

For privacy reasons YouTube needs your permission to be loaded.
I Accept

How To Use The Code Block Element

The Code Block Element allows you to add code (HTML, CSS, Javascript etc) to the page without WordPress changing the format. For the element to work, Code Block Encoding, found in Options > Advanced > Features tab, must be enabled.

Basically, if you don’t know what content to use the Code Block Element for, you probably don’t need it. But essentially, any content within a Code Block element is encoded, and this stops WordPress from getting its hands on the code and inserting tags, line breaks, and any other formatting changes, that it likes to make to content inside the editor. By default, Avada takes the content and converts it into a base64 string so that it can be decoded when the page is rendered. This way it will come out on the page exactly the same as it was inserted into the Code Block.

Read below for a detailed description of all element options.

Code Block Element Options

There is only one option for the Code Block Element. Simply add your code in the Code field, and it will be displayed on the front end.

HeadingDescription
CodeEnter some content for this codeblock.