Podcast Episode

306 – WordPress from A to Z – Part 2

Announcements

Is there a plugin for that?

With more than 50,000 plugins in the WordPress repository, it’s hard to find the perfect one. Each week, I will highlight an interesting plugin form the repository.

For more great plugins, download my 50 Most Useful Plugins eBook.

Max Mega Menu is easy to use mega menu plugin. Written the WordPress way.

WordPress from A to Z – Part 2

  • Admin tools: Customizer, custom fields, meta box, navigation menu, options, settings, shortcode, widget.
  • Code: action hook, API, class, function, method, object, Object Oriented Programming, property.

Admin Tools

Customizer

The WordPress Customizer is an interface that lets you make changes to the parts of your site that you can’t edit via the post editor. Exactly what features you have access to will depend on your theme (and sometimes plugins), but there are some default elements including widgets, menus and site identity.

Custom Fields

Custom field is another way of describing post metadata. Use custom fields to add extra data to your posts such as your mood when you were writing, the weather etc.

Meta Box

A meta box is an area in an admin screen that you use to add content, configure settings, or perform an action. You can add meta boxes by writing your own plugins.

Navigation Menu

The navigation menu is a menu you place in your site’s header to help people navigate around your site.

Options

An option is something you can change about your WordPress site that isn’t part of a post, page or any other content type.

All of your site’s options are stored in the wp_options table in the database, the only table not linked to any other tables.

Settings

Settings are the configurations you make to your site or to plugins to get them working the way you want them to.

Shortcode

A shortcode is some text inside square brackets that you add to your posts, which then outputs or runs some code.

Widget

A widget is something you can add to a widget area in your site (e.g. in the sidebar or footer) without writing any code.

Code

Action Hook

An action hook is a line of code added to a WordPress core file, a theme or plugin which lets you insert extra code by attaching a function to it.

API

API stands for Application Programming Interface. It’s a codebase which lets you interact with one system from another system.

Class

A class is a type of programming used in Object Oriented PHP. Using a class instead of a load of separate functions makes your code cleaner and easier to extend.

Function

A function is a block of code that you write into your theme or plugin to make something happen. WordPress core files also contain hundreds of functions.

Method

A method is something that’s used in Object-Oriented Programming. It’s how you describe a function that’s used inside a class.

Object

In Object-Oriented Programming, an object is a bundle of variables and related methods. Use them in classes to group functions together and make your code more efficient and easer to extend.

Object-Oriented Programming

Object-Oriented Programming is a programming method that uses objects, methods and classes to group code together and make it easier to extend.

Property

In Object Oriented Programming, a property is a variable you use with methods to store and output data.

Thank You!

Thank you to those who use my affiliate links. As you know I make a small commission when someone uses my link and I want to say thank you to the following people. For all my recommended resources, go to my Resources Page

Full Transcript

Business Transcription is provided by GMR Transcription.

On today's episode we are going to continue our discussion on defining the terms of WordPress right here on YourWebsiteEngineer Podcast Episode #306.

Hello, everybody, welcome back to another episode of YourWebsiteEngineer Podcast. My name is Dustin Hartzler. Today, we're going to be continuing our discussion that we talked about last week. We started and just kind of ran out of time, but before we get to that let's go ahead and dive into the announcements.

The very first thing that I wanna say in the way of announcements, and this is basically the only thing, the WordPress base is just kind of, I'm not gonna say boring, but it's just really a slow news time right now, as development is being worked on the WordPress 4.7 and there's just not a lot going on you know. Things are getting ramped up and ready for WordCamp US, it's happening in a few months in December in Philadelphia.

But this was an interesting article that I found over on WP Tavern, and it's basically saying that WordPress 4.7 will allow developers to register custom bulk actions in admin list tables. That's a mouthful but what does that mean? You know, if you go into your Post or your Pages section of your WordPress Dashboard, and you select a bunch of posts, there's a menu at the very top that you can filter through and you can look at specific posts and you can filter them by either Edit or move to Trash. That's pretty much the only thing that you can do if you wanna do things to multiple posts. If you select two or three posts, you click the Edit button, then it'll give you the ability to edit do quick edits, and you'll add an author or a category or tags, or things like that, and the other one is to move to Trash.

Well, now it gives you the ability to add your own feature. This is giving developers to add their own feature, maybe they want to be able to add. I guess what I was thinking through when this post came out, I was thinking like, oh, with my plugin that I have on the WordPress repository I could put the testimonials in there and I could do something, when you select four or five testimonials you could do something with them. There's just infinite possibilities. You know, maybe with a commerce order, they can go in and instead of just editing or deleting an order, you can maybe go ahead and select four or five of these and then you could print invoices or you could mark as complete, or you could do a ton of different things. So this is a part that's going to be brand new in WordPress 4.7

