Eric Clark eclarrrk

eclarrrk / lightweight-dismissible-banner.php

Created January 13, 2021 19:45

Creating a lightweight dismissible banner on a PHP site

	<?php
	$cookie_name = "banner";
	if(!isset($_COOKIE[$cookie_name])) :
	?>

	<div class="banner">
	<!-- your content -->
	<button onclick="alertClose()" aria-label="Close">
	<span role="presentation">✕</span>
	</button>

eclarrrk / anchor-offset.css

Created May 28, 2021 18:34

Create a top-margin for every element with an ID

	/* selects every element with an ID */
	[id] {
	/* adds scroll margin to the top of an element when linked to */
	scroll-margin-top: 2rem;
	}

eclarrrk / color-scheme-favicon.html

Created June 3, 2021 19:10

Show a different favicon depending on the browser color scheme — light mode or dark mode

	<!-- From https://glitch.com/edit/#!/zesty-soybean?path=script.js%3A31%3A0 -->
	<link rel="icon" href="<?php echo get_stylesheet_directory_uri(); ?>/path/to/favicon-light.png"
	id="light-scheme-icon">
	<link rel="icon" href="<?php echo get_stylesheet_directory_uri(); ?>/path/to/favicon-dark.png"
	id="dark-scheme-icon">

	<script>
	function setupIcons() {
	const lightSchemeIcon = document.querySelector('link#light-scheme-icon');
	const darkSchemeIcon = document.querySelector('link#dark-scheme-icon');

eclarrrk / content-search.php

Created August 12, 2021 12:55

How to show an excerpt for pages in WordPress search results

	<?php
	if ( 'page' === get_post_type() ) {
	echo wp_trim_words( get_the_content(), 30, '...' );
	} else {
	the_excerpt();
	}
	// wp_trim_words() docs: https://developer.wordpress.org/reference/functions/wp_trim_words/
	?>

eclarrrk / acf-block-template.php

Created September 22, 2021 20:25

How to register a block template with an ACF Custom Block and pre-populate it's ACF fields.

	<?php
	function register_csg_patterns() {
	}

	add_action( 'init', 'register_csg_patterns' );

	function myBlockTemplate() {
	$myBlockTemplate = get_post_type_object( 'myCustomPostType' ); // Adds these blocks to a specific post type
	$myBlockTemplate->template = array(

eclarrrk / swap-space-with-nbsp.js

Created December 21, 2021 14:50

Script that removes the space between the last two words in an element, preventing a hanging widow on the last line

	// Add non-breaking space between the last 2 words of the elements selected
	var noSpace = document.querySelectorAll(":is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, *:not(.keep-space)");
	for (var i = 0; i < noSpace.length; i++) {
	var headline = noSpace[i].innerHTML;
	// count the amount of spaces in the headline
	var wordCount = headline.split(" ").length;
	// if there are 3 spaces or more in the headline...
	if (wordCount > 2) {
	headline = headline.replace(/ (?=[^ ]*$)/i, " ");
	}