On today’s episode, we continue the topic of things that we need to test that we may overlook on launching a WordPress website, and today we’ll talk about shortcodes, right here on Your Website Engineer podcast, episode No. 372.

Hello, and welcome to another episode of Your Website Engineer podcast. My name is Dustin Hartzler. I’m excited to be here with you like I am every single week. It’s always fun and exciting to get behind the mic and just spend some time each week, diving in and figuring out what’s going on in the WordPress space. There isn’t a lot of news this week, so I’m bringing you some random type articles that I found across the web talking about WordPress.

The first one that I want to talk about is from pippinsplugins.com. And this is the 2017 review. Pippin likes to do this every year. He’s done it all the way back since 2012, and he just gives a year in review post. And he shows a little bit about – from the personal side and his business. So, if you don’t know who Pippin is, he is a guy that lives out in Kansas, and he is the lead developer or the CEO of Sandhills Development. And that is the company that does Easy Digital Downloads, AffiliateWP, and Restrict Content Pro. And so, he just talks about some of the things that he’s doing within his company, how they’ve grown, and whatnot.

It’s this really great article. I’ve got that linked into the show notes, so you can see what a distributed company does, and kind of what it looks like, and how they’ve grown over the past year. It’s a really nice article, and just kind of great to see what other companies are doing. From being in the Automattic space, you see how 600+ employees work together. This is kind of neat to see – a 25-ish person company or smaller, and how that works within WordPress space.

The other thing that I want to talk about today is Gutenberg 2.0 is now available. This was launched on January 12th, and it is the first big update across the board. I mean, it just continues to go from – it was 1.9 and now 2.0. It’s not like it’s quite ready to launch yet. We still have a couple more months of Gutenberg development, but it’s – talks about the things that have been changed and tweaked, and I mean, there’s a list of probably 35 or 40 things – 50 things, probably, as you continue to scroll, and see all the bug fixes, and whatnot. So, if you haven’t tried Gutenberg lately, or if you haven’t tried it at all, I recommend installing on a test site.

And whether you’re using Local by Flywheel, or Desktop Server, or any one of those tools, or just even use your shared hosting environment and create a test site, I highly recommend just checking out and seeing what it looks like. You’re going to see that the experience is very much like using the customizer, but it’s going to be for your posts, and your pages, and whatnot. So, I’m really excited to see Gutenberg, and see what theme developers and plugin developers, how they use it, and how they can make it better, and just make that whole experience much easier for a new WordPress user. So, that’s something that I wanted to share.

Another thing that I wanted to talk about is if you are in the space where you’re referring clients to WordPress.com, whether that be using Jetpack, or WooCommerce, or WordPress.com for business, or whatever the case may be, if you head on over to refer.wordpress.com, you can apply to be a membership – or apply to be a member, and you can earn rewards. And it’s basically an affiliate program where you can start making money when you recommend people to buy premium upgrades for WooCommerce, Jetpack, or Wordpress.com. And so, if you’re interested in that, you can sign up to be a member. And I don’t know a whole lot about the process. We’re not allowed to do that as employees of Automattic, but it’s a great way to start making some money through the affiliate program. So, that’s really nice.

And then, lastly, WooCommerce this week launched Stripe 4.0, and this is a huge release. It’s been worked on for many, many months. We’ve been testing it for a long time. And Stripe is the most popular – or one of the most popular payment service providers for the e-commerce stores, mainly because it works really well. The API is really great. It integrates really nicely. It works – I mean, it seems like it works better than PayPal. But this 4.0 version comes out with lots and lots of features. It’s fully backward compatible for 3.1 and 3.0. And it improves Apple Pay, so Apple Pay works better.

It’s a simpler way to connect a WooCommerce with Stripe. It’s fully PCI credit card compliant on your checkout form, and now they have payment acceptance using European and other none U.S. payment gateways. So, tons, and tons, and tons of stuff that’s out there and it works. And it’s exciting to see all these new features come to WooCommerce.

