Featured

Upgrading Kubrick for Gutenberg

This post will contain files and tutorial information related to my talk at WordCamp Santa Clarita on April 6, 2019.

Presentation Files

Sources and Links

Creating a custom attachment loop for images and other files in WordPress

While building an attachment.php template for a project I opted to customize the loop to properly display an image within a figure tag and the caption within figcaption to aid accessibility.

Additionally if the file is not an image it will provide a button that can be styled along with a mime type.

The following code would have to be placed within the loop.

<?php 
if ( wp_attachment_is_image() ) {

	// Set the image's ID to an array so it can be reused later
	$image_id = get_the_ID();
	$caption = wp_get_attachment_caption( $image_id );

	echo '<figure>';

		// Displays the large version of the image if available
		echo wp_get_attachment_image( $image_id, 'large' );

		// if no caption is set or the value is null do nothing and don't display the empty tags
		if (!empty($caption) ) {
			echo '<figcaption>' . $caption . '</figcaption>';
		}

	echo '</figure>';

} else {

	// If the attachment is not an image display a button and mime type.
	$attachment_id = get_the_ID();

	$attachment_url = wp_get_attachment_url( $attachment_id ); 

	echo '<button type="button"><a href="' . $attachment_url . '" target="_blank">' . get_the_title( $attachment_id ) . '</a></button> ';

	echo '<span class="mime-type">' . get_post_mime_type( $attachment_id ) . '</span>';

}
?>

Twenty Nineteen Child Theme

This theme was created by Joseph Dickson to add additional features for use on my personal websites. Feel free to learn from this code, reuse it. Even make fun of how poorly written it may be.

Features

Version 1.0.1

  • Added Open Graph support.
    • Theme will use the custom logo set in the customizer.
    • Theme will use the featured image on posts and pages if available.
  • Updated functions.php so block.css can be cached by last modified time.

Version 1.0.0

  • Pins a post slugged ‘who-am-i’ to the homepage if it exists and doesn’t display a featured even if one is assigned.
  • Increases the Code block width to 100% of it’s container and bumps up the font size.

Links

Excluding a software as a service script from Events Calendar pages and others using Conditional Tags

Recently, I hit a hard page limit with our web governance subscription and decided to exclude lower priority pages such as calendar entries, media attachment pages and blog archive indexes to removing them from the automated check I can avoid upgrading our plan and focus on pages and posts that actually matter.

Last year I created a simple plugin that loads this software as a service into our footer. Here, it’s been extended to omit certain templates using WordPress’ conditional tags method to load it only where it will be useful.

Continue reading “Excluding a software as a service script from Events Calendar pages and others using Conditional Tags”

Overriding Gutenberg’s default editor width and font

By default Gutenberg sets the editor width to 580px on the desktop unless the browser window is narrower. Since Kubrick’s post content area is 480px we’ll need to override the width so text wrapping occurs at the same width as the final post. for that we simply set new declarations for the wp-block class tag.

Continue reading “Overriding Gutenberg’s default editor width and font”