Half-Elf on Tech

Thoughts From a Professional Lesbian

Tag: wordpress

  • OpenGraph Images and Taxonomies

    OpenGraph Images and Taxonomies

    As I worked my way through optimizing the SEO for my Dead Lesbians, I hit a recommendation that I found difficult to handle. It was presented simply. Add an open graph image to the page.

    The problem was the page was a category page (a custom taxonomy).

    Easy: Yoast’s OG Image

    The easiest solution if you’re using Yoast SEO is just to make a custom image and upload it. Go to the taxonomy page, edit it, go to the Yoast section, click on the sharing icon, and you’ll see what needs to be added.

    If you want to automatically handle the open graph image with Yoast SEO, it’s filterable.

    function halfelf_wpseo_opengraph_image( $image ) { 
    	return $image; 
    }; 
    add_filter( 'wpseo_opengraph_image', 'halfelf_wpseo_opengraph_image', 10, 1 );
    

    This means if you have a specific image for a category if the image doesn’t have a post thumbnail, you could do something like this:

    function halfelf_wpseo_opengraph_image( $image ) { 
    	global $post;
    
    	if ( !has_post_thumbnail() ) {
    		if( in_category( 'foo', $post->ID ) ) {
    			$image = get_stylesheet_directory_uri().'/images/cat_foo.png';
    		} elseif( in_category( 'bar', $post->ID ) ) {
    			$image = get_stylesheet_directory_uri().'/images/cat_bar.png';
    		}
    	}
    	return $image;
    }
    

    That’s really bad code, by the way. There are smarter ways than hard coding, especially since you can do some pretty nice stuff with primary categories in Yoast SEO. I would probably have it grab the primary category for the post, force the image, check to make sure the image exists, and have a fallback (just in case someone else added a new category).

    The problem is that the filter doesn’t work on categories and taxonomies because they don’t have the filter set. Posts and pages are fine. Not categories.

    Easy: Adding via wp_head

    Adding in an open graph image via the wp_head action is similarly possible.

    add_action('wp_head', 'halfelf_opengraph_image', 5);
    function halfelf_opengraph_image( ) {
    	echo '<meta property="og:image" content="http://example.com/og_image.png"/>';
    }
    

    This is extendable and you can customize it to be as simple as my example or as complex as pulling a specific image per category or featured image, depending on your theme.

    Not Easy: Reality

    Besides the fact that I can’t use Yoast’s filter for categories, I had a bigger problem. The way I designed my theme, most of my taxonomies had a custom image picked. The images are all SVGs. And you know what doesn’t work on OG images? Yeah, SVGs. Good news was that I had a copy of all the images as a PNG as well, so I was able to use the second method to create default images using the PNG.

    More bad news? I didn’t actually know how to grab the taxonomy ID. While WordPress has a handy function is_tax(), I couldn’t use a global like $post to grab a $tax->ID. Thankfully I could use get_queried_object_id() to set my term ID like this:

    add_action('wp_head', 'lez_opengraph_image', 5);
    function lez_opengraph_image( ) {
    
    	// If it's not a taxonomy, die.
    	if ( !is_tax() ) {
    		return;
    	}
    
    	$term_id = get_queried_object_id();
    	$icon = get_term_meta( $term_id, 'lez_termsmeta_icon', true );
    	$iconpath = get_stylesheet_directory().'/images/png/'.$icon.'.png';
    	if ( empty($icon) || !file_exists( $iconpath ) ) {
    		$icon = 'square';
    	}
    
    	echo '<meta property="og:image" content="'.get_stylesheet_directory_uri().'/images/png/'.$icon.'.png" />';
    
    }
    

    Obviously I know where I’m storing the images. You’ll want to change that for yourself. I went with a fallback image of “square” in case there wasn’t one available, just because I hate having nothing show. Also here I only wanted the custom taxonomies to have this image, not the regular categories and tags.

  • Custom Meta, Keywords, and Taxonomies

    Custom Meta, Keywords, and Taxonomies

    As I continue using OnPage, I was able to make some pretty fast gains. All the work I did with Yoast and CPTs immediately saw me picking up higher rankings for some of my keywords. That meant I had successfully optimized the pages for shows and characters.

    The hard work happened next. See one of the terms I wanted to rank for was “dead lesbians” and if you look at that right now, we’re not in sight. We own the domain deadlesbians.com which sends you to https://lezwatchtv.com/cliches/dead/ but how do we amp that up?

    I don’t want to have to customize every single taxonomy and, initially, I had the default titles set: %%term_title%% Archives %%page%% %%sep%% %%sitename%%

    This translated into “Dead Archives – LezWatchTV” and that’s pretty good but it could be better. Since I’m talking about character clichés here (characters have clichés and shows have tropes you see), the title could be better as “Cliché Archive: Dead Queers” and that takes two changes. First I rename the taxonomy to “Dead Queers” and second I changed my default titles to be prettier. But that made me think of a couple things.

    Meta Titles: Rated Orange

    If you look at the above screenshot, it shows that I only have an ‘orange’ for a good title. After some fiddling, I determined that Character Cliché Archives for %%term_title%% %%page%% %%sep%% %%sitename%% gave me green results, though not a full bar. The reason here is that the length of what you’re using matters. Meta descriptions should be around 160 characters (Yoast’s crew have seen 135-250) but meta titles are a little odder.

    Before I get too far into that, I have to explain that there is one annoying thing about keywords when it comes to taxonomies. If you have the premium version of Yoast SEO, then you can pick multiple keywords for posts and pages. You can’t do it for taxonomies. That means even though my page is named “Dead Queers” I was going to have to manually give it a custom keyword and handcraft the title.

    I do not recommend this in the long run for everything. And in fact, this is the only place I plan on doing this. I manually made the keyword ‘dead lesbians’ and worked from there. Doing that gave me a different sort of direction, since I got the following message:

    The SEO title contains the focus keyword, but it does not appear at the beginning; try and move it to the beginning.

    Of course. That made perfect sense and I changed the title to start like this: %%term_title%% Character Cliché Archives

    Once I had done all that, I went back and changed the focus keyword to “The big list of dead lesbians.” Now this is not a keyword. But it lets me do this: %%focuskw%% A collection of all queer female TV show characters who have fallen prey to the cliché of %%term_title%%.

    Originally I wanted to make a custom term meta and variable (like I made for %%actors%% and %%shows%%) but I couldn’t get it to output. Since the focus keyword is there to help me optimize things, I don’t see anything wrong with this but …

    Warning: the variable %%focuskw%% cannot be used in this template. See the help center for more info.

    That’s what happened when I tried to set that on the Taxonomies page. And I can see why. It’s frustrating though, since I really do want it just not to show if I don’t have it set.

    In the end, I had to make that page the one with a super custom meta.

    The big list of dead lesbians. A collection of all queer female TV show characters who have fallen prey to the cliché of %%term_title%%.

    We’ll just have to see how that goes. I would much rather make it as flexible as possible, and lot of this would be easier if I was using a specific page and not a custom taxonomy listing. But there are still some limitations when you’re working differently.

  • Genericons Neue

    Genericons Neue

    In 2013 I made a silly little plugin called Genericon’d which let you include Genericons on your site in a theme independent way, complete with shortcodes and flexibility for other plugins and themes that might be using it. In 2016, Generico became Genericons Neue.

    The changes were small but huge:

    1. SVG instead of font icons
    2. No more social icons

    The problem I faced was equally small but huge:

    1. How to seamlessly transition from font icons to SVGs
    2. How to handle social!!?!?!

    Thankfully Automattic actually did the hardest work for me, with Social Logos. I can’t design logos. I didn’t want to abandon people. So for me, to be able to just include a second library in the plugin was a fast and easy fix.

    The long and drawn out one was how to make the plugin magically transition. It took me a month, fiddling with it off and on, but as of version 4.0, Genericon’d defaults to using modern SVGs instead of fonts and combines the Genericon Neue icon pack as well as Social Logos to ensure your old code keeps working. If SVGs won’t work for your site, you can either use classic Genericons or the legacy font packs.

    Genericon'd default settings

    Yeah, I gave everyone ‘options’ while still making default decisions. For the most part, no one needs the old legacy stuff unless they’re supporting IE, so this should work right out of the box for everyone, new and upgrades. My only ‘beef’ is that Social Logos doesn’t have a release strategy, so I’m going to have to randomly check for updates.

    A lot of the work I did to figure this out was just testing variations. I knew that by default I wanted everyone to use the minified, super fast SVG sprites, and by default you do. There are hidden options that would let you use the slower images, but I didn’t build out that interface because of the annoying complexity with setting up “if you have Genericons Neue, make sure you don’t have Genericons Classic!” That was a surprisingly large amount of ifs and elses to make it logically flow. I wanted to have it magically flip things over for you, but in the end I went with an alert if the plugin is active and you haven’t selected things.

    You can also make your load even lighter by not including the social icons, but one thing that’s nice about SVGs over Font Icons is that if you’re not using them, there’s no extra load on the site.

  • Managing User Permissions

    Managing User Permissions

    When it’s just you writing on your site, WordPress user management is incredibly basic. You have one user, you, and you do all the things. If you’re a little neurotic, you have one user who is an editor to write all your posts, and one who is an admin to do the admin things, and you religiously log in as the editor.

    But when you have a site with multiple authors, how do you handle them and their permissions? And what do you do when they leave?

    Lowest Common Denominator

    The most important thing to remember with any CMS or tool is to give users the lowest possible permissions. The people who are admins can do anything so they should be restricted to just the people whom you’ve discussed responsible administration, how to handle things, and who the ultimate top technical boss is. The Roles and Capabilities of WordPress can be very daunting, but the summary is very important:

    • Super Admin – somebody with access to the site network administration features and all other features
    • Administrator – somebody who has access to all the administration features within a single site.
    • Editor – somebody who can publish and manage posts including the posts of other users.
    • Author – somebody who can publish and manage their own posts.
    • Contributor – somebody who can write and manage their own posts but cannot publish them.
    • Subscriber – somebody who can only manage their profile.

    The Administrative

    I strongly recommend limiting your Admin accounts to less than 5. Most people don’t need to be an admin. In fact, the only annoying thing an admin is needed for would be adding new users. Everything else that they can do is, properly, administrative and requires some technical knowhow. You don’t want your copy editor updating a plugin that breaks a site, after all.

    Editors are like your moderators. They can approve posts, edit them, handle comments, and more. They cannot install and upgrade code, however, which is good. Admins (should) have server access, after all, not Editors. If you think of it that way, you may go less crazy.

    The Writers

    Your post writers come in two flavors: Authors and Contributors.

    The difference here is minimal but important. A Contributor cannot publish posts, and more importantly they cannot edit posts once published. That makes Contributor a good role for guest posters, or irregulars. If you need to review and approve every post before it’s live, this is the role for your writers. On the other hand, an Author should be someone you trust won’t go back and make naughty changes to posts after they’re approved and published.

    The biggest ‘flaw’ in Contributors is that they cannot upload files. This can be annoying, I know. If you need more robust tools for your writers, services like CoSchedule and plugins like Edit Flow may be up your alley.

    The Departed

    I don’t mean dead. What happens when your writer quits? You don’t want to delete their posts (probably) but you do want to balance their access with your security. The simplest solution is to make them a Subscriber. This means they can just read and leave comments on your site and nothing more. Their posts will still be attributed to them, but they cannot be edited.

    Of course, it the departure is less than amicable, another solution is to make them a Subscriber, but then change their email and password. If you use Gmail or GSuites, a super quick email fix is to create an alias like blogadmin+username@gmail.com for your users. For example, if the removed user’s login ID is johnsmith then I would create the email blogmaster+johnsmith@example.com and use that to own the ID. This prevents johnsmith from being able to log in and change his password again.

    For cPanel you’ll need to use forwarders and for Plesk you need aliases. Both require setting them up on the server side. Sorry.

    Custom User Roles

    I say this with a heavy heart. Most sites need to stay away from this. The basic five roles will suffice for most situations, and you should really try them for a while before dismissing. Adding in new users roles in WordPress can end with no one having permission to do anything. If you use custom roles, please be very careful and make sure you know how to restore basic user permissions in a pinch.

  • Yoast SEO: Selective Stopwords

    Yoast SEO: Selective Stopwords

    Stopwords are those small words that should be removed from URLs. You know like ‘a’ and ‘and’ or ‘or’ and so on and so forth. They make for ungainly and long URLs and really you should remove them.

    If you happen to use Yoast SEO for WordPress, and you want to disable stopwords, there’s a simple way about that. Go to SEO -> Advanced and disable the feature for stopwords.

    Disable stop-word cleanup, but why?

    If you want to kill it with fire and prevent everyone on your site from being able to activate them ever, you can toss this into an MU plugin.

    add_filter( 'wpseo_stopwords', '__return_empty_array' );
    remove_action( 'get_sample_permalink', 'wpseo_remove_stopwords_sample_permalink' );
    

    The first filter makes the stopwords kick back nothing, and the remove action stops the process from running. You probably only need the second one, but better safe than sorry, I always say.

    But … what if you want stop words removed, but you don’t want them removed on certain custom post types? Welcome to my world! I wanted to remove them from two post types only.

    Enter my frankencode:

    <?php
    
    /*
    Plugin Name: Yoast SEO Customizations
    Description: Some tweaks I have for Yoast SEO
    Version: 2.0
    */
    
    // Unless we're on a post or a post editing related page, shut up
    global $pagenow;
    
    $pagenow_array = array( 'post.php', 'edit.php', 'post-new.php' );
    if ( !in_array( $pagenow , $pagenow_array ) ) {
    	return;
    }
    
    // Since we are, we need to know exactly what we're on and this is a hassle.
    global $typenow;
    
    // when editing pages, $typenow isn't set until later!
    if ( empty($typenow) ) {
        // try to pick it up from the query string
        if (!empty($_GET['post'])) {
            $post = get_post($_GET['post']);
            $typenow = $post->post_type;
        }
        // try to pick it up from the query string
        elseif ( !empty($_GET['post_type']) ) {
    	    $typenow = $_GET['post_type'];
        }
        // try to pick it up from the quick edit AJAX post
        elseif (!empty($_POST['post_ID'])) {
            $post = get_post($_POST['post_ID']);
            $typenow = $post->post_type;
        }
        else {
    	    $typenow = 'nopostfound';
        }
    }
    
    $typenow_array = array( 'post_type_shows', 'post_type_characters' );
    if ( !in_array( $typenow , $typenow_array ) ) {
    	return;
    }
    
    add_filter( 'wpseo_stopwords', '__return_empty_array' );
    remove_action( 'get_sample_permalink', 'wpseo_remove_stopwords_sample_permalink', 10 );
    

    There was something funny to this, by the way. Originally I didn’t have the $pagenow code. Didn’t need it. But when I left it out, Yoast SEO broke with a weird error. It refused to load any of the sub-screens for the admin settings!

    Cannot Load Yoast SEO Admin Pages

    After some backpacking of “Okay, was it working before…?” I determined it was the call for global $typenow; – a global that isn’t used at all in the Yoast SEO source code that I could find. Still, by making my code bail early if it’s not even on a page it should be on, I made the rest of the WP Admin faster, and that’s a win for everyone.

  • Two Forks In The Road

    Two Forks In The Road

    I believe in healthy competition.

    Rivals, professionally and personally, have the ability to inspire us to reach great heights. They also have the ability to be terrible, but when a true rival, who respects you and your work, arrives, they should be embraced.

    The other day I said that I would love to see a W3TC killer. Killer was the wrong word, as what I mean is that I would love to see something as amazing as W3TC that reaches out and tackles caching in a new and inventive way. I’d also love to see a WordPress killer, an iPhone killer, and a Linux killer. And a Hybrid Car killer.

    I don’t mean I want any of those things to fail, I mean I want to see them have a challenger who does what they do, differently, in a way that inspires them to do more and more and better.

    Growth stagnates without good rivalry. When you have a rival who does what you do, and they succeed, you want to succeed. When you’re both healthy rivals, you can carry it even further. Reaching out to your rivals and telling them “I am impressed with how you did X! Nice job!” is the greatest gift. With WordPress code, taking a leaf from their book and forking some of their code (with credit) is another way to hat-tip them.

    In truth, W3TC and WP Super Cache never really competed. They can’t. They have wildly different approaches to just about everything, and they’re not even ‘after’ the same customer base. WP Super Cache appeals to people with it’s simplicity and directness. It works and you can (mostly) ignore it. W3TC has an insanely deep and complex set of tools that works closer to the base level of a server. W3TC has options, oh my god it has options, and they can overwhelm.

    But the real crux to all this, besides the take away that caching is hella hard, is that there is always more than one way to solve a problem. And there is always room for multiple solutions in any ecosystem. It comes down to needs, wants, and user preferences. Both plugins I’ve named here do a great job at meeting the needs for their audiences. And both plugins grew out of someone’s need. Donnacha and Fredrick both created something to solve their own problems. They shared these solutions with the world and became unintentional rivals and kings of caching.

    Okay so back to what I said.

    Should there be a ‘killer’ caching plugin? Will there be one?

    Maybe.

    There should never be one killer app, no matter what it is. There should never be one perfect solution. Mostly because I don’t believe there’s such a thing. There’s nothing we can create that will suit everyone’s needs and wants. It’s statistically impossible. So when we talk about a ‘killer’ anything we never mean that. We mean “There should be options and the options creators should be healthy competition with each other to create some awesome things.”

    And I really truly thing we should do that. I would love to see someone tackle WordPress with a serious self-hosted alternative. Something easier to install on my own than Ghost, but as easy as Hugo or Jekyll to write a post. Something extendable like Drupal, but with better backwards compatibility. Something next. And I want to see WordPress take what it learns from those other tools to become even more.

    Because healthy rivalry between friends and equals is a good thing.