In the “Is there a plugin for that?” section, there’s always plugins for that. And this one actually came – I found this one through Automattic, and people are starting to recommend this as we do live chat and tickets for WooCommerce customers, or even Jetpack customers, and WordPress.com – the folks that are using the business plan over there. But this one is called Health Check, and it’s been written by – it says it’s written by the WordPress org community, and it’s basically some of the developers at Automattic. But this plugin will allow you to perform a number of checks on your WordPress install, to detect common configuration errors or known issues.

It checks PHP and MySQL versions. It looks at some extensions which are needed in – to improve WordPress or WordPress.org services that are acceptable – or accessible to you, just pulls in information from PHP and gets all the information about what’s going on in your website. And it allows you to troubleshoot a WordPress vanilla session, where all your plugins are disabled, and the default theme is used, but only for your user. This is probably one of the coolest features. All the time, we’re seeing hey, can you go and turn off all plugins except for WooCommerce and whatever plugin that they may be getting troubleshooting help with, and change to 2017 or the storefront theme. Well, they could do all of that, but that really creates chaos when you’re doing it on a live site.

Here, if you do this, it only affects the user that’s logged in right at the right time. So, they can turn all the plugins off, and then I could be looking at their site, and I would see everything as it normally looks, but the customer, or the user, or their selves could see everything in the default state. So, that is really cool. And that’s probably one of my favorite features of the Health Check plugin. You can find the Health Check plugin on the WordPress repository, or you can find a link to it in the show notes for episode No. 372.

Today, we’re going to talk about shortcodes, and shortcodes are probably one of my favorite, or probably one of my top five favorite things, if I were to list them out in WordPress. And it’s just because they’re so useful, and they’re so cool, what they can do. And if you’re brand new to WordPress, or haven’t even experienced what a shortcode is – what a shortcode is, is it’s basically a way to write code without writing code. It’s a short code. And basically, what this looks like is they normally always have brackets around them, the square brackets. And it’s sometimes like a square bracket, and then some sort of word, and then square bracket, and that spits out a shortcode. Or, sometimes they’re like square bracket, a shortcode, a square bracket, and then you wrap your text, and then you close it with another square bracket, and square bracket.

So, there’s a couple of different ways to use them, but shortcodes are very, very handy. They work really, really well. And it just allows you to add things like – even things like grids or – a pricing grid, or different columns, or maybe even some sort of slider. All kinds of plugins use shortcodes, and generate shortcodes to put information on a screen without having to actually write code, or have some sort of WYSIWYG builder built in for you to kind of generate what you’re looking for. So, shortcodes are something that you may overlook when you are launching a website, especially if you’re rehashing a website from before. Maybe you’ve missed some of the shortcodes that were in the old theme, and now they’re not working in the new things. So, we’re going to talk about these. We’re going to talk a little bit about some of the things that shortcodes are good for, and what to look for when you’re launching a new website.

The first thing that I want to say is you want to know when to use shortcodes and when not to use shortcodes. You don’t necessarily want to have a shortcode in every single post because what if some day you want to change things, and then you have to go back, and you have to edit every single post? There’s ways about adding to certain pieces of code to a theme, so they automatically show up in every theme, and you don’t have to rework a shortcode or add a shortcode – things along the lines of meta content, or maybe a footer that goes at the bottom of every post, you don’t necessarily to shortcode for that. You could just build that into the theme, and you can – when you update the theme, or you change the theme, then you can just make that modification there.

What you want to use shortcodes for is simple things like – I know that I built one for my wife, when she wants to sign off on her blog posts, and she wants to write Dr. Hartzler underneath it because she’s a pharmacist, and she just wants to sign off that way. And I just made a shortcode where it’s in brackets, and she puts D-R-H for Dr. Hartzler, and that spits out a – it spits out Dr. Hartzler in a kind of a scripty type font. So, she doesn’t have to figure out okay, how do I make this font? What classes do I use? What CSS I use – things like that.

