Category: How To

Genesis Theme: Anonymize Posts
Actually, I anonymize my pages.

See, I have multiple authors on a site, and one of the things I like is to celebrate them when they post. Awesome. But I don’t want to highlight who wrote the pages on the site. Or who posted the videos. Those are informational and don’t need any ego attached.

When using StudioPress’ Genesis theme, you can edit the post authors by filtering genesis_post_info

The Code
```
add_filter( 'genesis_post_info', 'EXAMPLE_genesis_post_info' );
function EXAMPLE_genesis_post_info( $post_info = '' ) {
	if ( is_singular( array ( 'videos', 'page' ) ) )
		$post_info = 'By the Barbarians [post_edit]';
	return $post_info;
}
```
Now all my posts are by Barbarians!
5 April, 2018
Light Fingered Fish
To explain the joke before we get too far, Jetpack’s contact form was originally called Grunion. The book “Memory” by Lois McMaster Bujold uses the phrase “light fingered fish” to talk about fish who elude hooks.

I was building a site for my father and he wanted the contact form to redirect to another page. Thankfully you can do this with a filter on grunion_contact_form_redirect_url (see? Grunion? Fish?)

The Code

If you use the official code, then you’re going to need to know two things:

1) What is the page ID you’re redirecting from
2) What is the page slug you’re redirecting to

Yes, it’s weird that you have to know those, but … well. That’s what we’ve got. I tried to come up with a reason why, and I think it’s just that searching for posts by slug is hard.
```
function EXAMPLE_grunion_custom_form_redirect_url( $redirect, $id, $post_id ){

    $redirected_urls = array(
        '123' => home_url( 'contact' ),
        '456' => home_url( 'about' ),
        '789' => 'https://wordpress.org/surprise/',
    );
 
    foreach ( $redirected_urls as $source => $destination ) {
        if ( $id == $source ) {
            return $destination;
        }
    }
 
    // If there's no custom redirect, return the default
    return $redirect;
}
add_filter( 'grunion_contact_form_redirect_url', 'EXAMPLE_grunion_custom_form_redirect_url', 10, 3 );
```
Buuuuut what if you wanted to do it by slug?
```
    $redirected_urls = array(
        'contact'  => home_url( 'contact-success' ),
        'about'    => home_url( 'about-success' ),
        'surprise' => 'https://wordpress.org/surprise/',
    );
 
    $slug = get_post_field( 'post_name', $id );

    foreach ( $redirected_urls as $source => $destination ) {
        if ( $slug == $source ) {
            return $destination;
        }
    }
```
The benefit to this is you can change the post ID and, as long as it has the same slug, you’re good to go. Also let’s say you have a bunch of separate contact pages (contact-me, contact-mom and so on). You could use the logic to redirect all pages that have the word ‘contact’ or ‘about’ or ‘surprise’ …
```
    foreach ( $redirected_urls as $source => $destination ) {
        if ( strpos( $source, $slug ) !== false
            return $destination;
        }
    }
```
3 April, 2018
Google Auto Ads
After upgrading my theme, I saw a note that I could add my Google Adsense ID, but “Auto Ads must be enabled in your AdSense account for this feature to work properly.”

Auto Ads?

Auto Ads

A month ago Google introduced a new way to handle ads, and simply that is you don’t have to mess around with placing adds. You put your code in and then you tell Google “Gimme them auto ads!” and they add in … well … ads.

Depending on your options, you can show in-article ads or just section ones, and it comes out looking a bit like this:

Not Perfect

There are some issues with this.

There are obvious pros to this, and mostly it’s that I don’t have to think about where an ad is going to go. I can tell Google “Show a medium amount of ads where you think is best” and walk away. I don’t have to worry about which ads to use. Also they use Google’s ‘what fits with the content’ magic algorithm.

But.

I can’t exclude certain areas.

