-
Display Screen Width if user is logged it
If you are fine tuning your design you need to check if you are targeting right size. With Scripts Organizer it’s easy to check if user is logged in since you probably don’t want to show this on the front end to everyone. Scripts Organizer Settings Use conditions and select: Header (CSS or SCSS) Footer…
Category: jQuery
-
Element color background in repeater with ACF
Create ACF field group and assign it to posts. Create field label and name it color and choose field type Color picker. Assign color to each post Create a repeater in Oxygen builder Select first child of Repeater Add class to that element “data-color-bg” Go to advanced > attributes > Add attribute. First field needs…
-
Add script after body is open
One of the most common scripts include locations for analytics are inside header and after body is opened. In Scripts Organizer we didn’t wanted to bloat UI with this one as you can add it with simple code snippet. Scripts Organizer Settings Trigger location: EverywhereScript Location: PHP
Category: WordPress -
Animate header logo on scroll
Important here is that you add class .header to your header and class .brand to your logo. Code will add new class (.header-alt) to the header to the .header after user scrolls more then 1px. On the line 6 you can change scroll value to what you prefer (50px, 100px, etc). Add height to your…
-
Free WordPress Cookie Consent with Scripts Organizer
This is taken form Facebook conversation in the Official Oxygen Builder group. Follow up on the conversation.
-
Hide Oxygen Composite Elements
if you do not use it. Keep add elements sidebar clean. Solution to hide If you are using Scripts Organizer download code snippet Solution to Disabled Thanks to Suppa Mike for providing second solution.
Category: OxygenTags: composite elemenets -
Hide cookie banner for a year
Use JavaScript to hide element for one year. It’s perfect for banners such as cookie. You can easily change parameters and change it from 365 days to what ever you need. Your element need to have class of “element-dismiss” and you need to place button element inside
Category: JavaScript -
Rotate text and align along the edge
Right Left Top Bottom
Category: WordPress -
Remove the Gutenberg Block Library CSS from WordPress
Note: Do not use this if you want to use Gutenberg. Only if you are using Classing editor. If you are using Scripts Organizer set it as Code block, Trigger location > Everywhere.
Category: WordPress -
EDD Restricted content. Present excerpt instead of content
This can be placed in Oxygen code block or you can make it as short-code. It will display excerpt if user is not logged in or didn’t purchased specific product. Replace XXXXX with your product ID on line 9
Category: EDD -
Copy code to clipboard
Click anywhere within code block to automatically copy to clipboard. Code is taken from WPJohny’s plugin. But to reduce number of plugins I moved it to Scripts Organizer.
Category: WordPress -
Oxygen Hook. Add code after body is opened
Oxygen does not support WordPress wp_body_open() and if you need to integrate Google Tag manager it requires two code parts. 1st part is Inside Head and 2nd is inside Body. Lucky Oxygen provides hook that is called: ct_before_builder. If you are using Scripts Organizer , Code Snippets or any other functionality plugins this script will…
-
Iconoir. Free Icons set for Oxygen Builder
Iconoir is one of the biggest open source libraries with currently 1007 SVG Icons. Really nice designed outline icons set done by Luca Burgio. Original Icons are exported as outlines. I have converted outline to fill and used IcoMoon App to make it as icon set ready for Oxygen. Download them and enjoy! Thanks to…
Category: Oxygen -
Category: jQuery
-
Category: jQuery
-
Animate Alpha
This is for GreenSock
Category: GSAP -
Category: jQuery
-
Add class to the element on scroll
Change element class or ID on lines 3 and 5 to trigger right elements and on line 2 100 is how many pixels to scroll until class is added.
Category: jQuery -
Reload bellow the fold in same place
The most annoying thing when you are working with animations or even with CSS is definitely when you are working on something that is below the fold, and with each refresh, you need to scroll again to see the changes. This code snippet will help you with that. It will scroll to the same position…
Category: jQueryTags: Tips -
Scroll Progress Bar in Oxygen under 2 minutes
This technique requests Scripts Manager feature by Swiss Knife or Scripts Organizer to quickly import a script. Register Script We will start by going into Script Manager feature and paste CDN link or Upload it to media library to store it on our server. Give it a name, Script Type set as JavaScript, Location for…
Category: WordPress
3rd party plugins admin after_body Alt archive Blocks Category clean up composite elemenets core CPT CSS Custom Custom Post Dashboard flexslider Front End FSE full site editing Gallery hook HTML Image load styles Must Have notice Oxygen Password Permalink plugins Post List Publish Date repeater settings page share single product Taxonomy Taxonomy Term themes Tips Topbar WooCommerce wordpress WP Admin WPML