Category Archives: WordPress

Tips and Tricks on WordPress usage and development. I am very passionate about WordPress, but it doesn’t work just by itself – it needs a rich environment to live and breathe in.

If you’re after theme and plugin alterations, we have a category for that.

How to make Gutenberg Galleries link to Media File by default

When you drag more than one image into a WordPress Post, the Gutenberg editor is nice enough to arrange your pictures as a gallery. By default however, the link target of the thumbnails it generates is set to “none”, which means that when users click on your images, they’re not seeing a full size version. Instead, nothing happens.

That’s probably not what 99% of all users expect to happen.

It is possible to change this in the sidebar to either Media File or Attachment Page, however if you’re like me and tend to forget that you need to make this change, or if you’re uploading a large number of galleries, it would be handy to have Media File as the default behaviour.

Thankfully there is a way to enable this with a little hack, courtesy of this Stack Exchange post by Tomas. By adding the following function to your child theme’s functions.php file, Gutenberg will behave slightly differently.

I’m saying it’s a “slight hack” because Gutenberg will now start with a gallery module at the top of your post, with the new default link behaviour set to Media File. Ordinarily the first module is a paragraph module that allows you to start typing, so if you’d like to write some text before showing off a gallery, you’ll have to manually insert one.

It depends on if this is what suits your needs, but I came across this solution and tested successful, thought it might come in handy in the future and sharing it with you and my future self at the same time. There are some other interesting ideas in that post too if you’d like to have a fiddle.

Happy Gallery Linking!

How bring back the missing File Editor in WordPress

Every once in a while, users notice that the File Editor in WordPress may disappear. This has been happening for many years, and although I’ve read about this issue, it’s never happened to me – until very recently. I’m talking about the options under Appearance – Theme Editor and Plugins – Plugin Editor.

When these options are no longer showing up, it’s usually because a measure of security has ben added to your WordPress configuration file. Some plugins do this, but also some other security measures governed by your hosting administrator or server software (Plesk’s WordPress Toolkit for example).

To bring these options back, head over to your wp-config.php file and hunt for the DISALLOW_FILE_EDIT constant. When defined and set to true, the file editors will no longer show up. Set it to false and they should come back.

How to add File Upload Capabilities to the Contributor Role in WordPress

I never noticed this before, but it appears that the Contributor Role in WordPress does not come with ability to upload files to an instance. That’s slightly weird, given that most users will probably assign this role to users who shall be able to write content for a site, and with good content inevitably come images in this day and age.

According to WordPress, the roles included with WordPress are mere examples or “capability collections” so to speak, and we’re free to create our own, or add/remove capabilities from any role if we so desire. I did some digging and found out how that the add_cap() and remove_cap() functions do just that.

In this article I’ll show you how to add the upload_files() capability to the Contributor Role, without the need for yet another plugin.

Continue reading How to add File Upload Capabilities to the Contributor Role in WordPress

Child Theme Wizard – Version 1.4 released

I’ve pushed a new version of my Child Theme Wizard plugin to WordPress today. While the changes are very simple, the implications of this update are rather significant for using child themes.

From time to time, best practices for how to create your child theme change. This has happened several times over the course of this plugins 5+ year life span. Often it is down to users that I get to find out about such changes.

Something similar has happened this time, when Marcin contacted me about a missing variable declaration ($parent_style), without which child themes can under certain circumstances malfunction. The old P2 theme is such a candidate. Marcin left a comment on the original release post for this plugin from 2014 and told me I was missing a line in the code that’s generated. Thank you so much for your help, I really appreciate the heads up πŸ™‚

Now it’s in place, and I can sleep easy again. Apart form this major change, I’ve also taken the opportunity to update the link to the official WordPress documentation for Child Themes, which is in the process of migrating over to developer.wordpress.org. And while I was at it, I also made sure the plugin is now certified to run with WordPress 5.2.

Upgrade from the WordPress admin interface, take a look at the reviews on the WordPress.org, or grab a copy of the code from my GitHub repository. Pull requests are always welcome!

Upgrading existing Child Themes

If you’re previously created your child theme using my plugin, and you’d like to back-port the changes introduced in version 1.4 to your current theme, take a look at your child theme’s functions.php file. It should contain a function like the one below:

Copy the code above and replace the the function you’ve got running at the moment, and it’s like you’ve created a child theme with the current version. This is an optional step, if you feel your child theme is running fine as it is, don’t worry about it.

If you have any questions, please let me know πŸ™‚

How to exchange data from PHP to JavaScript in WordPress

I was involved in writing a small plugin project last week, for which I found myself reading a database value from WordPress (in PHP) that I wanted to use in JavaScript. I don’t do much in JavaScript and it had occurred to me that I had no idea how I should exchange the data.

After some digging I found several posts on this subject, and I found the most straightforward one was by Toby Osbourn. He made me aware of the wp_localize_script() function and gives a brief example. Thanks, Toby!