Which means on one of my sites has an extra hunk of ads in the headers, as Google inserted an ad in each section. And I can’t tell it not to put adds in specific sections. I can tell it not to put ads on specific pages, and with Genesis I can do that from within WordPress, but the options just aren’t quite where I want. Yet.

Setting It Up

Like all
1. In the left navigation panel, visit My ads and select Get Started.
2. On the “Choose your global settings” page, select the ad formats that you’d like to show and click Save.
3. On the next page, click Copy code.
4. Paste the ad code between the < head > and </ head > tags of each page where you want to show Auto ads.
It takes about 20 minutes for ads to show up

If you’re using Genesis themes, upgrade to 2.6 and paste your Publisher ID in the new setting field for Auto Ads, in either the Theme Settings, or the new Customizer panel.

If you don’t want that at all, Gary Jones made a plugin to remove it entirely from Genesis Themes. Though I’d point out you don’t have to use it if you don’t want.
22 March, 2018
Safari and SameOrigin
I was updating a site I’ve been neglecting. Due to reasons, it’s been about four months since I’ve looked at it, let alone done any work. But as I was cleaning up the data, moving ads around, and messing with widgets, I found myself stumped.

Customizer was a blank screen.

Debugging Javascript

Now I happen to know that the WordPress customizer makes heavy use of javascript, so I popped open the console and found this error:
```
[Error] Multiple 'X-Frame-Options' headers with conflicting values ('ALLOW-FROM https://example.com/wordpress/wp-admin/customize.php, SAMEORIGIN') encountered when loading 'https://example.com/2017/post-name/?customize_changeset_uuid=0774a706-2a5b-4700-a8fb-2c294708687c&customize_theme=utility-pro&customize_messenger_channel=preview-0'. Falling back to 'DENY'.

[Error] Refused to display 'https://example.com/2017/post-name/?customize_changeset_uuid=0774a706-2a5b-4700-a8fb-2c294708687c&customize_theme=utility-pro&customize_messenger_channel=preview-0' in a frame because it set 'X-Frame-Options' to 'ALLOW-FROM https://example.com/wordpress/wp-admin/customize.php, SAMEORIGIN'.
```
Right away, I knew that the problem wasn’t Javascript.

Safari is Special

A quick search netted me two possible tickets. First, there’s the problem with customizer failing to load if there was a home/siteurl domain mismatch and second, there’s the issue that customizer fails to load in Safari due to X-Origin Header mismatch.

In reading those tickets, I determined that it was possible that since this site has WordPress in a folder (yes, named wordpress) but runs from the main domain, that could break it. There was also a possibility that NGINX or Apache were set to restrict SAMEORIGIN. Finally, there was the absolutely daft problem that Safari was special and didn’t like extra rules.

Now, since this server runs multiple sites, and only this one was having any problems, I threw out all possible server related causes. I also discarded any Multisite related causes, as the site wasn’t the network. Next I determined it absolutely was Safari, by testing on Firefox and Chrome. That left me with the following probable causes:
1. Some code on my site was breaking customizer
…

No, really. That was it.

The Solution

Two choices here. Figure out what was broken or stop using Safari.

I have reasons for using Safari, so I knuckled down. I searched all lines of my code for anything related to X-Frame-Options and came up empty. I tested by commenting out the relevant lines in WordPress core, which worked, but wasn’t tenable.

Then I changed my search and looked for X-Frame-Options in all .htaccess files, and found this:
```
<IfModule mod_headers.c>
     Header set X-Frame-Options "SAMEORIGIN"
</IfModule>
```
Removed that, and done.

Why Was It There?

I actually put that code in to prevent clickjacking. Clickjacking is what’s called a “UI redress attack.” It happens when a malicious attacker uses transparent or opaque laters to trick someone into clicking a button or a link on page, when they were intending to click another. Usually this is to steal private information.

WordPress already does this for the login page, and for this site, that’s actually the only time ‘private’ data is sent on this site. Which means it’s mostly safe enough to leave be. There are ways I could do this in PHP code, but since WordPress isn’t the only tool on the site, it’s harder to maintain.

