How-To: Add Minimal-UI Viewport Meta Tag to WordPress

Introduced with iOS 7.1

I don’t have an iPhone, but my daughter does have an iPad Mini, which is running the latest iOS, 7.1. However, this only works for those of you on iPhone’s, so I see no difference.

Martin Wolf was kind enough to let me use the image from his post about this subject so that I could more easily illustrate the difference. So, even if you don’t have an iPhone, you can still see the changes this makes in the featured image above.

With the release of iOS 7.1 (and possibly late 7.0.x builds), Safari introduced support for a new value in the viewport meta tag. To me, it sounds like it adds effects similar to how Chrome hides its top bar when a page is loaded, but more. For example, the navigation buttons at the bottom are hidden.

I rarely use Safari, like never. Chrome is available on iOS, so that’s what I’ve always used. That’s not to say that you shouldn’t support Safari to it’s fullest, because I’d wager that a majority of iOS users stick with the default, which is Safari.

Chances are, your theme already has a viewport meta tag defined in it’s header.php file. If it does, add minimal-ui to it, so it should look something like this:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui" />

If your theme doesn’t already have a viewport meta tag set, you can add one with your functionality plugin or theme’s functions.php file like so:

function set_viewport() {
<meta name="viewport" content="width=device-width, minimal-ui">
add_action('wp_head', 'set_viewport');

Adding the code above will add a brand new viewport meta tag for you, so only use that if your theme isn’t already using a viewport meta tag in it’s header.php file.

That’s it!


WordPress: Sending Correct HTTP Status Code on Login Failure

For some reason, WordPress will send a 200 HTTP response status code, or OK, when a login attempt has failed. Why not send a 403 status code, which is designed specifically to say you can’t be here, or forbidden, actually. There’s even a better alternative to 403, but stay with me.

I came about this bit of information while reading this post by Konstantin Kovshenin. And was able to confirm it myself by logging into this site incorrectly, as you can see in the featured image above. wp-login.php is returned as 200 OK and is circled in red.

So, as Konstantin suggested, we can use this code to send a proper 403 Forbidden status code on a failed login attempt:

function my_login_failed_403() {
    status_header( 403 );
add_action( 'wp_login_failed', 'my_login_failed_403' )

But why send a 403, which is Forbidden? It’s not truly a forbidden page, as people have a legit reason to be there, even if they can’t remember their password.

So, sending 401 Unauthorized as the HTTP response status code may be even better.

function my_login_failed_401() {
    status_header( 401 );
add_action( 'wp_login_failed', 'my_login_failed_401' );

So, you can use either of those, the first chunk to send a 403 Forbidden response, and the second for sending a 401 Unauthorized response code.

On login failure, send "401 Unauthorized" or "403 Forbidden" HTTP response code?

View Results

Loading ... Loading ...

Either could go in the functions.php file for your theme, or more likely, in your WordPress functionality plugin.

You can find a good list of HTTP response codes at the Mozilla Developer Network site.


Auto-Enable Threaded/Nested Comments in WordPress

Threaded comments let people reply to each other

In theme or functionality plugin

You can auto-enable nested comments in your theme’s functions.php file or in your functionality plugin. Just use the code below.

function enable_threaded_comments(){
 if (!is_admin()) {
  if (is_singular() AND comments_open() AND (get_option('thread_comments') == 1))
add_action('get_header', 'enable_threaded_comments');

That’s all there is to it. Threaded/nested comments will automatically be enabled, so you won’t have to turn them on in the WordPress Dashboard like you normally would.


Add HTML To The End of Every WordPress Post

Great for signup forms or affiliate links

I don’t place the DigitalOcean affiliate link manually at the end of each post. That’s because it’s super easy to do with add_filter('the_content').

Add The Message, With or Without HTML

function add_post_bottom_content($content){

    $html = '<span class="post-footer-message"><a href="" target="_blank">Thanks to our sponsor for the generous donation!</a></span>';

    if( !is_page( ) && isset($html) ) {

        return $content . $html;

    } else {

        return $content;



add_filter('the_content', 'add_post_bottom_content');

To disable the content, just empty the $html variable .


The anchor tag is wrapped in a span with a class of post-footer-message. You’ll want to style your message with that, rename the classes if you want, just stay consistent with the naming.

Some basic styling, with no underline on hover:

span.do_link a:hover {

As long as you have some basic CSS knowledge, you’ll be able to apply all the styling you need. Just remember to add your CSS to your child theme’s style.css file, or load up the custom CSS file.

The code in this post can go in your theme’s functions.php file or in your WordPress functionality plugin.


Creating A WordPress Functionality Plugin

Keep your customizations in place, like that driftwood up there

A functionality plugin is a WordPress plugin that is specific to your site, and contains the additional functionality you need your site to have. This is a much better option than adding features to your theme’s functions.php file, because it allows you to change themes at will, yet keep your customizations via the plugin.

WPCandy has a great write-up on creating a functionality plugin and does a great job of explaining why you’d want to use one, and also what kind of things belong in a functionality plugin. Here’s one of my favorite pieces from that WPCandy article:

To decide what belongs in a functions.php file and what belongs in a functionality plugin, think long term. Rather than thinking about how your website will look and behave this week, think about how it will look and behave five years from now. With few exceptions, I bet all of our sites will have new and upgraded themes in five years’ time.

If a feature is theme-specific, such as sidebars or menus, is should go into your functions.php file. If the feature interacts with content of any type, it belongs in a functionality plugin.

Creating The Plugin

This piece is so easy, we’re essentially creating our own WordPress plugin. First, create a new folder called functionality-plugin. Create it inside the plugins folder for your WordPress site.

Next, we just need to create the PHP file and save it in the functionality-plugin folder. Your plugin needs to have some specific content in the comments at the top of the file for WordPress to recognize it as a plugin, you can see those in the functionality plugin example below. Our functionality plugin will load a JavaScript file that your site relies on ALL the time, no matter what theme is currently in use.

Plugin Name: Tyler's Functionality Plugin
Description: Everything to run my site.
Version: 1.0
License: GPL
Author: Tyler Longren
Author URI:

function load_site_scripts() {
    // load javascript
    wp_enqueue_script( 'photo-service-script', '' );
add_action( 'wp_enqueue_scripts', 'load_site_scripts' );


So, with that, as long as this plugin is enabled, your site will always load that necessary JavaScript file,

You can safely use that code as a starting point for your own functionality plugin. Just make sure to save that code in the functionality-plugin folder.

The filename doesn’t matter, just make sure to save it with a .php extension. Navigate in your web browser to your WordPress Dashboard, go to Plugins, and enable your plugin just like you would any other plugin. That’s it!

Really, most of what I know about functionality plugins came from Ryan Imel and his article at WPCandy, so a LOT of credit is owed to Ryan.

Do you use a functionality plugin?

View Results

Loading ... Loading ...

There’s this plugin at, too, called Functionality. It’s essentially a plugin for creating a functionality plugin it looks like, but I’m really not sure. Anybody used it before? Comments are open below.