I use one on yourwebsiteengineer.com for the transcripts, and the for the transcript – all the information that I display, or how it’s in kind of that scrolling box, and I put the header above it. And it works really well because a couple times, the folks that do the transcription service, which they do completely for free as a – I’m like a sponsor – they’re sponsoring the website to do the transcripts for each episode. But occasionally, they want that updated, and they want that change. And so, all I have to do is I go into the shortcode code, actually look at the code, and I fix what they want, or make the change there, and then every website, or every post on my page is automatically updated with the new information for the shortcode. So, that’s really, really powerful. You want to know when you want to use those.

So, you’ll see in the show notes for episode No. 372, I use shortcodes to wrap the code text. So, I have a special way that code is displayed on my website, and that’s all wrapped in shortcode. So, I put square bracket, code, square bracket, and then I type in all the text that I want, and then I close that with another square bracket, slash, code, square bracket. And that will allow my theme to style things exactly the way I want it. So, you just kind of have to know when to use shortcodes, and when not to use shortcodes.

The next thing about shortcodes is you have to future proof them. And what do I mean by this? I mean that when you create a shortcode, if you add it to your theme, or if it already comes prepackaged with your theme, and you start using these shortcodes everywhere, and then some day you change to another theme, well, all of that code that renders to the shortcode to make it do whatever it does, then that’s in the theme itself. And then, it’s going to be broken, even when you do some troubleshooting and you turn the – you go to 2017, or you look at the storefront theme, or whatever, and then all of the pages that have shortcodes are going to be broken because it’s all based on the theme.

The best way to do this – and I love promoting this and just talking about putting in a custom functionality plugin. It’s a simple plugin that you write, and then you just paste in all the shortcodes. I mean, I have a custom functionality plugin for YourWebsiteEngineer.com. It’s just called shortcodes. And there was some shortcodes that I was using with my old theme with columns, and then I just copied all of that out of the old one, then I put it into this plugin, and now the columns support – I don’t think it works anymore because I’ve changed the way that I do columns, but it all worked very, very simply, right away.

When things are in plugins, you can also turn them off. So, if you’re having some sort of – you’re testing something, you want to make sure that your shortcode code isn’t messing up some sort of output from – that’s happening on your website. Then, you just go, and you can turn off your plugin, and you can – once it’s turned off, then your shortcodes won’t render, but you can make sure that that’s not the case of the problem. So, you want to future proof those shortcodes.

Another tip is you can search your shortcodes within a WordPress theme. So, you can search for them, and you’ll basically open up a theme file, and you start searching for anything that has – add_shortcode is the text that you’re looking for. You’re looking for that, just to see what’s in there, what’s in the theme, and then you can take that code, like I said, and you can put it in that custom functionality plugin. Once it’s over there, then it’s always going to work, and it’s always going to continue to render properly, when you change themes someday, or you’re doing some troubleshooting, or you’re testing, or whatnot. So, that’s how you search for it. You look for anything that’s got the add_shortcode. And if you’re looking for that in the future, that’s all in the show notes as well.

Another thing that you have to do is sometimes you have to future proof your sites for your customers or your clients, if you’re building it for clients. And you have to turn on the ability to use shortcodes in widgets. By default, for some reason in WordPress, it’s not turned on. And there is one line of code. It’s just a add filter that you have to add. And you have to say, do_shortcode. You’ll see the link in the shownotes, but that basically, you need to add that, so that shortcodes work in your widget area. Otherwise, it’s not going to work, and you’re just going to see the shortcode. And you’re like – you’re going to be scratching your head like, did I spell it right? What’s going on? Well, that’s the case. You always have to – you have to enable shortcodes to work inside of widgets. So, that’s the next tip, when it comes to checking out widgets, and making sure things work okay.

Another thing you can do – and this probably isn’t something that you overlook, but this is something that you do when you are launching a website, and maybe you want to have some – you’re using some plugin, and it only outputs things with a shortcode. Well, if that’s the case, then you might need to put that code somewhere. You might want to add a shortcode into maybe your archive page, or you want it on your contact form template page, or whatever – hundreds of examples here. But in order to do that, you have to run a little bit of code, and you have to echo_do_shortcode, and then you put the shortcode in parentheses. You’ll see this in the show notes. But you basically – that’s a way that you can write in PHP to execute or run that shortcode. That’s a little bit of an advanced thing, and you probably won’t be needing that, but I just wanted to point that out there real quick as well.