The better fix would be to, with Apache or NGINX, check the domain and URL, and only apply clickjacking when I’m not in Customizer.

Of course I have no idea how to do that. Yet.
20 March, 2018
Remoteless SVG
I spent about half a year working on being able to remote load my SVG, and I wanted to for a few reasons:
1. Having only one place to update my icons is more efficient
2. They don’t need to be in code versioning control (like GitHub)
3. Licensing (not all are free)
I solved those problems when I finally figured out SVG Injection (via javascript) and CORS to allow the scripts from my objects.

It’s not all lollipops and sunshine

However. There was, and is, one really big issue. The icons being remote mean if the remote server isn’t accessible but my site is, I got no icons. Now, the smart dev in me knows that I should have a check. If the server is up, use the icons remotely. Otherwise, use a fallback.

There was one big, and in the end insurmountable, problem with that. There was no way to do that without slowing my site down, which was the headache in the first place. If I check the uptime for every icon on a page, the site went from a 1 second load to up to 20 seconds. In the best solution, I added 2-5 second load to every page checking if the server was up on every page load. Which is kind of the problem with wp_remote_get() in the first place.

Make ’em local again

This meant the ‘best’ solution was to make them local. Again. Yaaay.

But I really didn’t want to have them stashed in GitHub. I wanted my ‘base’ to be the cloud storage, and then that needed to sync. Normally I would use rsync for that but you can’t rsync from CEPH storage.

Don’t panic. There are answers.

Boto-Rsync

If you’re on DreamPress or any DreamHost server, they’ve forked boto-rsync and (if you set up a .boto file) you can do this:
```
boto-rsync --endpoint objects-us-west-1.dream.io s3://my-cool-icons/ /home/my_user/mydomain.com/wp-content/uploads/my-cool-icons/
```
Using cron or some other scheduling tool, setting up a server to run that at regular intervals isn’t too terrible.

AWS CLI

There’s also the option of AWS CLI, which is very similar, only it’s actually maintained. The advantage with boto-rsync is that it’s installed on the servers at DreamHost. If you have AWS CLI on your server, you can do this:
```
aws s3 --endpoint-url https://objects-us-west-1.dream.io sync s3://my-cool-icons/ /home/my_user/mydomain.com/wp-content/uploads/my-cool-icons/
```
Keep in mind, you need to configure this either with aws configure or an ~/.aws/credentials files.

Pushing from the outside inside

You may have noticed that, unlike rsync, I can’t tell it to push to another server. That is, I can say “sync files from server A to server B” with rsync and I can’t with either boto-rsync or the AWS CLI.

And no, you just can’t.

Unless you use rclone. Which is a little messy but totally do-able.

There’s one other option though… I’ve been using Codeship to push code. That is, every time my GitHub repos update, it triggers a Codeship deploy. And in that deploy I usually just say “Rsync a git clone, k’thnx’bai.”

Now I tell it this too:
```
# Download from S3
pip install awscli
aws s3 --endpoint-url https://objects-us-west-1.dream.io sync s3://my-cool-icons/ ~/my-cool-icons/
# Copy up to Server
rsync -avz -e "ssh" ~/lezpress-icons/ USER@DOMAIN:/home/USER/DOMAIN/wp-content/uploads/my-cool-icons/ --delete
```
I will note there’s one extra trick. You have to add Environment Variables for AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY on Codeship.

This works for me since there are few times I push an icon without also making some code changes to the server code anyway.

Hopefully if gives you some directions.
15 March, 2018
Reordering Facet Displays … For Death
Isn’t that a catchy title?

I’m using FacetWP to help me order and sort archives in ways that are reflective of the content. One of the things I sort are characters (yeah yeah yeah) and some of those characters are dead. It occurred to me that wouldn’t it be nifty if I could sort the characters by when they died?

