Skip to content

Instantly share code, notes, and snippets.

Weston Ruter westonruter

View GitHub Profile
@westonruter
westonruter / font-stylesheet-inlining.php
Last active Apr 23, 2019
WordPress plugin to improve frontend performance of external (Google) fonts by fetching provider stylesheets and inlining them. This should fix the Lighthouse audit "Ensure text remains visible during webfont load" and improve "Eliminate render-blocking resources". ⚠️ WARNING: This does not vary the inlined stylesheet by user agent (woff2 only)!
View font-stylesheet-inlining.php
<?php
/**
* Font Stylesheet Inlining
*
* @package Google\WordPress\Font_Stylesheet_Inlining
* @license GPL-2.0+
* @copyright 2019 Google LLC
*
* @wordpress-plugin
* Plugin Name: Font Stylesheet Inlining
View try-amp-cta.php
<?php
/**
* Plugin Name: Try AMP CTA
*/
add_filter(
'the_content',
function ( $content ) {
if ( function_exists( 'is_amp_endpoint' ) && is_amp_endpoint() ) {
$content = '<p>CTA!</p>' . $content;
@westonruter
westonruter / 1.0.2.txt
Created Apr 16, 2019
AMP Custom CSS manifest from Twenty Nineteen compared between AMP 1.0.2 and 1.1
View 1.0.2.txt
The style[amp-custom] element is populated with:
0 B: style[amp-custom=]
81 B: style
4159 B (35%): link#wp-block-library-css[rel=stylesheet][id=wp-block-library-css][href=https://wordpressdev.lndo.site/content/plugins/gutenberg/build/block-library/style.css?ver=1555084233][type=text/css][media=all]
958 B (64%): link#wp-block-library-theme-css[rel=stylesheet][id=wp-block-library-theme-css][href=https://wordpressdev.lndo.site/content/plugins/gutenberg/build/block-library/theme.css?ver=1555084233][type=text/css][media=all]
37 B (12%): style#twentynineteen-style-inline-css[id=twentynineteen-style-inline-css][type=text/css]
1279 B (85%): link#twentynineteen-print-style-css[rel=stylesheet][id=twentynineteen-print-style-css][href=https://wordpressdev.lndo.site/core-dev/src/wp-content/themes/twentynineteen/print.css?ver=1.3][type=text/css][media=print]
0 B: link#amp-default-css[rel=stylesheet][id=amp-default-css][href=https://wordpressdev.lndo.site/content/plugins/amp/assets/css/amp-default.c
View try-disabling-amp-by-default.php
<?php
/**
* Plugin Name: Try Disabling AMP by Default for a Custom Post Type
*/
namespace Try_Disabling_AMP_By_Default;
const POST_TYPE = 'book';
add_action(
View embeds-in-comments.php
<?php
/**
* Plugin Name: Embeds in Comments with AMP Support
* Plugin URI: https://gist.github.com/westonruter/3cf877833a8f94776536e3f90bb30ea2
* Author Name: Weston Ruter
* Author URI: https://weston,ruter.net/
*/
namespace Embeds_In_Comments;
View amp-script-test.php
<?php
/**
* Plugin Name: amp-script Test
* Description: Implementing the experimental amp-script component in WordPress. To use, add the <code>[amp_script_test]</code> shortcode to a post.
* Author Name: Weston Ruter
*/
namespace AMP_Script_Test;
const SCRIPT_HANDLE = 'amp-script-hello-world';
@westonruter
westonruter / non-cancellable-output-buffer.php
Last active Apr 12, 2019
Demonstration of output buffering being non-cancellable to capture the full WordPress response
View non-cancellable-output-buffer.php
<?php
/**
* Plugin Name: Non-Cancellable Output Buffer
* Plugin Author: Weston Ruter
* Author URI: https://weston.ruter.net/
*/
namespace OutputBufferTest;
function process_buffer( $response ) {
View test-custom-noscript-style.php
<?php
/**
* Plugin Name: Try custom noscript style in head.
* Plugin URI: https://wordpress.org/support/topic/amp-invalid-on-one-site-only/
*/
add_action(
'wp_head',
function () {
?>
@westonruter
westonruter / amp-wp-check-tree-shaker-savings.sh
Created Apr 9, 2019
Warning: this will reset all widgets on the site.
View amp-wp-check-tree-shaker-savings.sh
#!/bin/bash
# Check the savings of the AMP plugin's CSS tree shaker across the core themes between two git commits.
# WARNING: This will reset your widgets!
set -e
before_head=$1
after_head=$2
if [[ -z "$before_head" ]] || [[ -z "$after_head" ]]; then
echo "First argument needs to be the before HEAD, and second argument must be the after HEAD."
exit 1
@westonruter
westonruter / twentynineteen-css-not-tree-shaken.css
Last active Apr 6, 2019
CSS rules with Twenty Nineteen that are marked as unused in the coverage report
View twentynineteen-css-not-tree-shaken.css
.wp-block-cover h2 {
color: #fff;
font-size: 2em;
line-height: 1.25;
margin-bottom: 0;
max-width: 610px;
padding: 14px;
text-align: center;
z-index: 1
}
You can’t perform that action at this time.