Half-Elf on Tech

Thoughts From a Professional Lesbian

Author: Ipstenu (Mika Epstein)

  • Show Featured Images on Post List

    Show Featured Images on Post List

    Let’s say you want to be sure every single post, in ever single post type, has a featured image. And you know someone might forget but you don’t want to have to open up every damn post to see.

    There are a lot of answers to this problem, and I love that there’s a plugin that will add in a Featured Image Column that shows a teeny featured image. But it wasn’t what I wanted. It was over kill.

    All I needed was a simple check mark for if there was an image and an X if there wasn’t, and that would suit me fine. And I wanted the column to be small, without a lot of fuss or folderol. I wanted something simple:

    My Featured Image Column

    That gives me a fast overview of if everything is what I wanted and where I wanted.

    The Code

    The code itself is the most basic column code, with a little bit of magic to put it as the first column on the list. Since I want to show this on all post types, I used the generic functions.

    /*
     * Show mark if featured image is set
     *
     * @since 1.1
     */
    
    add_filter('manage_posts_columns', 'helf_fi_manage_posts_columns');
    function helf_fi_manage_posts_columns( $columns ) {
    	if ( !is_array( $columns ) ) $columns = array();
    	$new_columns = array();
    
    	foreach( $columns as $key => $title ) {
    		if ( $key == 'title' ) $new_columns['featured_image'] = '<span class="dashicons dashicons-camera"></span>';
    		$new_columns[$key] = $title;
    	}
    
    	return $new_columns;
    }
    
    add_action('manage_posts_custom_column', 'helf_fi_manage_posts_custom_column', 10, 2);
    function helf_fi_manage_posts_custom_column( $column_name, $post_ID ) {
        if ($column_name == 'featured_image') {
            $post_featured_image = helf_fi_manage_column_check( $post_ID );
            $output = '<span class="dashicons dashicons-no"></span>';
            if ( $post_featured_image && $post_featured_image == true ) $output = '<span class="dashicons dashicons-yes"></span>';
            echo $output;
        }
    }
    
    function helf_fi_manage_column_check( $post_ID ) {
        $post_thumbnail_id = get_post_thumbnail_id( $post_ID );
        $post_thumbnail_img = false;
        if ( $post_thumbnail_id ) $post_thumbnail_img = true;
    	return $post_thumbnail_img;
    }
    
    add_action( 'admin_print_scripts', 'helf_fi_admin_print_styles' );
    function helf_fi_admin_print_styles(){
    	echo '
    	<style>
    		th#featured_image,
    		td.featured_image.column-featured_image {
    			max-height: 25px;
    			max-width: 25px;
    			width: 25px;
    			color: #444;
    		}
    		td.featured_image span.dashicons-no {
    			color: #dc3232;
    		}
    		td.featured_image span.dashicons-yes {
    			color: #46b450;
    		}
    		div#screen-options-wrap.hidden span.dashicons-camera {
    			padding-top: 5px;
    		}
    	</style>';
    }
    

    Fork and enjoy!

  • Custom Colors with the Twenty Seventeen Theme

    Custom Colors with the Twenty Seventeen Theme

    In building out a site, I had a cause to use Twenty Seventeen, the new theme for WordPress. I’d tested it before, helping figure out the usability of features. This time I was using it ‘for real’ and as I often say, there’s nothing quite as impressive as ‘for real.’

    Overall, I still find Twenty Seventeen as easy to work with as any other theme I’ve used. Customizing a theme to look like how you want is incredibly weird as it’s always a unique experience. This is to be expected. Themes are difficult when we’re trying to guess what people want. They’re second only to search in complex usability. In my use, I found two places where I felt other themes did things better.

    Documentation

    While there is a technical document on how to theme with Twenty Seventeen there is no walk through. For example, when I use StudioPress’ Genesis themes, every single one comes with a walkthrough of “How to make the theme look like our demo!” Twenty Seventeen has the luxury of the new default content, but even then, it’s not the same as directions. I have to do trial and error to figure out things like how to change the ‘section’ images on the front page.

    Answer? Change the featured image. Of course. That was logical to me because I’m an experienced WordPress user. I can’t say it was logical to anyone else.

    A great deal of the theme makes sense contextually. By which I mean if you look at it, it all follows and you can suss out what’s next. But it’s not perfect. No theme is. I still think if a simple walkthrough doc existed, it would help a lot of first time WordPress users.

    Colors

    About a day into my project, I’d used Twenty Seventeen, ditched it for something else, wrote a lot of custom post type/taxonomy code, and then came back to Twenty Seventeen. By the time I did, I had a very clear-cut idea in my head about what I wanted the base color to be.

    I have to explain it like that because that’s pretty abnormal, I feel. Most people don’t go “I want to use #d1548e as my base color for links and stuff!” They go “I want pink!” The problem here is that if you look at the color tool for customizing colors, it’s a slider. And worse, it’s a slider without an override.

    Twenty Seventeen Custom Color Slider

    Now compare that to the picker you get for the Header text color:

    Twenty Seventeen Custom Color Picker for Header

    Right there I can go in and put my color in hex format and it uses it. Perfect.

    I can guess why they don’t have this for the custom color, though. Twenty Seventeen does something special with colors and instead of just saying “Links are pink and headers are magenta,” it uses saturation. This lets the theme create a dynamic color scheme based on your selection. Which is fucking awesome, right up until you’re me (or you try to use the exact same color schema twice).

    I want to stress that I do not feel this was a bad choice for the theme. Since the theme is going to use math to cleverly calculate out what the related colors should be for the theme, it’s genius to set the colors on a slider. This puts the concept in your head, when you move the slider, that the colors are relative to each other. It’s a perfect example of seamlessly introducing new users to a tool. It’s actually intuitive.

    How I ‘Fixed’ My Color Woe

    First I made a lot of jokes with my buddy James about how they would ‘hue the day’ for this one. Because thats how I roll. Then I dug into where the hell this was set at all. Like all WordPress settings, its saved in the database in the wp_options table, under theme_mods_twentyseventeen which has a value like this:

    a:5:{i:0;b:0;s:18:"nav_menu_locations";a:2:{s:3:"top";i:2;s:6:"social";i:3;}s:18:"custom_css_post_id";i:-1;s:11:"colorscheme";s:6:"custom";s:15:"colorscheme_hue";i:312;}'
    

    Yours may be longer. The important bit is here: s:15:"colorscheme_hue";i:312

    That number, 312, is the color hue! If you change it, it changes the colors. Once I knew that, I had to reverse engineer a hex code into a hue. To do that, I used workwithcolor.com. That site has a color picker, and if you put in the value you want (say d15483 it spits back a whole lot of information.

    The Hue Picker with a LOOOOT of information

    That part I circled, the 337, that’s the important part. I can now go into my database and change 312 to 337 and magically it works.

    But boy that sucks. Instead I used set_theme_mod() to fix it by putting this in my theme’s function:

    add_action( 'after_setup_theme', 'helf_after_setup_theme' ); 
    function helf_after_setup_theme() {
    	$hue = '337';	
    	if ( get_theme_mod('colorscheme_hue') !== $hue ) set_theme_mod( 'colorscheme_hue', '337' );
    }
    
    

    If I wanted to get fancy, I’d put in a real control for it, but this at least gets me started.

  • cPanel and Two-Factor Authentication

    cPanel and Two-Factor Authentication

    I’m talking a lot about security. There are reasons for that. If you’re not keeping your online behavior safe, you’re in for some headaches. Two-Factor Authentication (TFA or 2FA) is one of the better solutions as it protects you by requiring you to have a password and a physical object in order to log in.

    WebHost Manager (the admin part of a cPanel server) has this.

    Let’s Do This Thing!

    Go to WHM Home » Security Center » Configure Security Policies and check the box for Two-Factor Authentication.

    Set TFA for cPanel

    Next, go to Home » Security Center » Two-Factor Authentication and move the slider to enable:

    Enable TFA

    Click on the tab for “Manage My Account” and set up TFA for your root account.

    The Problem….

    Oh there’s a problem? Yeah, and it’s the age old problem of TFA. You can’t enforce it. I mean, you can’t turn it on for everyone and walk away singing the praises of your success. You have to turn it on as each user. That means they have to turn it on. You can’t even require it.

    None of that means you shouldn’t do it. Everyone should do use TFA for their server connections. I use it for my servers and for my Gmail accounts. Protect yourself.

    Extra Credit

    Did you know you could turn on TFA for APIs on your server as well? Yeah.

  • SSL Security: Forward Secrecy

    SSL Security: Forward Secrecy

    Forward secrecy is actually what it sounds like. It forwards on secrecy. This means that the secret keys you have won’t be compromised even if the server’s key gets hacked. The way it works is by constantly changing things. Basically it’s rotating its encryption forever.

    “You’re constantly generating new keys for new messages,” says Nadim Kobeissi, the creator of Cryptocat, one instant messaging app that was early adopter of perfect forward secrecy. That means if a user’s device is stolen or hacked and eavesdroppers steal a decryption key, it doesn’t matter. “The latest message gets compromised, but any message prior to that message or after it can’t be decrypted,” Kobeissi says.

    This is a good thing to have on your own server, as it means if a secure transaction (like an ebook sale) is compromised, only that one instance is impacted. No one else gets hacked. No other part of the sale is affected. You minimize damage considerably.

    Let’s do this thing!

    On Monday we killed off RC4 by going to WHM Home » Service Configuration » Apache Configuration » Global Configuration and changing the cipher suite to this: ALL:!ADH:!RC4:+HIGH:+MEDIUM:-LOW:-SSLv2:-EXP:!kEDH

    In order to properly handle perfect forward security, we have to reorder things. Instead of using ALL, which calls everything, we need to put the ciphers in a preference and omit the ones we don’t want. That gives us this:

    ECDHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA256:ECDHE-RSA-AES256-SHA:ECDHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES128-SHA256:DHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES256-GCM-SHA384:AES128-GCM-SHA256:AES256-SHA256:AES128-SHA256:AES256-SHA:AES128-SHA:DES-CBC3-SHA:HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4
    

    Awesome. Once we set that, and restart Apache, we go to Service Configuration » Apache Configuration » Include Editor » “Pre Main Include” and pick ‘All Versions’ from the drop down. I’ve edited this section before, when adding HSTS support. But then I edited pre_virtualhost_global.conf (“Pre VirtualHost Include”). This is just a different section.

    In the Pre Main Include section, put this:

    SSLProtocol all -SSLv3 -SSLv2
    SSLHonorCipherOrder On
    SSLCipherSuite ECDHE-RSA-AES256-GCM-SHA384:ECDHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA256:ECDHE-RSA-AES256-SHA:ECDHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES128-SHA256:DHE-RSA-AES256-SHA:DHE-RSA-AES128-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA-DES-CBC3-SHA:AES256-GCM-SHA384:AES128-GCM-SHA256:AES256-SHA256:AES128-SHA256:AES256-SHA:AES128-SHA:DES-CBC3-SHA:HIGH:!aNULL:!eNULL:!EXPORT:!CAMELLIA:!DES:!MD5:!PSK:!RC4
    

    This forces the SSL protocol to v3 and then v2, but then it demands the order of the ciphers be honored.

    Restart Apache and you’re done.

    Testing it

    If you want to test, go to ssllabs.com/ssltest and you should see something that says A or A+. If you don’t have it right, you’ll max out at an A-.

    HalfElf.org is A+ Secured

    This site? It’s currently an A+, however that target is always moving. Keep safe out there.

  • SSL Security: Killing RC4

    SSL Security: Killing RC4

    In the middle of debugging what turned out to be an unrelated problem, my friend James pointed out that my server was throwing a warning about the RC4 cipher.

    Ciphers?

    When you want to transmit secure data, you use a cipher to encrypt the data. RC4 is a (hah) cipher. It generates a stream of random bits and bytes (they’re not really random) and combine them with plain text using a pattern to make an encrypted message. The secure connection unravels the bits because it knows the cipher too.

    Ciphers only work if no one knows how to crack them. That isn’t the case with RC4 anymore and it was hacked. Sad news. Time to disable it!

    Disable it!

    Why was it enabled at all? As it happens, it was enabled on my servers for browsers that can only use it. Old browsers. The funny part is that those old browsers can’t support SNI (which is what lets me have multiple certificates and multiple https sites on one IP address), so the domains were broken anyway.

    To disable, I went to WHM Home » Service Configuration » Apache Configuration » Global Configuration and changed my cipher suite to ALL:!ADH:!RC4:+HIGH:+MEDIUM:-LOW:-SSLv2:-EXP:!kEDH

    The !RC4 is the part that says “Not this one!”

    Restart Apache and you’re safe to go!

  • Text Alerts and Email

    Text Alerts and Email

    Sometimes there are specific emails you want to be alerted to immediately. While there are a lot of options for this, like scripting things on the server level, most email tools let you handle this on their end.

    Cautions

    Short email is better. You get 160 characters. So this is a tweet length of stuff. Whatever emails you decide to do this with must be short.

    Be very careful based on how many texts you think you’ll get. If you get too many, you’ll blow through your limits.

    In order to email anything to your phone as a text, you need to know your email address. They all work the same way, in that it’s a phone number followed by an @something – just like normal email. What’s your address? You’ll have to read your network provider’s documentation. Wikipedia has a list of some US carriers that can get you started. If you have the option for MMS, and you know your email has pictures and stuff, use that. But again, you should be short!

    How To

    All you have to do is create a filter for the emails you want to forward. Seriously, that’s it.

    My gmail filter looks for emails with the subject [Mass WP Upgrade] and if found, applies a label, moves to a folder, never marks as spam, and yes, texts me.

    My Gmail Filter

    If you do this you’ll get an alert telling you that if you don’t mark things as spam, you can (heh) spam the hell out of your forward and get in trouble.

    This is pretty much the same as for cPanel, who has incredibly robust filter available. The extra fun is that while you can just use “Redirect to Email” to forward the message, you can also pipe it to a program on your server. If that made no sense to you, don’t worry about it. Just know it’s there.

    If you’re using gmail, you also need to add your text email address as a forwarding address. Don’t Panic!! I know it makes it look like it’ll forward all your email. It won’t. For cPanel and other things, they don’t require verification of the forwarding destination.