There was just one problem. Actually there were two. One was Sara Lance, and she’s my personal demon. The other was my own stupidity and lack of foresight. Neither were insurmountable.

How FacetWP Changes Sort Order

Before I get into the weeds, let’s have a moment to talk about sort order. FacetWP has a way to filter the sort orders.

So for an example, I have post meta value for the number of characters saved as lezshows_char_count for all shows. If I wanted to sort shows by the most characters to least, I can add this in:
```
$options['most_queers'] = array(
	'label' => 'Number of Characters (Descending)',
	'query_args' => array(
		'orderby'  => 'meta_value_num', // sort by numerical custom field
		'meta_key' => 'lezshows_char_count', // required when sorting by custom fields
		'order'    => 'DESC', // descending order
	)
);
```
It looks very similar to WP_Query and that’s what makes it easy. Except for my two problems…

Problem One: Formats

The first problem was not the Sara Lance problem. It was the ‘Mika didn’t think about things 4 years ago’ problem. I was saving the dates of death in the format of MM/DD/YYYY

If you’re an American, you’re wondering “So what?” and if you’re anyone else, you’re giving me a death glare because “08/05/2010” could be August 05 OR May 08, and damn it, I knew better. For what it’s worth, the output on the front end is always “05 August 2010” but that’s not here nor there.

You see, the issue isn’t that I was using stupid date/time formats, the issue is sorting.

In the previous example, I have an order of meta_value_num which is literally a number. What’s the one for dates? You get meta_value_date or meta_value_datetime and neither of them work with the date format I’d chosen.

So for this to work, I had to go and change everything from MM/DD/YYYY to YYYY/MM/DD – Not fun, but doable. And it led me to my Sara Lance Drama…

Problem Two: Arrays

How many times has Sara Lance died? Right now, three.

When I decided to sort by the date of death, which one did I pick? Long pause.

I decided to pick the last one. That is the most recent death. If someone’s actually still dead, the most recent death is the one that stuck. If they’re not, then death was pretty arbitrary to begin with and there ya go.

The question became how and where did I save the death? I went with a post meta of lezchars_last_death and had it auto update on post save, like this:
```
add_action( 'save_post_post_type_characters', 'characters_update_meta', 10, 3 );
function characters_update_meta( $post_id ) {

	// unhook this function so it doesn't loop infinitely
	remove_action( 'save_post_post_type_characters', 'characters_update_meta' );
		
	// get the most recent death and save it as a new meta
	$character_death = get_post_meta( $post_id, 'lezchars_death_year', true );
	$newest_death    = 0000-00-00;
	foreach ( $character_death as $death ) {
		if ( $death > $newest_death ) $newest_death = $death;
	}

	if ( $newest_death !== 0000-00-00 ) {
		update_post_meta( $post_id, 'lezchars_last_death', $newest_death );
	}

	// re-hook this function
	add_action( 'save_post_post_type_characters', 'characters_update_meta' );
}
```
If there is a latest death, we get to set it as the YYYY-MM-DD value and off we go. But…

Problem Three: Orderby Hellscape

Surprise! I ran into a third problem! Remember how I was using the orderby of meta_value_num in my example? And I mentioned that I wanted to use meta_value_date or meta_value_datetime to sort by date?

Yeah no.

If I’d converted the date into unix time, sure. But I was reusing this logic in a couple places, and I didn’t want to re-save everything like that. I also use a query to grab all deaths in a year, and basically I do need to keep it with the format I have. That just messed up my sort until I found the magic of orderby' => 'meta_value',

End Result?

It works. It’s got yet another post meta, which I’m not super happy about, but sometimes that’s really just the simplest way to solve a problem. The data is always updating itself, and it’s relatively easy for me to tweak it. Also now I can do a lot more searches in different ways.

Since I don’t have to worry about database size at the moment, nor speed, since I’ve designed it well, this works for me.
8 March, 2018