So if you're developer go ahead and think through your plugins or your themes or whatever you may be developing, and think if this is a feature that could be added for WordPress 4.7, and think about how you could be adding that to this next round and how that's all gonna work. So I'll put a link in the Show Notes for this episode, Episode #306, where you can go in and you can find the post and a link to the developer-type resources.

So that is pretty much the only thing in the news that I have this week.

The other thing that I wanna to talk about this week is the Plugin of the Week, or is there a plugin for that section. And this one, today, is called Max Mega Menu. It's a mouthful, but it is a plugin that allows you to create these, they're calling them mega menus these days, and you've probably seen these on a lot of websites. But maybe you hover, think about a horizontal menu bar and then you hover over maybe the store page, and it drops down and it's a full width and maybe had three, four, five columns in there, and maybe he's listed things by products or maybe there's a short little description, or maybe there's an image or a video, or something like that. That's kind of what a mega menu is. And so it's basically like a menu inside of a menu dropdown, essentially.

And this Max Mega Menu will automatically convert your existing menu items and turn them into a mega menu, and it's just about as easy as creating widget areas. So you, say you want to list all of your pages underneath your dropdown. So you would go and you would grab a widget that's pages and then you could stretch it, whether you want it to be one-quarter of the width or half the width of this mega menu, and it's really, really cool.

This is a free version of this plugin. It does not have a Pro version, but it's been used more than, there's an active on more than 100,000 active websites. And so it's one that you should definitely check out if you're interested in creating that mega menu for your WordPress website. So it's called Max Mega Menu, and you can find out more in the WordPress repository. Or, of course, you can look in the Show Notes for Episode #306.

All right, today, we are going to continue diving into these terms and just round out the last few that we've got to talk about. The two categories that are left are Admin Tools and Code. And so those are ones that we'll talk about. I just want you to not necessarily understand and learn how to use these, but it's more about just knowing what they are and just knowing what these terminology pieces mean, and then that's going to just overall help understand of how to navigate, how to talk to a developer if you are interested in hiring somebody. You know it's just going to give you a more rounded approach to WordPress knowing more of these backend or these dashboards in these code-type types of information.

So let's go ahead and just dive right in.

The first one under Admin Tools is called the Customizer. And the WordPress Customizer is an interface that lets you make changes to the parts of your site that you can't edit via the Post Editor. So what this is and where these regions are really depends on what theme you're using because all themes are created differently and all themes have different areas.

Think about the, the main things that are included are normally the widgets, the menu, and your site identify. Those ones are pretty standard and you can find out how to edit those on most themes out there in the WordPress base. So you can go in, you can edit your title, your tag line, a lot of them you can add a logo or a Gravitar, you could add those types of things. You can go in and you can customize your menu. I guess the Customizer is an area where they're putting a lot more resources and effort development-wise to bring this experience, and they wanna make sure that a lot of plugins have the ability to edit things right on the fly within the Customizer.

The cool part about the Customizer is it is a left panel navigation, and then on the right side you see your website. And with this preview on the right side, you could also look at it full width, a desktop view, or you can look at it in a tablet view or you can look at it in a phone view. So when you're customizing things and you're working on your website you can do all of those things right there by looking. Whenever you do things it auto-updates and auto-refreshes so you can see right away what's going on on your WordPress site. So it's really, really nice and it's kind of the wave of the future. And I think I've been saying this for like two years, that it's the wave of the future. And they're slowly bringing more features into this. I know the WordPress theme that is developed by WooCommerce Storefront is bringing a lot of functionality, a lot of features in editing, all within the Customizer because it's just a better experience.

Remember with the menus era, you'd go in, you would create a new menu and then you'd have to save it, then you've to open another tab and you'd have to refresh to see what that menu actually looks like. Well, now you can build those menus and you can look at them right on the fly.

You can find the Customizer in a couple of different places. It's underneath the Appearance section, so if you go under Appearance and then Customize. Or on most websites, depending on the way that your backend is set up, like the black admin dashboard that appears across the top if you were on a page or a post basically you're looking at the frontend of your site, you can hit the Customize button and that will pull open the Customizer. It is just a little bit slower than I would like when it loads. It just takes a little bit of time to actually load the Customizer but that's doing all kinds of the magic behind the scenes to get ready to do this live preview.

I really like using the live preview in Customizer to change a theme if I'm doing some sort of troubleshooting. So if I'm trying to figure out if it's a theme-related issue, you can just go in and you can customize. You go to Customize and then you can do a preview with 2015 and see if the issue is still there. If it is, then it's not a theme-related thing, but if the issue goes away then you know it's related to the theme.

