In this article, you will learn about the Custom code editor and how to use it.
1. What is Custom Code Editor?
The Custom code editor allows you to insert custom CSS and Javascript code to your page. If you are looking to customize an element or create a new effect on the page, the Custom code editor can help you insert custom code and level up your page design, increasing the conversion rate of your store.
Or you can even prevent some issues on your page by adding custom code such as making full-width sections, avoiding blank spaces on top of the pages, etc.
Please note that you should contact us via Live chat if you need to ask any custom code questions.
2. How to access and work with PageFly Custom Code editor
- Step 1: In the Element Catalog, click on the Add custom Code button (on the left toolbar)
- Step 2: View the Custom CSS and Custom Javascript boxes. In the example below, we will add a code to fix the error: Sometimes when you see your pages on the mobile, the page ended up with an undesired extra space to the right. (It slides from the left to the right).
- Step 3: Click on the Save button
For more details on how to make a sticky section, please check this article.
- Click the Dismiss button or the Close icon on the top if you don’t want to use the custom code anymore. And when you take this action (Dismiss or Close), the custom code that you changed will not be saved.
- Click the Save change button if you want to save the custom code you made and they will be applied to your page editor.
- CUSTOM CSS code: You don’t have to place any <style> tags in this area as they’re already added for your convenience.
- CUSTOM JAVASCRIPT code: You don’t have to place any <script> tags in this area as they’re already added for your convenience.
- The Custom code editor only supports JavaScript/ CSS code, so it doesn’t allow you to add HTML code.
3. Video Tutorials
Learn how to easily add custom code to modify text content and style on your pages.
