A brief becomes a real page.Add a small CSS or JavaScript enhancement
Choose page-level or site-wide code intentionally and verify its effect.
Video coming soon
Your next step is ready.
Follow the complete written guide below.
The video will join it here when it’s ready.
Before you start
- A verified connection and a practice site.
- Required code-editing capabilities.
- Elementor Pro for its custom CSS and site-wide Custom Code features.
Let’s do this, step by step.
Step 01
Check the code tool switches
Select Elementor on Page Builders and Save changes. Open Tools → Elementor → Custom Code, enable the required action and Save changes. The site-wide Pro code actions require Elementor Pro; add-custom-js is a separate page action.
Find the needed action under Elementor’s Custom Code tools. Enable only that action, save, and reconnect. Site-wide code has different requirements from a script added to one page.
Step 02
Choose the smallest scope
Decide whether the change belongs to one element, one page, or every page.
For a visual tweak on one page, do not start with a site-wide script. Scope the change to the actual requirement.
Step 03
Inspect the target
Read the page and exact element ID, then review the proposed CSS or JavaScript.
Keep a copy of the previous settings. Ask the AI to explain what the code changes in ordinary language.
Step 04
Save through the matching tool
Use page/element custom CSS for styling, or add-custom-js for a page script. Create a site-wide snippet as a draft when that wider scope is intended.
The tools use different input formats. Let the AI inspect the schema so it does not double-wrap a script or target the wrong element.
Step 05
Test and recover
Check the page, browser errors, keyboard behavior, and mobile layout. Remove or revert the small enhancement if it fails.
A saved snippet is not a completed feature. Check the visible behavior and keep an identified way to undo it.
You’re done when…
Only the intended area changes, with no new browser errors or broken interactions.
Keep the reference handy.
The docs cover tool details and requirements for this lesson.