Enqueue Script Relative to PHP File

The Customizer Library is package of helper classes and functions that developers can use in their themes. Since I don’t necessarily know what the folder will be named or where it will be located in the theme- any javascript needs to be loaded relative to the file that enqueues it.

To do that, I use this trick to determine the URL for the script relative to the file:

$file = dirname( __FILE__ );

// Get the URL and path to wp-content
$content_url = untrailingslashit( dirname( dirname( get_stylesheet_directory_uri() ) ) );
$content_dir = untrailingslashit( WP_CONTENT_DIR );

// Fix path on Windows servers
$file = wp_normalize_path( $file );
$content_dir = wp_normalize_path( $content_dir );

$uri = str_replace( $content_dir, $content_url, $file );

* This snippet was updated 02/11/16 based on code from Duluxe Blog Tips, which fixes issues with relative loading in Windows server environments.

Of course, if you do know the path to the JS file, it’s recommended you use:

wp_enqueue_script( 'example-script', get_template_directory_uri() . '/path/example.js' );

And this is just for themes. If you’re doing this in a plugin, you can use:

wp_enqueue_script( 'example-script', plugins_url( 'path/example.js' , dirname(__FILE__) ) );

Hope this helps!

Social Menu Links

I (like most everyone) have number of social profiles spread across the web. Facebook, Twitter, Instagram, GitHub, etc. I tend to think of my website as my “home” on the web- it’s the only place I have complete control over the content, design and functionality. But I like to link to these other sites so folks can find me and engage there. For most brands and companies this is an essential requirement for their website.

icon-examples

There’s a number of ways for users to add social links. The simplest is to use the default WordPress menus and have text links. These can be added in a menu area or a widget. There’s also a few plugins that have purpose built widgets or absolute positioned icons that can work with most any theme.

But in most cases icon links in the menu are the best option for linking. Icons don’t take up much space and they’re immediately identifiable.

If a theme doesn’t support social icons by default, there are a couple plugins that allow you to use icon sets by adding classes to menu. Font Awesome 4 Menus is one. But since this is such an essential feature for most sites, I think it’s great when the theme itself handles it. This ensures that the icons used also match the rest of the theme design. Continue reading

Customizer Library

I’ve been working on a new project called the Customizer Library. It’s a collection of classes and functions that make it a bit easier to develop for the WordPress Customizer. It also includes helper functions for Google fonts and inline styles- though I’m considering moving these off into their own repositories as they might not be needed for all projects.

I’ve created a GitHub repository for the Customizer Library that can be included in a theme/plugin as a submodule. I also created a demo theme with example code so developers can get a quick idea of how it works and what it does. I’ve tried to document as much as possible on GitHub- so view the readmes there for implementation details.

screenshot

I think the reason the Options Framework has been so successful is because it reduced a really complex task (developing an options page) to a really simple task (defining an array). It abstracted the complexity of adding an admin page, generating field markup, sanitizing the data, and saving the options.

The WordPress Customizer is simple in comparison. There’s just one spot to load the controls and WordPress handles the generation of field markup for the most part. But it still doesn’t provide a default data sanitization and the syntax is more complex than it needs to be. Continue reading

Theme Shop Directory (2014)

Last year I published a list of independent WordPress theme shops ordered by Alexa rank. Since then a number of new ones have opened up, a few have closed doors, and a couple have rebranded or changed hands.

I thought it would be interesting to look at these numbers again to see how the independent theme market has changed over the year. I updated the ranking table and posted the new information at the bottom of this post.

Directory

Alexa data isn’t necessarily correct as it is based on traffic estimates. It also doesn’t indicate anything about actual revenue numbers. So the “data” here should definitely be looked at with skepticism. It is, however, one of the few independent measures we have to rank websites.

The biggest takeaway for me is that the Alexa ranking for all the top theme shops improved significantly. Every single shop in the top 25 is doing better than last year. I think this shows a continued interest in commercial themes and that well established shops are likely benefiting the most. Continue reading