-
Tailwind Fluid Type Calculator for WordPress
A WordPress preview page for Tailwind fluid typography: every fluid-text class with its name and its real px size at the current screen width.
Category: Tailwind -
Dequeue Oxygen CSS
If you are importing frameworks such as Bootstrap, Tailwind CSS, Bulma, Materialize … you may not want that Oxygen Builder defaults overwrite some of frameworks styles. Thats why we offering solution do remove Oxygen CSS. Keep in mind that if you disable Oxygen CSS non of Oxygen CSS’s will be added on the website: Oxygen…
Category: OxygenTags: CSS -
Remove Gutenberg Duotone Filter
This is nice feature but in most of the cases you will not want to have it so the clients do not go off brand and mess up with styling. Also its loading on front end so it’s extra load.
Category: WordPress -
Preview the Tailwind Type Scale in WordPress
Preview your Tailwind type scale on a WordPress page: every text-* class with its class name and the real font size in px and rem.
Category: Tailwind -
Show the Screen Width in WordPress for Logged-in Users
Show the current screen width in a corner of your WordPress front end while you are logged in, to check breakpoints. Visitors never get the code.
Category: JavaScript -
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 a Script After the Opening Body Tag in WordPress
Print Google Tag Manager or any other script right after the opening body tag in WordPress with the wp_body_open hook, no theme edits.
Category: WordPress -
Shrink the Header Logo on Scroll in WordPress
Shrink the WordPress header logo when the visitor scrolls, with a small plain JavaScript class toggle and a CSS transition. No jQuery.
Category: JavaScript -
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 -
Remove Gutenberg Block Library CSS in WordPress
Remove the Gutenberg block library CSS and global styles from the WordPress front end on classic sites, with a config for what to keep.
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 -
Add a Copy to Clipboard Button to WordPress Code Blocks
Add a Copy button to every code block on your WordPress site with plain CSS and JavaScript: Clipboard API, http fallback, keyboard accessible.
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 -
Size an Element on Load and Resize in WordPress
Run JavaScript once on page load and again on every resize in WordPress, throttled to one run per frame and without jQuery.
Category: JavaScript -
Fade In Headings with GSAP in WordPress
Fade in WordPress headings and other elements with GSAP autoAlpha, loaded from a pinned CDN, visible without JavaScript and with reduced motion.
Category: GSAP
3rd party plugins actions admin archive block-themes block editor Blocks block theme build capabilities core CSS Custom Post custom post types Developer development filters Front End full site editing gutenberg hook Image img load styles maintenance media mu-plugin Must Have npm Oxygen performance php plugins scripts organizer security SEO settings api single product theme.json Tips updates WooCommerce wordpress wp-cli WP Admin