So the Customizer is really, really nice. I would love to build more stuff with the Customizer, it brings in all this fancy java script and stuff that we're supposed to be learning. But that's the Customizer.

Another thing that you may have heard about in the WordPress Dashboard is a Custom Field. And this is a way of describing your post meta data. Use custom fields to add extra data to your posts, such as your mood when you're writing, your weather, these are pretty standard like right out of the WordPress codex. I use custom field to do certain things on my website.

I use custom field to display the podcast player that you see right there on my website, that's put in with a custom field. Basically, it only displays it when it's on the Home page through that custom field. I also have custom field set up for webinars and webinar assets. So when a webinar is live and I have access to the downloadable resources and whatnot, then I put all of those in custom fields. They're basically separate areas and then you can call those within a theme, and then within your theme file those custom fields do a really great job of staying very consistent in making the formatting and styling look exactly the same on every single posted page, which is really, really nice. And that's a Custom Field.

A Meta Box is basically the same type of thing. A meta box is an easy area on the admin screen to add content, you can configure settings, or you can perform actions. It's just another place to put information. The custom field and the meta box, the post meta boxes are really, really the same. The custom fields are just built right into WordPress, and the meta boxes are something need to be programmed in to show up in your dashboard. Think about the Yoast plugin. That's basically a post meta box, a custom post meta box. So all of that customization and stuff that you do on a post by post basis, that is in a post Meta Box using the Yoast plugin. All right.

The Navigation Menu. This is another kind of admin thing that we talked about. It is a place where you design your menus. And you can do this via the Customizer, or there's still a section underneath Appearance to go to Menus and you can go in and you can add your own custom menus. It's really nice because it builds in the ability to automatically add pages, you can add category pages, you can do external links so if you wanna do external links to something else. It's like one of the best features, I think, in WordPress.

This is one of the main reasons that swayed me from building html static websites over to WordPress was the ability to dynamically create these menus, and it made it so easy to be able to build a website and then later add a page and then I wouldn't have to redo every single page inside my website in my static html website. So the Navigation Menu is a big deal to me.

The Options. Options are something that basically changed the way WordPress site is, it's not part of a post or a page or any type of other content type. This is basically a lot of where your settings are and for your plugins and your themes. They're sometimes are just called settings instead of options, but basically all of your stuff, all of this extra site content is stored in the wp_options table in the database and it's the only table that's not linked to other tables. So the wp_post table links to post meta, there is comments and comment meta, there's all these tables that link to each other. But the Options table is the only one that just stays 100 percent; it doesn't link out to anything. And certain things that are in the Options table are like your site URL, your home URL, what theme you're using, what plugins are activated, settings for all kinds of different of things fall into this wp_options table. So that's a pretty important table inside your WordPress database.

Let's see what else. The Settings. Settings are basically the configurations that you use to make your site or your plugins and get them working the way you want to. There's a number of setting screens underneath the general settings at the bottom that's got a lot of settings. There's a lot of set up and configuration and things like that, those are all in the Settings area. And so that is what Settings are.

Short Codes. These are another really fun topic of mine that I love short codes in. Let's just describe what Short Codes are. They are text inside square brackets that you add to your post, and then you add those on the dashboard side of things, and then they output or run some sort of code. So they can include text, they can automatically pull in information, they can do a lot of really, really cool things. You can build your own short codes or sometimes they're built in with a theme. Probably the most common short codes that you've seen are maybe the ones that are buttons. So maybe there's a square bracket and then button, and then you add some text and then you add another square bracket, and then it'll display in a button form. The important part about your short codes is it's just an easy way to remember how to input data so that it can be outputted the exact same way on the outside of your website.

So Short Codes are a great way for a client. Maybe they wanna add some sort of tweet functionality in each post. You can have them add some sort of short code with Twitter imbed right built in that will automatically expand and include their #tag or include their username or something along those lines. So that's what a Short Code is. And you can do short codes for hundreds and hundreds of things.

I have a short code set up on my website for the transcripts, and the transcripts for each episode goes in and gets formatted perfectly in a specific way. And occasionally they'll come in and they'll say, hey, I want this little text that you have above the transcription, can you please tweak this. And so instead of going back through hundreds of episodes to tweak it, I just change the code behind the short code and then it automatically works everywhere on my website, which is really, really nice.

Okay, the last one in this category in the Admin Area is called a Widget. And this is basically somewhere, a widget is something you can add a widget area to your site without writing any code. And so widgets can be customized in the Customizer, and there's also a widget setting underneath Appearance. And so a widget is basically something you, it's like a drag and drop entity and there's a bunch of them built in with WordPress, there's a bunch of them built in with WooCommerce, there's a bunch built in with the plugins that you may install, some themes even have some plugins that are built in. But basically you take these little widgets, they're blocks of code that are already preconfigured for the most part, maybe they have a setting or two that need to be done and you pretty much take them, pick them up, and you move them to different widget areas.