The function is designed to over localised values for strings to anything that’s printed via JavaScript, but it can really be used for any data we may need. Here’s how I did it:

The PHP Part

This looks more complex than it is, so let’s break it down line by line. Our function is called via the last line here, hooking in to when WordPress calls the footer. The purpose of our function is to insert a bit of jQuery code on the front page, so we’ll begin by making sure that this doesn’t happen when we’re in the Admin Interface. If that’s the case, we’ll simply return without doing anything.

Next step is to initialise jQuery – that’s only necessary if we’re actually using jQuery, so feel free to leave that bit out if you’re so inclined. On this note, WordPress 5.1 only ships with jQuery 1.2.x (no longer supported).

Then it’s time to initialise our own script. In my plugin I have a separate file for that, which is why I’m reading its full path into a variable first ($elv_vanish). To get that full path, the plugins_url() function helps.

Now comes the interesting part: we’re creating an array with two values (random_value and elv_class) and populate them with data. Note the names of the variables in the array, we’ll be able to access exactly those values in JavaScript in a moment. To “transfer” the data, we’ll call wp_localize_script() with three parameters:

  • the name of our own script (elv_vanish in my case)
  • the PHP array we’ve created (elv_data)
  • and a variable we’d like to use in JavaScript ($elv_data to make it easy for my tired brain to remember)

That’s all we need to do in PHP. We’re using an array by the way to enable us to transfer more than a single value. You could use a single variable instead of an array, but an array makes it easy to add values as your project matures.

The JavaScript Part

In order to access our values, we now have an array to play with – namely $elv_data. JavaScript supports dot notation, so any of our PHP array values can be accessed using $elv_data.random_value and $elv_data.elv_class.

It’s super easy – and very exciting I must add πŸ™‚

Further Reading

Show Me The Cookies: How to list all cookies on your WordPress site

I’ve been working on a new plugin for WordPress called Cookies. It shows you a list of all cookies on your current site. Once activated, you can find this list under Appearance – Cookies.

In addition, you can also display this list to your visitors by adding the shortcode [cookies] to any post or page. Many of those cookies are used by WordPress to track things such as “are you logged in”, so I’ve added an option to filter WordPress related cookies out. This list is available with the [cookies-nowp] shortcode.

I’m still putting the finishing touches on the plugin, but I’m planning to submit it to the WordPress repository. For now, feel free to download it from my GitHub repository.

Let me tell you a bit about how this plugin came to be.

Continue reading Show Me The Cookies: How to list all cookies on your WordPress site

Child Theme Wizard – Version 1.3 released

This morning I felt like a bit of coding, and something that’s been on my to-do list for a while was to update my Child Theme Wizard plugin. It’s been making over 10.000 users happy since 2013.

The main reason for the update was to update the compatibility flag with WordPress 5.1 – it was already compatible with the latest version, it just wasn’t explicitly set. On this occasion I found a couple of other items I could improve upon:

  • updated the link to the WordPress Codex about Child Themes
  • verified compatibility with WordPress 5.1
  • updated social media links (added YouTube and Patreon, removed Google+)
  • added theme version to query, as suggested in WordPress Codex

The last item was new to me and doesn’t make a difference to how your child themes are created, however since the Codex suggests to create child themes this way, I thought I’d better follow best practices.

And one final thing I’ve streamlined was the code itself, both in the plugin and in the generated code. It’s now a bit more spaced out, improving readability and updatability (if that is in fact a word).

You can get the latest version either from GitHub, update from within WordPress, or download it from the official WordPress repository.

How to disable the Login with WordPress.com prompt

One of my self hosted WordPress sites kept offering me to login with my WordPress.com credentials. I find that mindnumbingly annoying, since I don’t use WordPress.com (nor can I remember my credentials).

Thankfully there’s an easy way to switch this prompt off. This integration comes courtesy of Jetpack. There’s an option under Jetpack – Settings – Security in which we can turn this feature on and off.

After flicking the switch, this setting is saved automatically and WordPress won’t offer anything other than a regular credentials window at login.

How to remove the Jetpack Feedback Tab

In this episode I’ll explain how we can hide the Feedback Tab that the Jetpack plugin adds to the sidebar of the admin interface in WordPress.

This tab is part of the Contact Form feature, which sadly cannot be switched off with a single slider. We’ll have to delve into debug mode and do it “the hard way” – but fear not, there’s not code hacking involved, and I’ll be with you every step of the way.

How to hide WordPress Update Notifications with ZEN DASH

In this episode I’ll show you how to hide and remove those (almost daily occurring) WordPress Update Notifications. I’ve built this functionality into a plugin I’ve written over 5 years ago called ZEN DASH. The plugin’s main purpose is to hide all kinds of clutter from the WordPress admin interface, such as unused tabs, dashboard widgets, footer attributions – and Update Notifications.

You can install the plugin by searching under Plugins – Add New, or download it from the official WordPress repository here: https://wordpress.org/plugins/zen-dash

The project is also on GitHub: https://github.com/versluis/Zen-Dash