 If anyone is interested in WordCamp Orlando, since I just mentioned it, it is coming up August 23rd through 25th. If this is your first WordCamp, it's kind of similar to this, only in a place that's a little bit more humid. That's a lot of fun. I really enjoy doing that. Like I mentioned, if you want to follow along with the code, it is at that short link there. I'll take you to a GitHub page, which I'll be referencing a few times. I also tweeted out the link to it. Before we get started, just a few quick things. I run a maintenance company. I handle ongoing WordPress support and maintenance for my clients. I've been doing that for the past four years or so. I've been doing WordPress development for about 11 years now. I really enjoy it, and I really enjoy building new themes and plugins. I really love teaching people things. When I do maintenance with my clients, I spend a lot of time telling them what I'm doing. Here's what we need to do on your site, and here's why. Honestly, I really love giving presentations and doing the meetup, because anything I learn, I've learned through someone else, either going to an in-person event or reading a blog post. I really want to thank SiteGround. They are one of the sponsors of the event. I'm one of their WordPress ambassadors. There's actually a few of us here this weekend. They helped financially support me being able to travel to multiple WordCamps to give presentations. They've been my host for several years. I'm not just getting paid to say this. I actually really, really love their stuff. Again, I'm going to leave that up for just a moment. There's the links. There's also a platform that was started earlier this year at WordCamp Miami called MyTalk.rocks. If you go to the website, MyTalk.rocks, at any point, it just takes you directly to a form where you can share information about speakers. If you have any interest in sharing information, we first used this at WordCamp Miami earlier this year, and I got more feedback on a presentation than all the other WordCamps have ever gone to. It's actually really cool. It looks a lot nicer on your phone where you can just choose a speaker and just share some emojis or comments. If anyone wants to use that, I would appreciate it. Has anyone here ever built a plugin before? Okay, cool. Good. Then most of you are in the right room. All of you might have... No, that's okay. What we're going to go over, what we're going to build is a notification bar plugin. Basically, it's going to be a little bar that will show up on the... Right now I have it showing up at the bottom of this website here, just with some text. Imagine when you want to have something sticking to the top of your website that's signed up for my newsletter, or we have a new product for sale, or pretty much any information you want to quickly share with people on any page. It's a straightforward, small project that we can build over the next 40 minutes, but it also showcases a lot of things that you can do in WordPress and a lot of WordPress APIs and options that are available to you. To follow along with this, I don't expect any PHP knowledge, but some HTML and CSS knowledge would be good, just to have a baseline. That said, all of the code that we're going to do, I'm going to be stepping through line by line as we work. Last time, before I take it off, if anyone wants to follow along with the code, I'm going to be stepping through the code here. The first thing that we're going to be doing is we have to create our plugin file. WordPress, when you're building a plugin, WordPress plugins go into a folder in WP content. If you've never looked at the files for your WordPress site, all WordPress sites have a bunch of WP slash config slash active PHP files, and then they have these folders, WP admin, WP content, and WP includes. Is this difficult for anyone to read before we move on? The text is larger. In the WP content folder, there is a folder for plugins. In that folder, we're going to create our own folder. Only rules are lowercase, no spaces, you know, keep special characters to a minimum. Most plugins just use lowercase name with hyphens. The plugin that we're building, I created a folder for it, and then I'm creating one new file, and I'm going to title that file, it can be whatever you want to call it, .php. In this case, the standards are to title this initial file the same name as the folder that it's in, because that's where WordPress is going to look for it first. So far, I've created a file, a PHP file, and the only thing in it is a comment. That grayed out text is a PHP comment. The information that I placed is the plugin name, the URL where you can get the plugin, a description of it, a version number. The author is your WordPress.org username. If you plan on putting it on the WordPress repo so that it can link to your profile page, and then if you have a separate URL for the author. So there's a bunch of other conditional tags that you can place here. There's an excellent resource that I'll be sharing with you at the end for WordPress plugin development. But these are the main ones that I want to show you where they show up on the site. So I have this first file that we've created. And I'm going to go to my plugins page from my website. And yes, I did use this from Miami. So apologies for everything we can, MIA. So all this plugin does right now is it creates this plugin activation bar that has the name of the plugin, the description that we created, my WordPress.org username linking to my profile. And then my website with a link to visit the website. So we have a working plugin right now. Now it does nothing at all because, oh yes, yes. The plugin activation page here is all the content there is populated by WordPress looking in wbcontent slash plugins. And then it looks into each directory in there. You can have a plugin for instance, I didn't leave it installed here, but by default WordPress comes with a plugin called Hello Dolly. And that just happens to be one PHP file directly in the plugins folder. You could do that, but most plugins you're going to build, you're probably going to have more than one file. So you're going to have images, CSS, JavaScript. So we're going to put it in a folder so that we can put all those files in there. So right now I have this plugin that I can activate. And like I said, it does nothing. It's active on the site, but really it was just a common placeholder. So now we have the next steps. So first thing I'm going to do is this plugin needs some settings, right? We know that we need to apply some text. And then I'm going to put two settings to it, whether you want the bar to display at the top or bottom of the site, and whether you want that bar to be sticky or not. So I'm going to create a settings page. And so I'm just going to ask, one more time, is this for people in the back? Can you read that text or should I increase the font? OK, so I can offer it on one page. So WordPress has a lot of PHP functions built in that can help you create your plugin. One thing that we're going to be using quite heavily is WordPress hooks. So WordPress has something built into it called action and filter hooks that allow you to take the flow of code and stop it to run your own code. So an example is there's one called WP head. There's only called WP footer. If you've ever looked at your theme files, you might have seen those in there. Basically it says, when you get to WP head, look for any actions that exist that hook into WP head. And then add this new function to it. So in this case, I'm using a built-in WordPress hook admin menu. And I'm adding a new action to it, the WNB WordPress notification bar. I'm adding a function. Notice that the function that I had below is the same name as the action that I put, a line 14. So I'm writing my own PHP function here, WNB general settings page. And the only thing that this function does is it uses a built-in WordPress function called add submenu page. And if you might be able to guess by the name, WordPress will take the information you put here to build a submenu page in your WordPress dashboard. As I mentioned, there'll be a list of resources at the end. One of them, the developer handbook, has a very long and detailed list of a lot of the hooks and actions and filters built into WordPress. Additionally, your own plug-in can create new ones. Plugins that you might use frequently. WooCommerce being a good example that has hundreds of its own hooks and filters built in, so that you can take what someone else wrote and make your own changes to it. So in this add submenu page, actually, sorry, I'm gonna use this as an opportunity to, WordPress.org, I obviously don't remember the URL to the page. Developer.wordpress.org, not developers. So there's a website developer.wordpress.org, where all of the functions, hooks, filters, and actions built into WordPress can be found. So the one I'm using adds submenu page. I can see what is required of it, what it should be, and what it does. So there is something called a parent slug. We can see that that is a required string. So basically I need to pass some text to that, and I have to do it for this function to work. But then there'll be ones like a callable function that is optional. I don't actually have to pass that one to use it. So I know that to use adds submenu page, I need to pass the slug URL of the parent menu item, what the title of that page will be, what the menu title will be, who should have access to it, and then a menu slug, an ID that we can use to reference it later. To show you what that means, so on line 17, I know I want it to go into the general settings menu. That is this menu item at the bottom, settings. So I'm using the page of that, options general, that PHP. You can find that for any of these pages. When you click on them, you'll see the URL will go to whatever URL that you want to use. I'm calling this the WCMI notifications bar. The menu item is just going to be notifications bar. People who have the ability to manage options on the site, that's just outside since we're gonna be making some option changes, those are who should be able to actually access this menu. And then this isn't here yet, but we have a, or sorry this isn't here yet, but we're going to use a function to make that settings page for us. So when I take this code and save it and refresh that page, so just, right now I'm hovering over the settings page and you can see the general settings options that are built into WordPress. And then when I refresh the page and hover over it again, we now have a new page, oops, called notifications bar, the page that we just created. But you might be able to guess when I click on it, nothing's gonna happen, we're actually gonna get an error because I told it, here's the function that displays what's gonna happen on this page and we haven't yet written that function. So that's gonna be our next step. Additionally, before I move on, you'll notice that some of the lines of code that I write are gonna be enclosed in parentheses and they're going to have underscores in front of them to underscores or underscore e. Those are to make the whatever text you have in there translatable so that we could localize it for a different language or a different dialect. So in this case, I have the text that's gonna be the title of that page. And then the second piece of text there is the slug that identifies what our translation is going to be. So now if I put this plugin out for other people to use and they wanna translate into Spanish, say they have an easy way to translate all the individual bits of text without actually changing the code of the plugin. It's something that you'll take time to start learning how to use this and remember to put it for things. But if you start releasing code publicly, it'll be a big help to get more people to be able to use your plugin. All right, so we've created that menu page. Now let's start creating things on that page. So I mentioned that we have a callback function here in our add so many page. Basically it says here is the function that starts building that page. And that is the same name as that function that I'm writing here. Inside of there, I'm writing some HTML code that is making a page wrapper, the title of the page we're gonna put here. And then I'm creating a form. The form is going to be a post form that goes to options.php, so when I save this form it'll refresh this page, bring me back here. And I'm doing two things. I'm getting whatever settings field I have set for this page and then I am telling it to do those settings. And then I'm building a submit button. These are all functions that are built into WordPress. So you're not going to have to worry about creating everything on forms yourself. You can use these tools that'll handle. What this handles for you is when you create your form fields, your text areas, your radio buttons, check boxes, it's gonna handle saving them to your database for you, calling the information from the database so that it shows up on the page when you refresh, calling the information wherever else you tell it to call it so that whatever settings we make here we can use on the site. So we don't have to write all the logic to do that. WordPress will handle that for us. All right, so we have that extra code that's gonna start displaying this page. I'm gonna refresh it and as this is going to be common during this demonstration, it looks a little bit better but there's still nothing going on because we haven't created any of those fields yet. So let's start that next. So I know that to start with I'm gonna add two fields. I'm going to add a text box, sorry, an input box so that we can write some text to go on to that notification bar. And then I'm gonna create a radio button to choose whether it's gonna display at the top of the page or the bottom. I'm gonna create another radio button later but for now I wanna show you how these two work. I'm using another built-in WordPress hook, admin init. This just means when the admin side of the site loads so whenever we're on a dashboard page it's going to look for any functions that we have hooked to that and run the code. So we have our function WNB initialize settings and in that function I have added a settings section, settings field and another settings field for the options. And then I've told it to register those. So I'm gonna walk through these in a moment but again creating these inputs, a lot of that WordPress handles the logic for you. So we are writing some PHP code but the majority of it is built-in WordPress functions that we can easily go to the WordPress developer page and see exactly what it's looking for to build it. So there's not quite so much guesswork, you don't have to figure out where you're starting each bit of code. WordPress handles that problem all the time, creating settings pages for plugins so you can save having to write all the code yourself and using things that WordPress already has built in to do it. So I wanna refresh the page and show you that again it's broken which is at the moment expected and I'm going to pull this up and say that we've created a settings section, our general settings. This is just all the settings are gonna fall under this section. Our two fields, notification text and the display location and then all the options for them. I don't have time to go through all the individuals but it's basically all the option radio buttons and then we're registering those. I'm saying that I wanna register those general settings to this plugins general settings section. So why is it when I refresh the page I am getting errors here? Does anyone have an idea of that? Similar to the other things that I've written I started writing something and said use this piece of code but we haven't yet written the piece of code that we're referencing. So the next thing we have to do is, oh well, next thing we have to do is actually create those inputs that we're gonna use. So I mentioned that WordPress handles the logic of those for us but we're still going to create our input types here. So the first one I'm using is a text input callback. Basically I wanna say whenever I wanna make a text box use this bit of code and then a radio input callback whenever you wanna create radio buttons and these are only two I'm doing with this plugin. You can create some for color pickers, drop down, select pretty much any sort of form field that exists. WordPress has some code to handle it. For now I think two is good for demonstration. So I'm saying that I wanna create an input that has some specific info from our settings. The ID of the option that we've created, the name and then whatever value we wanna call back so that we can see it when we refresh the page. Same for the radio buttons. This allows you to modify it so if you want them to display a certain way if you want to pull different information from them or have them function differently. In this case it's just a bit of PHP code that I wrote to say I wanna display them in a certain way. When we refresh the page we'll see what that looks like which is the title of that area and then whatever input we're trying to call. And I happen to, I played with it this morning so I have the settings saved. So by the way by deactivating the plugin the settings that I created such as the text and where I wanna display it are still saved in the WordPress database. So since this is not a fresh install of this plugin it's pulling the same settings that I already had from the database which is also good where if you accidentally delete or uninstall plugin or just deactivate it and need to reactivate it the settings that you have for it are still saved on your site. You're gonna have to worry about them disappearing. So we've created two inputs. A text input where we put whatever text we want. We're just writing this as a developer workshop and then choosing where we want the notification bar to display. I gave three options of don't display it, displayed on the top of the site, display on the bottom. So that's great, I can save it. I can change the text and when I save it it'll refresh the page but the text that I added is still there because now it's updated in the database. But as you can probably guess when I go to the front end of the site and refresh there's nothing showing up. Next thing we have to do now that we've created that settings page created all of our inputs and made sure that they will save to the database. Next thing we have to do is actually make use of that data that we've created. So the first thing I'm gonna do is create a new function called WNB display notification bar. Again this can be whatever we wanna call it as long as that function is the same as the callback that we're using which is line 149 this add action. And I'm saying that in the footer of the site I want you to run this function. And what the function is doing is first seeing if there are any settings saved for that plugin. So this is the same slug that we used when we were creating those settings. And I'd say if it's not null so if there are some settings saved then get those options from the database. We're using a built in function get option which will just grab everything from the database. So again you don't need to worry about writing your own SQL queries. You can just write use as function that'll grab everything for you. And then I'm using a little bit of HTML to display that box. In this case it's just going to be a black bar with a white text on it. Rather it will be a black box with white text on it. And I'm just telling it to put this display location as a class of that box and so I can use CSS to choose where it goes and then put whatever text we have saved. So does this make sense? If you have any questions feel free to jump in. So when we have this I can go to the front of the site by just a default install with the 2019 theme. And when I refresh I'm going to scroll down to the footer and see that I have text, there we go. Well it's there. It says replace lamp so that's exactly the right. Anyway we have some text there behind the projector screen. But it isn't styled or anything yet. So next thing we're going to do is create a style sheet for our plugin and load it to the site. Wordpress as I'll keep repeating over and over again has a built-in function for this. There's a function called wp and qscripts. Or there's sorry a hook that you can use to add any scripts or styles to your website. So any JavaScript or CSS that you need to add. So when we get to that point we're going to be loading the script, sorry the style sheet. I give a name, an ID to the style sheet. I'm telling it where to find that style sheet. So in this case I'm saying look for this file in the plugin directory. And then look for this other file in a relation to the file that we're currently in. You can then pass an array of dependencies. Basically I can say don't load this file until these other files have already loaded. So if you're writing a plugin that you're saying you're using jQuery to do some functionality for the site, you might want to have a dependency of jQuery. So it only loads after that's loaded. And then you can pass a version number to it. That way if you update your plugin, you can update that version number and make sure that the new file gets loaded. If someone has a cache on or something. And we've actually created that file. The notifications.css file. Not going to go into this in great detail but created a box that's black, white text on it and added classes for whether it's chosen to display on top or bottom of the site. And then a little bit for smaller screens. All right, so we have that created. We have our text down there and gonna refresh the page. And there we go, it's styled a little bit better now. Of course you can use CSS to style this in whatever way you want. We can actually have settings on our page to let someone choose what color of the text or box is going to be. You can have easily readable classes so that somebody who's using your plugin later can style things in their own way. So we have it on the bottom of the page now. I can go here and say display on the top of the page. Save those changes. We refresh. And we see it's up there at the top. All right. So, is everyone following along so far? Yes. Good question. So the function I wrote uses the hook WP footer. But this is displaying on the top of the page, not the footer. So the reason I use WP footer is when you, let me just pull it up, get rid of these. So I'm going to, and by the way, if you've not seen this before, this is the browser debugger. I use it all day to look at the CSS and JavaScript and HTML running on the site. You can get to it in pretty much any browser by right clicking and clicking inspect or inspect element, what some use to pull this up. So I'm looking at that bit of code there. That's the HTML that I wrote to display this box. And we do see that it is still loading after all of these other page elements. So it is loading in the footer of the site. However, I use some CSS to just say, when we have display top, I just hold it to absolutely position that box at the top of the page. This is a very, it's very straightforward. It doesn't account for things like sticky headers or things like that. So this is not going to look perfect like if you just install on all of your sites. But we can make some changes to make it look better depending on the site. So yes, even though the code is loading in the footer of the site, using CSS we can move it around on the site. All right, so I decided that I wanted to make it so that you didn't just have to go to the top, bottom of the site to see that, but we can make it stuck in one place. So I added a new option to make it sticky. Either make the notification bar sticky or don't make it sticky. Now I already have this radio callback. So I can make these radio buttons. So all I had to do this time was add a new settings field. So I already had the one for the display location. I just took that code, copy and pasted it and just changed the options. And again, this is where using those things built into WordPress comes in handy. It makes it a lot quicker to just add new fields. I already have how I want radio buttons to display. So now I just need to change the text. You know, will this be sticky? It's a radio button and it goes in the general settings section. And my options are make it sticky or don't make it sticky. I have these IDs that we're using here, sticky or relative to actually make the new styles that we're gonna use. And if we go here, I added two new styles to choose whether it is fixed position at the top of the page or sticky position at the bottom, CSS positioning. And so if I choose to make the notification bar sticky, I'm just gonna scroll down a bit first, save that setting. So now if I refresh the page, we'll see that it's going to stick to wherever I'm at. And the same thing if we chose the bottom. So again, the idea is that I didn't have this in mind when I started writing the plugin. And then later I said, oh, I want to add this new feature to it. Again, if I say, oh, I want to add, letting someone put in the color they want to use for the text or something, you can still do that on top of the existing plugin just by adding a new settings field. All of these things use what's called the WordPress settings API. The WordPress developer handbook has a lot of information about that. But the idea is that there are a few built in functions that can handle a lot of the work for you. I wanna stress that every time I go through is that a lot of these things are things that WordPress already does. So you have to come up with the idea, you have to start writing some of the HTML and CSS to structure things the way you want. But when you start writing the code, WordPress does a lot to help you get started. You shouldn't have to say reinvent how to make a call to the database to get options. WordPress will handle that for you. That also means that you can write a whole plugin like this within one workshop. All right, well, actually I have one more thing to go over. So I decided that, okay, I have the settings page, which is cool and all. But who use the customizer in WordPress? Or if you know what the customizer is. If you are on the front end of your site and you're logged in, you can click customize. Or if you're on the back end and hover over that and click customize. There is this section, I should have shown you this before I hit refresh, but oh well. There's a section here that has a lot of things built into WordPress and your own plugin or themes can add things to this customizer. So I added the code before I refreshed the page here, so apologies, but I added a bit of code that will create our own section here. So site identity, colors, menus, those things are all built into WordPress and the customizer. I created a new one called notification bar. And when we click into that settings page, we have the same options that we created. Choosing where to display it, if it's gonna be sticky or not, and then whatever text we wanna put. So I'm gonna try this again, but I'm going to type something new now and wherever it's going. Oh, I'm gonna tell it to display on the top of the page. And so you can take a look and watch while I'm typing the text up here. Oh, a little slower. And then I can make those changes like right now it's sticky, I can say put it on the bottom of the site and see live what we're doing. And that's one reason why you might wanna use the customizer so you can see what you're doing while you're working on it. So this is an alternative to building that settings page that we originally wrote. The code to do that, just scrolling down, where did I put it? Oh, here we are. All right, the code to move to the customizer is going to be different than the code that we need for that settings page, where I'm using, again, built into WordPress, they have functions for the customizer to create those customizer sections, settings, instead of inputs, they're called controls. So I did have to write new code to make it do that, but the code is fairly similar to the settings API code and that's on purpose that we wrote. I still get to display the choices for my radio buttons with the same text, the same options. I use the exact same option names that I used in the settings page. So you don't need to change any other code. I don't need to change the CSS or how it displays or anything because I'm using the same names in the customizer. I just said put it on this page instead of putting it on that other page. There's a few cool things with the customizer such as, let me find one. By default, unless you tell it not to, by default everything on that page is going to auto refresh. So again, I can start typing something without having to refresh the page to see what it looks like. I can make these changes and it's going to change the CSS that's loading. So that's really cool and that's, again, keep stressing it, hopefully it's a little impressed that WordPress do a lot of the work for you. All those things are built in. The code I rewrote didn't have to rewrite the whole plugin, just the settings portion. Yeah. Yes. Yeah, so there is an additional CSS thing built into WordPress, but we could put a section here that instead of just being a text area has a CSS specific area for our plugin. Yes. The question was why the text wasn't already there if I was using the same settings from the settings page? The answer is I'm actually using a different options setup. So before the code was written as just an array of options in the database, basically all of the settings that I wrote, it would make one call to the database that would go find a specific slug. Sorry, I'm playing a specific ID in the database for all the settings we had. It does switch to a new, in the database, it does switch to a new settings section. But since I'm using the same names for everything that I use to call other places in the plugin, like where it actually displays on the front end, I didn't have to change that part of the code. Yeah, so there actually are before, yes. So when it was just a settings page, there was one line in the database that was for this plugin and now there is a second line in the database for this plugin and it's, well, since I didn't delete the other code is using both, but it's using one or the other. And that's just because of how I originally structured it and then I said, okay, I'm gonna structure this differently so that we can enter the data a different way. The goal for this, oh, I'm sorry. The goal for this was to show that you can do things a variety of ways in WordPress and that there's features built in for them. Oh, sorry, yeah. Oh, these. If you had a set of plugins for the customers and the settings area, would you not open yourself up to conflicts if the user says make it stickier more than any other? Yes, so the question is, if I had settings in the settings page and the customizer, could they conflict with each other? In this case, no, only because since I am now using this code here, it's now pulling from the customizer code. It's not pulling from the settings page code anymore. And that was, so let's see. So sorry, what I meant to impress was we're no longer using the code up here that we created to create those settings pages. We've just replaced it with this other code. But it's still pulling the same things. It's pulling the same things from the database, but it's pulling them from a different place in the database now. Sorry. Yeah, so I just took it out. Sorry. So I just said here use this instead of using that. I didn't delete the code because I wanted to leave the code up if you'd be able to look through it. But where I said grab things from the database, I'm saying grab from this line of the database instead of this other line from the database. And I could pull up the, let's see, let's pull up the, I'm just gonna pull up on phpmyadmin. This is a local site, so I'll go ahead of that, I've been called root. Options. So the new settings that we've created are all of the information that we've created in the database is stored in one line in the database and all of the options that we created, the text, the display location, whether it's sticky or not, are part of an array in that setting. So we're only pulling one option, but we're pulling a new one instead of the one we're using for the settings page. But what I meant to impress phpmyadmin without having to rewrite all the code was since I'm still using the same option names in the array, the places that call for notification text or display location, that bit of code doesn't need a change. I wouldn't suggest writing things both in the settings page or the customizer. Yes, that's more for the purposes of this to show. Here's two different ways to display that information. Yep, oop, wrong button. Yes, so for instance, as we can see we added new code and I just said here instead of calling from that one piece of options, call from this other options area. Oh yes, yes, I'll pull that back up in a moment. And that's why the URL, again, the URL goes to this GitHub page and when you're looking at the commits, the changes to the code, you can actually see exactly what things, the red things are deleted, green things are added. So I just said instead of calling from this area, call the option from this other area. I didn't remove the other code, just more for reference in this case. Additionally for reference, I mentioned that there are, I gave one information on how to use the repository in the event you go to review it later. I wanna remember you wanna look through those commits and there's also a few links to things like the developer's handbook in here. I would definitely recommend looking through that when you want to start your own plugin just to make sure if you have an idea that you've already fleshed out. Okay, I wanna do this and I know I'm gonna need settings here and I want it to display here and I want it to interact with this. Check to see if some of those things already exist. Like for instance, I mentioned all these action hooks multiple times. Pretty much everything that I'm done is using an action hook built into WordPress. So you can go through and see what type of actions exist, how they work, like how priorities work and where they load. It's like knowing that WP footer loads on the front end of the site wherever that WP footer is put in a theme. For instance, can you communicate with external services? So the answer is yes. If you want to write to communicate with something, like I'll use e-commerce as an example, like Ninja Shop, they integrate with Stripe by default and a few others I think, I don't know if anyone is sure. So you're gonna need to integrate with a third-party payment processing solution. So they've written some code that they got from Stripe that says here's how to send a transaction to Stripe for when someone makes a purchase and then they've integrated that with whatever settings are on the page on your site. So if you go to click add to cart and click purchase on a product on a WordPress site, the parts of it, adding to your cart, saving your info, sending orders, things like that, those all happen in WordPress in the plugin. The actual payment processing, they wrote code to integrate with whatever payment service like Stripe as an example. So as long as that third-party service has some way to interact with it, hopefully it has a public API or something, and you can do that. Yeah. Is there a standard for adding your plugin to the WordPress directory? There is, and you can find that from the WordPress plugin developer handbook. There's a page called the plugin directory, and it gives a lot of information. There are some people here from the, who work with the WordPress plugin. Oh, there's one in here. There are probably some people here in the building who do work on getting plugins into the repository. I have a few up there as well, so you don't wanna know if you have any questions. But there are some things like here are some requirements for your plugin. You know, it can and can't do these things. And then some step-by-step on what you do. The process basically goes with you writing the code, you submitting it through form here that they tell you how to submit it. It gets reviewed for a few different things, and then you know, sent back to you, hey, this thing needs to be changed or something before it can go up on the repository. There's also a whole system for updating your plugins. WordPress 5.2 comes out probably on Tuesday, and I still need to update my plugins to say that it works with it still, after testing of course that it does. The main things that there's actually, over here there's a detailed plugin guidelines, gives you links to some plugins that you can install that can do some of the checks automatically. Cause there's a lot of checks that are done to make sure things are translatable, make sure that certain security, known security flaws aren't being used. Just a few checks of things that they would normally do. So you can do some of those checks yourself first before you submit to save both sides some time. And the WordPress team is the plugin repository team is really good at being quick, getting back to people, giving them detailed information. Yeah, oh thank you. So if I develop, this is probably in the guidelines, but if I develop or plug in, is there anything about users that has to be a certain number of users to keep it in the WordPress? Do you have to have a certain number of users to keep it in the plugin repository? You don't actually, there are some plugins that probably have almost no downloads, quite honestly. It's not based on certain number of users as it's long as it follows whatever other guidelines that there are. It's commercial guidelines, security guidelines, things like that. One of my plugins is used on a few thousand sites and then I have a plugin that it says under 40 sites. The number of sites that are using it is like vague, like 10, 20, whatever. So I know that not many people are using one of them, but apparently some people still are. So if it serves them, that is why the plugin repository itself has almost 55,000 plugins in it right now and that's after a bunch have been cleaned out. A bunch of, there are some that get cleaned out for a variety of reasons and I know that there's some ideas to make that better but the idea is keep the code up there as long as it's useful to somebody. And then, yeah. So the question is, yeah, sorry, I'm gonna jump back in my code here. I think, let's see. All right, so the question was, what's a good way to step through your code to debug it, right, you mean, to figure out a problem? So just as an example, I stepped back in my code just a bit and where I had a place where I had a known error, I was calling something that wasn't there yet. It's not ideal, but it's one way to start. You will see an error on here. Here is something that we expected to happen and we weren't able to find it and then it gives me the exact location that file. So it's one way to start. It tells you where to look. But there's a few other things you can do. If we're talking PHP specifically which a lot of word presses are in PHP, there is a tool called xdebug that works really well. It's a way to step through the code as it's running. So you can step through it line by line and see what's happening. That is definitely multiple workshops in its own to go into all the usage of it. There are some tools that, honestly, like let's say I'm working on a client site, I don't always have the ability to get onto the server and install a tool like xdebug or I don't have the time to get really into something. There's a plugin that I use called query monitor that actually does a lot of things that help debugging quickly on a WordPress site. So this plugin is written by a WordPress core contributor. It appears only for people who are logged in as administrators of the site. So I'm running query monitor here. You'll see this extra information that's loading in my dashboard or my admin bar and I can actually click into it and get more info. There's all sorts of things that he has in here. The newer version of it actually gives you information about Gutenberg blocks too. So you can see what's loading and how they're loading. But it gives me a way to start debugging what queries are made on the site, any external requests, again, what blocks are running, what file templates are being used so I can make sure that I've had this problem before where like say, I'll be making a WooCommerce template and then I'll be like, why is this not loading? And then I realized that just like I tried to go into developers.wordpress.com, I typed single products.php instead of single product and just some things like this are just little gut checks to make sure that I don't spend, I've spent hours looking at things where I go, oh yeah, I didn't add a hyphen or I added a period there in ship and comma. That happens. Tools like this makes it easy because I can install this on almost any site and again, no one else is gonna see it but an admin who's logged in. And it's just a good way to do some general testing on it. Okay, yeah. What is a graceful way to retire a plugin? I've not personally dealt with that but I do know that there are some things that you can do. The WordPress.org repository, if you're talking about ones that are in the WordPress.org repository, there is actually a tag you can put onto it so I'm just gonna go back to the, I'll choose this. And you see that any plugin that you're looking at have tags that they're related to so I can look at all block plugins or Gutenberg plugins. If anyone here does know the name of it, I think it's just called adoptable or can adopt or something like that. There is a tag you can add that signals that somebody else could take over ownership of that plugin if they wanted. I don't remember what the actual tag is off top of my head. You have, always have the ability of contacting the original developer because there's whatever info they've provided to somewhere down here. Okay, they have a lot of stuff. There we go. At the bottom, the contributors and developers, you have whatever contact info they left. So what I would, if you want to retire something, perhaps make it adoptable so that someone else can take over if they want to continue developing it. Is that a quick, okay. I'm sure there's a method to remove them from the WordPress repository but I don't have another one off top of my head. There are some WordPress core contributors here today that can probably walk you through that. Yeah. Yeah, it's pretty mind-blowing. Right, so, oh, sorry. Yeah, so the question is, does having more plugins make the site run slower? And that is a common conception and I'm not gonna say it's a misconception because sometimes that is true. Having more plugins loading on the site will make the site load slower but that's not always true. My idea is that a good plugin does one thing and does that one thing well. So as an example, WooCommerce will run, I run a few WooCommerce sites and it handles e-commerce portion of the site but pretty much any other side thing I want to do like WooCommerce to FedEx so it can do the FedEx integration, WooCommerce to Stripes so I can do my payment processor. WooCommerce filtering, so you can make custom filtering pages, all those things would be extensions to WooCommerce, plugins that aren't part of that main plugin but that add to it. So on a normal WooCommerce site, I'm gonna be running a dozen plugins just for WooCommerce and it's a lot but they all do one thing that the site's meant to do and if they're made well, as an example it's a FedEx shipping calculation one, it shouldn't be running anywhere besides that shipping page where I'm doing the calculations so if somebody writes that plugin well, it should be fine. You can, a plugin can be written poorly or a plugin can be written in a way that'll slow a site down a variety of ways. Poorly optimized code but that one honestly isn't a huge problem. The bigger problem I see is people trying to optimize their code before they ever even start using it so I just mean something that will say get me every page on my site to look for this one specific page and find one option. I've seen some plugins do that. They'll say get me way more data than I need from the database to find one piece of data. Some plugins are gonna make your site run slower just because of the nature of what that plugin is doing. An example is things that will load external scripts from another site like I have one. I have a client who is using a script that goes to an external social network to do things. I'll be vague so I don't call anyone out and it wasn't to that I mean you know your most sites are gonna integrate with social networks in some way or with a third party service but if calling that one external website takes three or four seconds to get the info you need from it and come back you don't have a ton of control if you still wanna use that other site that it takes three or four seconds to get back to you. And so my suggestion was either we find some other way to optimize the code but the quickest way to get that speed gains is to stop talking to the other website. So it's not the number of plugins but what that one plugin's doing. Yeah, for yet. Cool. I'm gonna be at the Happiness Bar mostly afternoon and some of tomorrow that's downstairs. I really appreciate you all coming to my talk. If you have any questions, again my name's David. Thank you very much. We're gonna have seven more minutes if anybody else has any more questions. Oh yes. I wanted to give you time to get your graphic slide or anything. Yep, sorry. That's what you wanted, right? You said you've been a slide or DM that showed all the way. Oh no, no, I'm sorry. The GitHub page has all the links on it which is on this thing here. Yeah, thank you. And again, thank you all for coming. Thank you. Thank you.