Now widget areas can be anywhere in your theme. Standardly, they are footers; you know maybe a footer left, footer middle, footer right, something along those lines. Customarily they are on the right sidebar or the left sidebar, but you can put widget areas anywhere. If you wanted to have a special area that appeared on every website. Maybe you wanted to offer a product for sale every week, or something along those lines. You could create a widget area inside your theme in a certain area, you can add that product or that information and then it appears everywhere across your site. So widgets are really cool and I think they're underused sometimes, that you think that they're only used for sidebars and or even footers. But Widgets can be used for a lot of different things and they can be in a lot of different places.

All right, in the last bucket of terms that I want to define today are called Code, they're kind of in the code bucket. I'm not gonna dwell on these a lot, this is more for just to hear the terms and get an understanding and an idea of what they do.

And so the first one is called Action Hook. And an action hook is a line of code added to a WordPress core file, or a theme file, or a plugin file that allows you to add extra code by attaching a function to it, and you can do different things with these types of functions. So basically it allows people like us to, for an example, this is – I don't know, I always go to WooCommerce as an example these days. But for an example, we want to modify something that WooCommerce is doing. So we can write a line of code or two that's creating this action that's going to do something with WooCommerce data but not really affect the WooCommerce plugin. So I'm not modifying the core plugin code of WordPress. So that's kind of an overall.

There's actions and there's filters, and filters will go in. You could create a filter and make all of your H1 tags across your entire website and make them uppercase. You could do that, that would be a simple filter that you could write. A filter is basically taking data or taking text, doing something with it and then spitting it back out in a different form. So you can do, maybe you wanna change the colors or you wanna do this, that or the other, you could all do those with actions and hooks.

API. API stands for Application Programming Interface. It is a code base which allows you to interact with one system from another system. And so the basic way that I like to think about this, and I am a very novice person when it comes to APIs. But basically, when you think about the word API just think that WordPress is able to pull in information from another server. So maybe it's shipping grates from someplace, maybe it's some sort of weather data, something along those lines, it's being able to pull this information from one place out there. Maybe weather.com, it's pulling in data to display your weather on your website, it's pulling that in to display it on your WordPress site. And it's just going to get the data and bring it in and then WordPress can do its magic and do all the formatting to make it look and feel like the rest of your website. So that's what an API is.

A Class if a type of programming that's used in object oriented PHP. And using a class basically allows you to separate your functions and makes your code cleaner, and it makes sure that you don't ever get those big white warning pages that say that there's a "duplicate class conflict". And so this just makes it easy. Basically, think about a class as like – I don't know how the best way to say it, it's basically like a big folder, not really a folder, I don't know the best way to explain this. Think about within code everything's within brackets. So it's basically saying like Dustin's Class, all of Dustin's code is contained in here, and then there's an open bracket and then you put all of your code and then you put a closed bracket. And that's probably the best way to think about it. It's basically a big wrapper around all of your code.

If you think about in html it's like the body tag. You use a body tag, you open the body then you put all your body of your website, and then you close the body. It's essentially kind of the same thing. So that's what a Class is.

The next one I wanna define is called a Function. A function is a block of code that you write into your theme, or a plugin that you make something happen. WordPress core files contain hundreds of functions, and you can make functions work the same way, you can build them yourself. You see a lot of "add this code to your functions.PHP file", and it's just a little bracket of code and it's doing something. It's just a little snippet of code that can do something. That is what a Function is, at the barest minimum of defining.

The next one is a Method. And a method is essentially a Function inside of a Class. Makes zero sense why they call it something different, but that's what it is. If you have a function that we just talked about, some little line of code, but you put it inside of a class it's now called a Method. Good luck remembering that one.

The next one is called an Object in object-oriented programming. An Object is a bundle of variables and related methods, or related functions. Then you use these in classes to group functions together to make your code more efficient and easier to extend. So essentially that's what it is, an object is a bundle of variables and related methods or functions, remember that.

And lastly, a Property in object-oriented programming. A Property is a variable that you use with methods and you store the outputted data. So some sort of property would be like you set a variable to either a string or a number, and then you save that, it's saved as data and it's an output, and that is what a Property is.

So those are the continued list and there's tons more, probably, out there that we could talk about. There's just a lot of different terminology to pieces, and we didn't even dive into the terminology inside of CSS or in html or anything else. These are all just basic A to Z when it comes to WordPress terminology and whatnot.

So that's what I wanted to share with you there when it comes to all of this, A to Z. Hopefully, you picked up something and maybe I described everything properly, and we'll talk again soon.

Take care, bye-bye.

Leave a Reply