Skip to content

Instantly share code, notes, and snippets.

View KittenCodes's full-sized avatar

Phe Ledwell KittenCodes

23 followers · 9 following
View GitHub Profile
@KittenCodes
KittenCodes / dynamic-colours-acf.php
Created March 21, 2025 18:52
Oxygen 6 - Dynamic Colours via ACF
<?php
// Add a dynamic CSS variable to the <head> of your site
add_action('wp_head', function() {
if (function_exists('get_field')) {
// Retrieve the value of the ACF field
$selected_colour = get_field('select_colour');
// Check if a value is set and split the value and label if necessary
if ($selected_colour) {
@KittenCodes
KittenCodes / fix-button-size.php
Created January 8, 2025 07:13
Fix Large Oxygen Edit Button
<?php
add_action('admin_head', 'oxygen_support_fix_editor_icon');
function oxygen_support_fix_editor_icon() {
echo '<style>
/* fix the Grid for non-full screen */
.editor-header edit-post-header {
@media (min-width: 782px) {
.editor-header:has(>.editor-header__center) {
@KittenCodes
KittenCodes / polylang_condition.php
Last active November 25, 2024 06:15
Language Conditions for Oxygen
<?php
if( function_exists('oxygen_vsb_register_condition') && function_exists('pll_languages_list') ) {
$lang_list = pll_languages_list();
oxygen_vsb_register_condition(
//Condition Name
'Locale',
@KittenCodes
KittenCodes / shapeDividerHeight.js
Created September 5, 2021 06:58
Change the height of Oxygen's Shape Dividers on scroll
var ready = (callback) => {
if (document.readyState != 'loading') callback();
else document.addEventListener('DOMContentLoaded', callback);
}
ready ( () => {
if (window.angular) { return; }
calcHeight();
})
@KittenCodes
KittenCodes / A How To.txt
Created June 10, 2024 07:58
Modern Events Calendar with Oxygen Builder
Set up the Single Event template:
- Go to Oxygen > Templates and create a template applied to Singular > mec-events
- Copy the JSON from "single-event.json" and paste it into the +JSON box on the template
- You can then edit the template in Oxygen and move the items around as needed
Set up the Events Archive template:
- Go to Oxygen > Templates and create a template applied to Archive > Post Types > Events
- Copy the JSON from "event-archive.json" and paste it into the +JSON box on the template
@KittenCodes
KittenCodes / framework.css
Last active May 7, 2024 18:22
Basic CSS Grid Framework
/* these root values can be adjusted. You can then use them in Oxygen like this: var(-gap-xs) */
:root {
/* Gap */
--gap-xs: 4px;
--gap-s: 8px;
--gap-m: 16px;
--gap-l: 32px;
--gap-xl: 64px;
@KittenCodes
KittenCodes / Show Terms in Oxygen Easy Posts element.php
Created April 9, 2023 20:58
<?php
// Get the terms for the current post, using the Director taxonomy
$post_terms = get_the_terms( get_the_ID(), 'director' );
// If there are terms
if ($post_terms) {
// Create an empty array to add links to
$terms_list = array();
@KittenCodes
KittenCodes / code_Block_Above_Repeater_CSS.css
Last active March 22, 2023 19:00
Get images from ACF gallery in a Oxygen Repeater when the datasource is an ACF Repeater and add a lightbox to the Gallery
/*
* Add this to the CSS tab of the Code Block ABOVE the Repeater:
*/
.thumbnail img {
box-sizing: border-box;
border: 1px solid #ddd;
padding: 2px;
margin: 0 1% 15px 0;
width: 32.6667%;
@KittenCodes
KittenCodes / tippy.js
Created September 19, 2020 07:32
Tippy JavaScript
document.addEventListener("DOMContentLoaded", function() {
tippy('[data-tippy-content]', {
animation: 'shift-away',
});
})
@KittenCodes
KittenCodes / tippy.html
Created September 19, 2020 07:31
Tippy PHP & HTML
<script src="https://unpkg.com/@popperjs/core@2"></script>
<script src="https://unpkg.com/tippy.js@6"></script>
<link
rel="stylesheet"
href="https://unpkg.com/tippy.js@6/animations/shift-away.css"
/>