Skip to content

Instantly share code, notes, and snippets.

Avatar

Leesa Ward doubleedesign

View GitHub Profile
@doubleedesign
doubleedesign / woo-custom-image-sizes.php
Created Mar 4, 2018
Customise width and height of WooCommerce images since the way it handles images changed in 3.3. More detail on these filters at https://github.com/woocommerce/woocommerce/wiki/Customizing-image-sizes-in-3.3
View woo-custom-image-sizes.php
<?php
// Customise the product image and gallery thumbnail to ensure they match
function doublee_custom_woo_images() {
return array(
'width' => 600,
'height' => 476,
'crop' => 1,
);
}
add_filter( 'woocommerce_get_image_size_gallery_thumbnail', 'doublee_custom_woo_images' );
@doubleedesign
doubleedesign / multi-column-lists.js
Last active Mar 27, 2018
Adds .dual-column class to the specified list element (ul or ol) when they have more than the specified number of list items, using vanilla JavaScript
View multi-column-lists.js
/**
* Multi-column long lists
* Adds .dual-column class to the specified list element (ul or ol) when they have more than the specified number of list items
* @param selectedList - selector of lists to run the function on. Expects an array (i.e. use querySelectorAll)
* @param lengthToBreakAt - how many list items there should be before adding dual-column class
*/
function multiColumnList(selectedList, lengthToBreakAt) {
var selector = selectedList;
for (var i = 0; i < selector.length; i++) {
var listItems = selector[i].querySelectorAll('li');
@doubleedesign
doubleedesign / setHeightToHighest.js
Created Apr 24, 2018
Get the heights of all elements that match the given selector, and set all of them to the height of the highest one
View setHeightToHighest.js
/**
* Get the heights of all elements that match the given selector, and set all of them to the height of the highest one
* Note: According to https://coderwall.com/p/kvzbpa/don-t-use-array-foreach-use-for-instead, a for loop is faster than forEach
* @param selector - the CSS selector to set to the highest
*/
function setHeightToHighest(selector) {
// Get our items - returns a NodeList of elements
var items = document.querySelectorAll(selector);
// Create an array to store the heights
var heights = [];
@doubleedesign
doubleedesign / wrapThis.js
Created Mar 27, 2018
Wrap an element in a specified tag with specified classes, using vanilla JavaScript
View wrapThis.js
/**
* Wrap an element
* @param elementToWrap - selector of element to wrap
* @param elementToUse - HTML tag to use for the wrapper
* @param classes - class(es) to add; accepts string or array
* @returns {Node | *}
*/
function wrapThis(elementToWrap, elementToUse, classes) {
var wrapper = document.createElement(elementToUse);
elementToWrap.parentNode.appendChild(wrapper);
@doubleedesign
doubleedesign / change-excerpt-explanation.php
Created Sep 5, 2018
Change the explanatory text in the WordPress excerpt meta box, according to post type.
View change-excerpt-explanation.php
/**
* Change the excerpt explanation in the backend
* @param $translated_text
* @param $text
* @param $domain
*
* @return string
*/
function doublee_change_excerpt_explanation( $translated_text, $text, $domain ) {
$post_type = get_post_type();
@doubleedesign
doubleedesign / accessibility-admin-notice.php
Created Dec 4, 2018
Add a collapsible admin notice with content accessibility tips to posts and pages
View accessibility-admin-notice.php
function doublee_accessibility_admin_notice() {
$screen = get_current_screen();
if(in_array($screen->id, array('post', 'page'))) { ?>
<div class="notice notice-warning notice-accessibility">
<div id="accessibility-tips" class="meta-box-sortables">
<div id="accessibility_meta" class="postbox closed">
<button type="button" class="handlediv" aria-expanded="false">
<span class="screen-reader-text">Toggle panel: Accessibility Tips</span>
<span class="toggle-indicator" aria-hidden="true"></span>
</button>
@doubleedesign
doubleedesign / shortcode-button.js
Created Dec 12, 2018
WordPress button shortcode builder
View shortcode-button.js
(function() {
tinymce.PluginManager.add('button', function( editor, url ) {
// Add button to the editor
editor.addButton('button', {
icon: 'link',
text: 'Button',
tooltip: 'Insert button',
onclick: function() {
@doubleedesign
doubleedesign / register-customised-woocommerce-filter-widgets.php
Last active Apr 22, 2019
Customise HTML markup of WooCommerce filter widgets: Add class according to the attribute it's being used for; add logo (using ACF field on the attribute terms) if it's the "brand" attribute filter. Could be modified to display differently, output additional data according to which attribtue it is, etc.
View register-customised-woocommerce-filter-widgets.php
/**
* Widget areas
*
* @package WordPress
* @subpackage Promo Printing
* @since Promo Printing 1.0
*/
if (class_exists('Woocommerce')) {
@doubleedesign
doubleedesign / ninja-group-signup.php
Created Apr 22, 2019
Ninja Forms + Groups. When a user registers for an account using Ninja Forms User Management (https://ninjaforms.com/extensions/user-management), assign them to a group (https://wordpress.org/plugins/groups) according to the value of a drop-down selection which matches the "slug" format equivalent of the group name.
View ninja-group-signup.php
<?php
/**
* Get all groups
* Utility function
* @author Antonio Blanco
* @see https://github.com/eggemplo/Groups-Utilities/blob/master/get_groups.php
*/
function doublee_get_all_groups() {
global $wpdb;
$groups_table = _groups_get_tablename('group');
@doubleedesign
doubleedesign / query.php
Last active Jan 8, 2020
Wordpress Event CPT: Filter archive by ACF date field, with month from and two selected by the user
View query.php
<?php
/**
* Archive filter queries using the drop-downs on each archive
*
* @see filters.php
* @param $query
*/
function wh_filter_archives($query) {
// Do not modify queries in the admin