Skip to content

Instantly share code, notes, and snippets.

Avatar

Ross Morsali rmorse

View GitHub Profile
@rmorse
rmorse / block-edit-unique-id.js
Last active Jul 24, 2022
Generate unique IDs (as attributes) for blocks - ensure that duplicating a block will generate a new ID
View block-edit-unique-id.js
/**
* WordPress dependencies
*/
import { useSelect, dispatch } from '@wordpress/data';
import { useLayoutEffect } from '@wordpress/element';
import './store';
const storeName = 'plugin-name/block';
function Edit( { attributes, setAttributes, clientId } ) {
// Get the stored attribute field ID.
@rmorse
rmorse / class-handlebars-helpers.php
Last active May 3, 2022
Adds support for `if truthy`, `if falsy`, `if equals` and `if not equals` to Handlebars PHP - https://github.com/salesforce/handlebars-php
View class-handlebars-helpers.php
<?php
/**
* Adds helpers to Handlebars to support the following expressions:
*
* If truthy - `{{#if_truthy varName}}...{{/if_truthy}}`
* If falsy - `{{#if_falsy varName}}...{{/if_falsy}}`
* If equal - `{{#if_equal varName anotherVar}}...{{/if_equal}}`
* If not equal - `{{#if_not_equal varName anotherVar}}...{{/if_not_equal}}`
*
* Supports the PHP implementation of Handlebars found here: https://github.com/salesforce/handlebars-php
View re-init-elementor-widgets-after-ajax-finish.js
// re init layout after ajax request
$( document ).on( "sf:ajaxfinish", ".searchandfilter", function( e, data ) {
if ( window.elementorFrontend && window.elementorFrontend.elementsHandler && window.elementorFrontend.elementsHandler.runReadyTrigger) {
var runReadyTrigger = window.elementorFrontend.elementsHandler.runReadyTrigger;
runReadyTrigger( data.targetSelector );
// NEW - re-init elementor widgets inside the new results:
var ajaxTarget = $( data.targetSelector );
if ( ajaxTarget.length > 0 ) {
ajaxTarget.find( '.elementor-widget' ).each( function () {
@rmorse
rmorse / react-router-dom-v.6.02.prompt.blocker.js
Last active Aug 18, 2022
Adds back in `useBlocker` and `usePrompt` to `react-router-dom` version 6.0.2 (they removed after the 6.0.0 beta, temporarily)
View react-router-dom-v.6.02.prompt.blocker.js
/**
* These hooks re-implement the now removed useBlocker and usePrompt hooks in 'react-router-dom'.
* Thanks for the idea @piecyk https://github.com/remix-run/react-router/issues/8139#issuecomment-953816315
* Source: https://github.com/remix-run/react-router/commit/256cad70d3fd4500b1abcfea66f3ee622fb90874#diff-b60f1a2d4276b2a605c05e19816634111de2e8a4186fe9dd7de8e344b65ed4d3L344-L381
*/
import { useContext, useEffect, useCallback } from 'react';
import { UNSAFE_NavigationContext as NavigationContext } from 'react-router-dom';
/**
* Blocks all navigation attempts. This is useful for preventing the page from
* changing until some condition is met, like saving form data.
View acf-relationship-field-shortcode.php
<?php
/**
* Output an ACF post relationship field type using a shortcode:
* [ca_acf_relationship_field field="field_name"]
* You can also pass `post_id` as an attribute
*
* Works with Post Object and Relationship fields, when the return
* format is both post object and post ID
*
* This code assumes you are copying this into functions.php of
@rmorse
rmorse / add-custom-editor-colors.php
Last active May 31, 2022
Add custom colors to the WordPress editor via `add_theme_support`
View add-custom-editor-colors.php
<?php
/**
* Add custom colors to the WordPress editor via `add_theme_support`
*
* This takes the existing colours (if your theme or a plugin has set any)
* and combines them with a new set of colours defined in the function
*
* New colours should be visible in the various color pickers found in
* WordPress admin
*/
@rmorse
rmorse / change-prefix.php
Last active Oct 26, 2020
Bulk change WordPress table prefix
View change-prefix.php
<?php
// Warning: There is nothing safe about this script - don't use in production - make a backup. Always delete when finished.
/*
* Use this script to change the table prefix (renames the tables) in your WordPress install.
* Instructions:
* - Put this in a subdirectory from the root of your install - ie, create a new directory in the same folder as `wp-config.php`
and put this in it
* - Change the values `$old_prefix` and `$new_prefix` below, to match your requirements
* - Change the `$table_prefix` var in `wp-config.php` to your new prefix
View sf-pro-results-template-example-extra-css.css
.search-filter-result-item{
overflow: auto;
}
.search-filter-results-image{
display: block;
width: 30%;
vertical-align: top;
float: left;
}
View sf-pro-results-template-example.php
<?php
/**
* Search & Filter Pro
*
* Sample Results Template
*
* @package Search_Filter
* @author Ross Morsali
* @link https://searchandfilter.com
* @copyright 2018 Search & Filter
@rmorse
rmorse / basic-richtext-block.js
Last active Dec 26, 2018
Basic Gutenberg Block, with a RichText Component and a Button on a Toolbar thats logs to console - https://codeamp.com/interacting-with-gutenbergs-richtext-component-using-a-button/
View basic-richtext-block.js
var el = wp.element.createElement;
const { __ } = wp.i18n; // Import __() from wp.i18n
const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks
const { RichText, BlockControls, BlockFormatControls, AlignmentToolbar } = wp.editor;
const { Button, Dashicon, Tooltip, IconButton, Toolbar } = wp.components;
const { Component, Fragment } = wp.element;
//standard registerBlockType init
registerBlockType( 'my-block-plugin/block-w-insert-shortcode', {
title: 'Block w Shortcode Button', //any title you like