Moving along, you want to check your website when you’re getting ready to launch or you’re testing. You want to see if there are any shortcodes that are broken. Maybe they are legacy shortcodes. Maybe there are some sort of conflicting shortcodes. There’s a ton of reasons why a shortcode may or may not work. And so, you want to go ahead and peruse your site to look for any shortcodes that are just abandoned. And those will look like – anything that’ll have square brackets around it. So, if you’re talking about a red_widget as your shortcode, you’ll look across your website. On the frontend of your website, just browsing, going page, to page, to page, looking for anything that’s got a square bracket, red_widget, square bracket.

If you see that, then there’s some code that you can – again, another one liner, a one-line piece of code that you can add to just basically turn off all of those shortcodes. And it’s going to render them useless, and so you don’t have to go in – maybe it’s something that appeared on every single page, and you don’t want to go back right now and edit every single post. You’ve got hundreds of posts. Then, you can just go ahead and add this one line of code, and it will just deactivate that shortcode. And it won’t even output, which is really cool. I didn’t know about this. This is something new then, that I didn’t know about. And then, the next one is new too.

Another tip that I found, as I was compiling all of this information for the podcast, but you can also use a bit of code – and this one is 30 lines of code, and so it’s a little bit longer, and it’s in the show notes, of course. But this basically, you can drop into your functions.php file or your custom functionality plugin, and it will go, and you can add a shortcode finder. So, you’re looking – you add a shortcode to a page, it’s going to go out, and query, and find all of the posts and pages that have that specific shortcode in them, and then reference where they are. So, maybe you want to go in, and you want to just remove all of those by hand. And you want to go in and look for all of them. Then, you run this – you add this code, and it’s going to go ahead, and it’s just going to find all of them for you.

So, you can set this up. It’s really pretty nifty. You can go in and have just a page that’s looking for all of the one – maybe _half, so anything that using the column shortcodes, or maybe you have a contact form that’s an old version of a contact form that you’re trying to get rid of. And this is kind of a page that goes and does all the heavy lifting for you. It says, oh, it’s on this page, this page, and this page. And then, you can go to your WordPress dashboard, and you can go ahead, and fix, and remove those shortcodes. So, you could do it that way. You could always go into the WordPress database, and do some manipulation and stuff there. I find it’s always a little bit harder to search, and replace, and get exactly what you want right from the database. But this little bit of code will allow you to find things in posts, and you can go ahead and fix them right away.

So, that’s in a nutshell, what you can do when you’re getting ready to launch a website with shortcodes. Shortcodes are a really important piece of WordPress, and it makes things so easy, especially for people who are brand new to WordPress, and they don’t want to learn the – try to figure out how to wrap things in HREF, tags, or get the right class, or whatever. You just make a shortcode and it spits out all the correct information, and it makes things kind of dummy proof, if you will. It makes it really, really nice. And that’s what I love about shortcodes. I try to build them in wherever possible, like the one that has – right in the “Is there a plugin for that?” section of the show notes, I have that as a – it’s a shortcode. It’s an eBook. It’s called eBook, and it’s got the square brackets around it.

And then, if I ever want to update how many plugins are in the WordPress repository because that number is always going up, I can change one file, I can change one area in my custom functionality plugin, and it will change across the entire website – across all 300 episodes or so that have a is there a plugin – that recommendation. So, that’s really cool, and it gives – that’s one of the other benefits of using shortcodes. If you start using them in multiple places, then you have one easy access point to edit, and then it changes across the site.

So, that’s what I wanted to share with you this week. Thanks for tuning in and learning about shortcodes. Again, if you haven’t ever spent any time with shortcodes, or even diving in, or taken a look, I highly recommend doing it. It’s one of my favorite things, along with custom post types. Those are probably the two of my favorite things because you can do a lot of customary things. You can make your website really easy and efficient for you to use, and that’s why I love those things. And so, that’s what I wanted to share with you this week. I’ve got more great WordPress information coming at you next week. Until then, take care and we’ll talk to you again soon. Bye-bye.