markhowellsmead

<?php

namespace SayHello\Theme\Pattern;

/**
 * Manage single block pattern
 *
 * @author Say Hello GmbH <hello@sayhello.ch>
 */
class GroupWithMediaText

markhowellsmead

// set alignment options for cover, video, and paragraph blocks.
wp.hooks.addFilter(
    'blocks.registerBlockType',
    'hd-theme/hd-theme',
    function( settings, name ) {
        if ( name === 'core/cover' || name === 'core/video' || name === 'core/paragraph' || name === 'core/list' ) {
            return lodash.assign( {}, settings, {
                supports: lodash.assign( {}, settings.supports, {
                    // allow support for full and wide alignment.
                    align: ['full', 'wide'], 

markhowellsmead

<!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"id":62096,"sizeSlug":"medium","linkDestination":"none"} -->
<figure class="wp-block-image size-medium"><img src="https://permanenttourist.ch/wp-content/uploads/2021/10/20211024-DSCF1065-768x768.jpg" alt="" class="wp-image-62096"/><figcaption>Image caption</figcaption></figure>
<!-- /wp:image -->

<!-- wp:heading {"level":3} -->
<h3 id="card-title">Card title</h3>
<!-- /wp:heading -->

markhowellsmead

<?php

/**
 * WordPress Core currently assigns the CSS Custom Properties 
 * to the HTML body element, so CSS Custom Properties assigned 
 * to :root cannot access them. This is defined by WP_Theme_JSON::ROOT_BLOCK_SELECTOR
 * which (at the date of writing) cannot be hooked or modified
 * by external means.
 * 
 * This script replaces the assignment from body {…} to :root {…} 

markhowellsmead

/**
 * Overwrite/bypass <iframe></iframe> height limit imposed by Wordpress
 * Original idea from bypass-iframe-height-limit plugin by Justin Carboneau
 * Adapted from original /wp-includes/js/wp-embed.js
 */
(function(window, document) {
    'use strict';

    var supportedBrowser = false;

markhowellsmead

<?php

namespace SayHello\Theme\Block;

/**
 * Customisation of the Core Post Title block
 * Find the original core rendering at e.g. wp-includes/blocks/post-title.php
 *
 * @author Mark Howells-Mead <mark@sayhello.ch>
 */

markhowellsmead

/**
 * Example code for a scrolling IntersectionObserver
 * Original by Keith Devon https://highrise.digital/blog/animating-blocks-on-scroll-with-intersection-observer/
 * 
 */

document.addEventListener('DOMContentLoaded', () => {
    // get all the scroll-group elemetns.
    const scrollGroups = document.querySelectorAll('[class*="scroll-group"]');

markhowellsmead

<?php 
// PHP memory limit for this site
define( 'WP_MEMORY_LIMIT', '128M' );
define( 'WP_MAX_MEMORY_LIMIT', '256M' ); // Increase admin-side memory limit.

// Database
define( 'WP_ALLOW_REPAIR', true ); // Allow WordPress to automatically repair your database.
define( 'DO_NOT_UPGRADE_GLOBAL_TABLES', true ); // Don't make database upgrades on global tables (like users)

// Explicitely setting url

markhowellsmead

<?php

/**
 * Uses the technique from https://css-tricks.com/lazy-load-embedded-youtube-videos/ to add an srcdoc 
 * attribute to YouTube embeds, which prevents the content of the YouTube iframe from loading until 
 * the user clicks on the video link. This code is intended for WordPress through the use of the 
 * embed_oembed_html filter hook.
 * 
 * Although the autoplay code is correct, current browsers appear to block the autoplay feature when 
 * loading the iframe content when the link is clicked. This means that the visitor will need to click 

markhowellsmead

transforms: {
        from: [
            {
                type: 'block',
                blocks: ['core/list'],
                transform: ({ values }) => {
                    let entries = values.split('</li><li>');
                    const link_pattern = /<a href=['"]#endnote[0-9]+['"]>([0-9]+)<\/a>/gi;
                    entries.forEach((entry, index) => {
                        entries[index] = entry.replace('<li>', '').replace('</li>', '');