There are a few ways you might have come to the decision to become a WordPress developer.
– You may be a WordPress enthusiast: an administrator or owner of WordPress sites, looking to take your skills to the next level.
– You could be a programmer, looking for a platform to dedicate your talents to.
– You may have just been going through an alphabetical list of potential careers and decided that letters X, Y and Z are unlikely to yield any better results.
Whatever the reason, we’ll help guide you through the process of what you have to do, and what you need to know, to become a WordPress developer. But first, let’s start by defining what a WordPress developer actually is.
What is a WordPress developer?
The term WordPress developer is actually quite broad because there are many ways to contribute to WordPress. It could refer to developers who contribute to the core WordPress platform. It could be developers who build plugins that are sold on the WordPress repository. It also refers to developers who create custom themes, either for sale in the theme repository or for individual clients.
We’ll be providing more detail on each of these practices, but first we need to address why you might want to work with WordPress.
Put simply, WordPress is the biggest content management system (CMS) for websites in existence. Of the top ten million websites on the internet, more than a third are powered by WordPress. That translates into plenty of work for a WordPress developer.
Such popularity means there is also a thriving community of developers and enthusiasts. Have a problem trying to achieve something with WordPress? Google will almost certainly be able to find an answer posted by a member of the community. Want to advance your skills? There are excellent courses, such as the WordPress Developer Bootcamp at Web Courses Bangkok, that will teach you everything you need to know to become a WordPress developer.
There are also various levels of complexity to WordPress. You can go from zero knowledge to having a basic website up and running in a few hours with WordPress. Page builders and premium themes can allow you to create impressive sites without touching any code. A solid knowledge of HTML and CSS along with a relatively basic level of PHP can be enough to create custom coded themes. If you want to challenge your programming skills, you are only really limited by your imagination when creating plugins.
And lastly, WordPress developers command an average salary of around $70,000 in the United States. Imagine what you could get if you’re good.
The different types of WordPress development
We broke WordPress development down into three different sections:
– contributing to core
– plugin development
– theme development
Here’s a little more detail on each.
Contributing to WordPress core
WordPress is an open source platform. This means that it is available to everyone for free, and everyone is free to modify it. As the platform is offered for free, it relies on its user base to improve it. WordPress is open to anyone to offer code improvements to the core software.
327 people contributed to the WordPress 5.2 release in May 2019. Anyone can contribute to WordPress. You can do this by raising a ticket if you spot any bugs in the latest version of the software. If you’re confident in your coding skills, you can also offer a solution to tickets raised by others, which you can find in the Making WordPress community.
Plugins extend the functionality of WordPress themes. At its core, WordPress is a fairly simple CMS, offering the possibility to create blogs or simple websites. It is not overburdened by multitudes of features that the user may not want. Plugins give the user the opportunity to extend the feature set of WordPress. A great example is the WooCommerce plugin, which turns a WordPress site into a fully functioning online store.
Not all plugins need to be quite as complex as WooCommerce however. Your first plugin could be much simpler. Technically, you could create a plugin that does nothing more than add an image of a cat to a WordPress site.
This would be pointless as it would be easier for the user to just add the image themselves using WordPress’ built in image upload tools. It would also offer design rather than functionality, meaning it should fall within the remit of a theme. But it would technically be a plugin.
If your plugin used an API to send the website an image of a different cat every day, that might be something that some users could possibly consider worthwhile. Cornify for WordPress is a plugin with a 5 star rating and 30 active installations. All it does is display pictures of unicorns on your site to attract your user’s attention if they are inactive for five seconds. If you crave the attention of your users and will use any trick in the book to get it, this could be quite useful. Frankly, we’re shocked the big social networking sites like Facebook and Twitter haven’t copied the idea.
Themes control the appearance of a WordPress site. Your WordPress theme consists of various template files that control the appearance of different parts of your site. For example, the header.php file controls what appears in the header, and the footer.php file controls what appears in the footer. You probably could have guessed that. It might not be so obvious that single.php contains the design for a blog post though.
Your theme also contains a degree of functionality, contained within the functions.php file. This file acts like a plugin, offering design-related functionality. It is the place where you should load your scripts and your styles, create image sizes and disable the Gutenberg editor.
WordPress theme developers can create custom themes for clients. They can also build their own themes to sell on a theme marketplace such as Themeforest. WordPress theme developers with all the key coding skills will also be able to extend the functionality of other pre-built themes. If a client comes to you with an off-the-shelf theme that doesn’t quite do everything they want it to, you can extend it with a child theme.
Development skills will also increase the potential of what you can achieve with a page builder. Some might say you can’t achieve certain things with a page builder like Elementor or Divi. With coding skills, there’s no limit to what a Divi or Elementor based website can do.
There’s plenty to learn as a WordPress developer. There are four core languages that every WordPress site uses, and you will definitely need to know three of them to get started, while the fourth will enhance your abilities significantly.
If that sounds daunting, two of the languages are fairly straightforward. They aren’t programming languages, and you can pick up the basics of how they work in a matter of hours. The two programming languages are admittedly harder to grasp, but they share a lot of concepts in common.
In addition there are many other non-essential technologies that will help you build better sites or just make your life easier.
The most fundamental language of the internet is HTML. HTML is a mark-up language. The name is an initialism for Hypertext Markup Language. This means that HTML code basically represent what you see on the screen. If you want an image or text, you would use HTML. HTML’s only responsibility is to output the element on the page. It doesn’t take any responsibility for how the element is displayed.
What that means is that all the text will be output in Times New Roman, and every element pushed hard to the left of the site.
Here’s an example of the BBC news website without any styles.
In code that would have looked something like:
If you want to make this look better, you’re going to need to learn the second fundamental language in web development: CSS.
CSS stands for Cascading Style Sheets. Stylesheets refers to what is achieved with this language: they provide styling. This includes colour, size, layout, everything about how a website looks, is done with CSS. The cascade part refers to how CSS prioritises one rule over another, because you will often write multiple conflicting rules for one element.
With the combination of these two languages, you can make a simple static brochure-style website that provides information about your business. You can make it look however you want. If you want to go a step further and make it do something beyond displaying information, you will have to learn a programming language.
Learning CSS and HTML is not particularly time intensive. In fact, the fundamentals of HTML and CSS are covered in just four hours of Web Courses Bangkok’s Web Design Essentials class. If you want to read more on these technologies now, you can check out the reference guides at MDN.
PHP originally stood for Personal Home Page, but now stands for PHP: Hypertext Preprocessor, meaning that the abbreviation references itself in the first letter, which is pretty bizarre. This is known as a recursive acronym, and probably isn’t what you came here to learn about.
PHP is a server-side language. In a WordPress installation, PHP connects a MySQL database with the front-end of the website. In the back-end user interface of a website, the user’s inputs are saved in a database. PHP retrieves the data from that database and delivers it to the front-end of the website. What this means is the user doesn’t have to be able to write code for them to be able to change details on their website.
For example, this code will retrieve everything you write in the WordPress content editor and send it to the front-end. Note, this code needs to be inside the WordPress loop in order to work, which we cover later.
PHP is not a fundamental language in web development. In another setup you could use a different server-side language such as Python or Ruby. However PHP is fundamental to WordPress development. WordPress’ core is coded in PHP, and so are themes and plugins. To be a WordPress developer, PHP is essential knowledge.
Here’s a simple example of the code that would turn the background of the page red when the button is clicked.
In 2015, WordPress founder Matt Mullenweg gave a piece of advice to assembled WordPress developers at his keynote speech at the State of the Word Conference:
All of the following skills are not strictly necessary to be a WordPress developer, but they will all prove valuable.
MySql is the open source database WordPress uses to store data for the site. You could use an alternative database, but MySql is the default. Understanding how the database works will help you get better as a WordPress developer, however you can easily build themes and plugins without ever touching it.
If you were running a site about cats, but suddenly decided that you actually prefer dogs, you could change all instances of the word cat to dog in your posts using the database. Using the SQL language, you could enter:
Now your users can enjoy lots of great content about dogs stuck in trees, eating mice and playing with yarn. They might also enjoy reading about your trip to the doghedral, browsing for products in your dogalog and playing dogch with your son in the backyard.
Please bear in mind this is just an example and don’t actually ruin your website.
Here’s how to select paragraph elements with jQuery:
Git is a version control system. With a version control system, you store all your code in a repository. After you make some changes you update the repository, which is known as making a commit. If you want to roll back to a previous version, Git makes it very easy to do so. It is also very helpful when working in teams.
You’ve been working on a new page for your site: page-amazing-design.php. You’ve been committing changes to a Git repository periodically. But since your last commit, everything you’ve done has been rubbish. You’re not sure what you were thinking. It’s almost as bad as that time you swapped out all instances of the word dog for cat. With Git, all you need to do is open up the command line and type in:
No need to press Ctr-z a zillion times and hope to get back to where you were. Git has you covered.
Sass is a CSS preprocessor. A CSS preprocessor allows you to write CSS in a different way, before converting it to a CSS document. Sass applies the principles of programming languages to CSS, and allows developers to write CSS code more efficiently.
One benefit of Sass is the ability to write nested CSS commands.
Rather than three separate rules:
We can nest the commands inside the selectors:
This is just three rules. You can imagine that in a website with thousands of style rules, this will make things much easier to read.
It isn’t necessary for you to know anything about search engine optimisation (SEO) to create a WordPress site, but clients will want websites that are optimised. Nowadays this is a fairly standard expectation. However good SEO optimisation is mostly a case of following good practices. A good teacher will ensure you learn SEO principles as you learn to build WordPress sites and not teach you bad practices.
Something of obvious importance to SEO is how your site looks in search results. The information here is controlled by your title and meta tags in the head of your website.
If you don’t set this information yourself, you’re leaving it to chance. You don’t want to have ‘Just another WordPress site’ as the key information people see about your website.
We’ve covered the key technologies you will have to learn in order to become a WordPress developer. Now we will explore some of the core concepts you need to know in order to understand how WordPress works.
The WordPress Theme Hierarchy
A WordPress website is a collection of files connected to a database. Unless you’re contributing to core, you won’t be altering any of the core WordPress files. You might make some changes to the .htaccess or wp-config files for various reasons, and you will likely refer to core WordPress files in plugin development, but otherwise you will be sticking to the wp-content folder.
For theme developers, you will be working with the folder of your theme that you have in the themes folder in wp-content. Inside this folder will be a collection of theme template files. We touched on a few earlier in the article: header.php controls the header, footer.php the footer and single.php the footer.
Familiarizing yourself with these files is crucial to being able to build a WordPress theme. The key concept to the WordPress theme hierarchy is understanding which file WordPress will use to display your content. It chooses files using a hierarchy.
The base file WordPress will choose for any type of content is index.php. So make sure you include an index.php file as a fallback in your theme. If a user is viewing a page on your site, it will use index.php unless page.php is available. Page.php is above index.php in the theme hierarchy, so WordPress will look for it before index.php when it is looking for a template for a page. If it can’t find page.php, it will move down the hierarchy to the next file. If you have a file called singular.php, it would call that, otherwise it would be the base file, which is index.php.
A graphical version of the full theme hierarchy is below:
The WordPress Loop
Loops are one of the fundamental programming concepts you will need to be familiar with as a WordPress developer.
WordPress has a built-in loop which is responsible for outputting posts on to the page. A loop suggests multiple iterations. The WordPress loop will output multiple posts on your blog page, but this loop will also output the content of one post on a single post page. The looping actually happens on the server side: WordPress is going through the posts in your database and serving up the correct post when it finds it.
A simple implementation looks like this:
This block of text starts with an if statement to check that there are posts available. If there are, it starts a while loop, which will loop out every post that meets the needs of the page. The the_post(); function retrieves the data for the post, while the_title(); and the_content(); are responsible for outputting the title of the posts and whatever is entered in the WordPress content editor. The latter two won’t work without the former.
This is the result of a post loop on Web Courses Bangkok’s articles page.
There are obviously a few differences. WCB’s post loop only outputs an excerpt, not the full content. It’s been styled. It lists tags, an author and a read more button. However the WordPress loop, the_post() and the_title() tags have all been utilised here.
This post loop is also used for pages. This is because pages are a custom post type, which we will discuss next.
Custom Post Types
In WordPress all content is considered to be a post. If you want to customize that content to differentiate it from a regular post, you will want to use a custom post type.
For example, we mentioned that pages are in fact a custom post type, despite being part of WordPress by default. You would use a regular post for an article or blog where the time it was posted is relevant. You would use a page for information where the time it was posted isn’t relevant. So on your post pages you would output the published date, whereas you would want a different template for pages which does not output the date. There are many other reasons you might want to differentiate your content so that it is not a post or a page, but something different.
You would also likely have a page that outputs all your recent blog posts. By differentiating the About page as a page, rather than a post, you won’t be outputting the About page in amongst your blog posts. That would look strange.
On Web Courses Bangkok’s site, you’ll notice that we offer a lot of courses. When we launch a new course, we don’t create a post. We use a custom post type called ‘Courses’. This allows us to differentiate course content from our articles. We’ll revisit this example in the next concept.
Custom Loops with WP_Query
In Custom Post types we talked about a page that outputs all your recent blog posts. In WordPress lingo, this is referred to as an archive page. Perhaps you want a couple of archive pages. Imagine you have a site that you target at pet owners. You know the dog people don’t want to look at posts about cats – come on cats, where is the love? And the cat people definitely don’t want to read posts about how great those brutes that chase their cats are.
For this, you would need to use a custom loop. The custom loop is just like the regular WordPress loop, except you have more control over its output. Here’s a basic implementation:
This loop uses the WP_Query object to achieve this. This is a good example of how advanced level programming is used but knowledge isn’t necessarily required in WordPress. Object-orientated programming is an advanced level topic. However you don’t need to know how to write this object. You just need to copy and adapt. In time, it will help to learn how the WP_Query object works, but if you’re just starting out, don’t feel the need to know how this works in order to use it.
We talked before about the Courses custom post type used on our homepage. An example of WP_Query in use could be the courses grid on Web Courses Bangkok’s homepage. These are not regular posts, so they aren’t included in the articles section of the website. Nor are articles included in the course grid. This makes it easy for staff to add courses in the back-end of WordPress and see them appear on the homepage without having to alter the code.
Categories and Taxonomies
In WordPress, we have more than just custom post types to differentiate content. WordPress as a whole is very good for information architecture – that’s a fancy term for how you arrange information – it is after all a content management system. If it wasn’t a good way to manage content, it wouldn’t be very useful.
Learning how information architecture works in WordPress is crucial, and another important concept is taxonomies.
By default, WordPress comes with two taxonomies: categories and tags. A taxonomy essentially groups things together.
For instance lions, tigers and a Tabby cat could all be categorised as ‘cats’. You might however want to tag the first two as ‘ferocious’ and the latter as ‘cuddly’ to further group these cats within the category.
In addition, you could create your own custom taxonomy. You could use your custom taxonomy to further group your cats by their titles. A male lion would have the ‘King of the Jungle’ title (the species is unlikely to embrace gender equality any time soon), tigers would have no title assigned, while your Tabby cat would have the title of legal owner of your web development business for tax purposes.
If you look again at the courses grid on the WCB homepage, you’ll see the courses are different colours. Development courses are blue, marketing courses are red, web design courses are green and graphic design orange. This is an example of taxonomy. You could easily use your custom taxonomy, or the default categories or tags, to determine which colour each course should be automatically.
Hooks: Actions and Filters
This is a more advanced level topic that you might not use much in WordPress theme development. You will need to know more about it if you are developing your own plugins or working with other developers’ plugins however.
Hook points in WordPress are pieces of code that allow you to insert your own code. Remember how we said that you will never be editing WordPress’ core files when developing themes or plugins? The reason for that is because when WordPress updates, it won’t include your edit in the new update. Fortunately, WordPress will always include the same hook points in every update. They strive to maintain backwards compatibility and never take away any old hooks.
So all you need to do to edit how WordPress works is to target these hook points and send your code there.
There are two types of hook. Action hooks are a space where you can insert code, filter hooks allow you to modify data.
The reason this concept becomes essential for plugin development is that the best plugins give you hook points to insert your data. If you’ve ever looked for a really popular plugin such as Gravity Forms on the WordPress plugin repository you will see numerous plugins that extend the features of Gravity Forms.
They are able to build these extensions because the developers of Gravity Forms included hooks in their plugin that other developers could target. If you want to build a good plugin, you should be including hooks to allow developers to modify your plugin without having to rewrite it.
There is less need to use hooks in theme development, however everything you write in functions.php will have to be hooked into WordPress somewhere. You could use a starter theme which sets up all the fundamental functionality for you, but you should be aware of what it is doing.
The following is the optimal way to include your CSS files in your WordPress site:
This function should be placed in the functions.php file of your theme. The part that begins add_action is where your theme targets an action hook in WordPress to run your function that contains your styles.
For more information on these key concepts, you can refer to the WordPress codex or developer resources. All of these concepts are of course covered in Web Course’s Bangkok’s WordPress Developer Bootcamp.
Freelancing: Monetize your skills
Unfortunately having development skills and understanding WordPress doesn’t automatically translate to money. If you’re looking to develop WordPress sites as part of your career, and not just as a hobby, you’re going to need to know how to monetize your talents.
There are various ways to do that. As an entrepreneur, a WordPress site can be a key part of your business. If you sell products exclusively online or you make money as an affiliate marketer, it would be the core component of your business. WordPress could be even more central to your business if you use WordPress to sell WordPress plugins or themes.
You would also have the skills required for jobs at web development or web design firms. Large organizations often have their own in-house web development teams and plenty of them use WordPress. However we find that most of the students at our school want to learn WordPress to have the freedom to work for themselves. We’ll therefore be focusing on working as a freelance WordPress developer.
Build a portfolio
This might seem like really simple advice, but if you’re going to claim to be a web developer, make sure you’ve got some evidence to back that up.
If you were applying to drive a truck, a company would ask to see a license before handing you the keys. You don’t need an official license to practice web development – because there isn’t any danger of you crushing people to death with a ten-tonne 18-wheeler – so people demonstrate their skills by showing clients examples of their work.
There are plenty of developers out there without a portfolio. That could be because they worked for years as a developer in a company but have no right to use any of the work they did in a portfolio. In some cases, it’s because they watched a two-hour YouTube video and have severely underestimated the knowledge needed to build a decent website.
Here’s some less obvious advice: build websites you can use in a portfolio as part of your education. Even a website that you built coding along with a video is better than having nothing. At Web Courses Bangkok, our intensive web design and development courses require students to complete portfolio-worthy projects.
To work as a freelance WordPress developer, you need to know how to find clients. There are plenty of ways to do this.
The infamous freelance marketplaces
The most obvious way is to set yourself up on a freelance marketplace like Upwork or Freelancer.com. Many experienced freelancers are going to tell you to avoid these marketplaces like the plague. And they have a point. These marketplaces are where everyone else went to find work as well. As a result, there is intense competition. This drives prices down to the level of the workers in third world countries who can live on a lot less than you can. This then attracts clients looking for a bargain. These clients are best avoided.
On the other hand, there are undeniably plenty of people who are successful in freelance marketplaces. They learn how to stand out from the crowd in these marketplaces and earn very good rates for their work. Obviously standing out from the crowd means these people are in the minority. We’d suggest you should only use freelance marketplaces if you have a really good idea how you’re going to become part of the well-paid minority instead of the low-paid majority.
Finding clients locally
Instead of competing with the whole world for a job posted online, you can start in your hometown. This means going to small business meetups and other networking events and talking to potential clients in person. This gives you an excellent opportunity to meet people in person, make a good impression and be the go-to choice when anyone needs a developer.
An even better method is to find a local niche. Perhaps you are really into art. You could indulge that interest by going to meetups for artists, drawing sessions or art exhibitions. Talk to people and find out about their business, and of course, tell them what you do. You’d be amazed how many people need a website. There are plenty of people who can build websites, but if someone needs an art-related website, if you’ve made yourself part of the community, they will tell everyone you’re the person to go to.
A bonus of web development is that it’s pretty easy to find out if a potential client needs web development work. Pick out an ideal client and see if they have a website.
- If they don’t – great, send them an email explaining the benefits of a website to their business and why they should hire you.
- If you thought they didn’t have a website but they do, great – they need better search engine optimization (SEO), you can optimize their site for them.
- If they definitely already have a website – great, have a look around and find ways you can improve it for them.
Sending cold pitches is going to be heavily dependent on your writing and marketing skills. The bonus of this method over going local is that you aren’t restricted to your hometown. The bonus over a freelance marketplace is that there won’t be any competition. It may be demoralizing to not hear back from a cold pitch, but plenty of advertised jobs on freelance sites never hire anyone either.
So now you’ve got the skills, and found a client, it’s time to get to work. However, building a website can be a pretty big undertaking. Here are a few things to bear in mind.
A happy client is a client whose expectations are met. Don’t tell them you will have their 15-page website built in a week. When you fail to deliver in time, they will be disappointed. A client that’s disappointed with your work isn’t going to refer you to any of their network. Worse, they might decide they want to cancel the project.
Make sure you are realistic with your estimations. You shouldn’t promise things you can’t deliver. Don’t tell the client their search functionality will be as good as Google’s. Don’t let them think the website can look exactly the same as the design on all different screen sizes. Be clear you’re not available 24/7 so they don’t expect you to fix a bug at 2am if you’re not going to do it.
Agreeing a contract is a necessary step before beginning work. It puts the expectations for the work to be done in writing. It defines the scope of the project. It will protect both you and the client from getting a bad deal out of the collaboration.
If you don’t agree a contract, your client will ask for more work than you intended to do. It’s just human nature to want more. Bear in mind that clients generally won’t understand web development. They won’t know how much work goes into building out a page to pixel-perfect specifications. They saw a Wix advert and think knocking up a new page will take you 20-30 minutes.
If you informally agree to build a five-page website, by the time you’ve built page four the client will want an eight-page website. They will say, ‘If you could just…’ followed by a request that they make sound like it will take five minutes, but in reality will take a couple of days. This is what we refer to as out of scope work.
It might seem easy to say no to additional work, but you are eager to please. Sometimes it might not be obvious what constitutes out of scope work. Maybe they don’t want three extra pages, but they would like a fixed header on their site. That doesn’t seem like too much extra work so you implement it. It’s technically out of scope but a happy client will refer you to other clients.
The client messages you some time after saying that a link that was supposed to scroll content into view doesn’t work properly. You check and see that the only problem is the fixed header blocks the top of the content from view. Now you need to recode this link. There are eight other places on the site where the same thing happens. Is fixing this out of scope or not? If only you’d had a contract that made it clear.
If you’re wondering why that example was so specific, well… some of us have to learn from experience.
We’re not saying you should never do extra work for a client that wasn’t in the contract. But if you have a water-tight contract, you can highlight the fact that you are going the extra mile for them when you agree to it. Otherwise they won’t appreciate that you did extra work. If the extra work is particularly laborious, you could have an hourly fee agreed up front for out of scope work work. This avoids disputes over features your client may have now decided are essential for their site.
Web Courses Bangkok teaches you how to craft a secure contract in our intensive courses. You could get started on putting together a contract right now by Googling for many of the template contracts featured online and populating them with your own terms and conditions.
Good communication is critical, but it’s amazing how few freelancers possess these skills. Good communication skills doesn’t mean being cognizant of advanced level English vocabulary like…cognizant (which means to be aware of something). In fact it’s the opposite. Don’t confuse people with a big word when a simpler one will do. You’re more likely to make them feel dumb than make yourself seem clever. And people don’t like to feel dumb.
More importantly, be aware of when you need to communicate with your client, and what they need from you. If you’ve been working on a project for a few weeks without communicating with your client, they might start getting nervous. They might think you took the up front fee and they will never hear from you again. Address this fear with regular updates that demonstrate you’re working hard on their project. Understand their concerns and answer them.
In freelancing, communication skills are arguably more important than your WordPress skills.
Managing a project also means you must have all the resources you need to complete it. We’d assume that you have a computer and a text editor, but what if you need to do some image manipulation? Are you going to need an Adobe Creative Cloud account or do you have a different means of editing images that will get the job done?
The more difficult side of the resource equation is the client. Are their designs ready? Do they have the written text content prepared? Have they chosen a banner image for the About page yet?
If they delay on these, it will be you who suffers if you aren’t doing any work. Unless you’ve agreed a daily rate, if you’re not working, you’re not getting paid. Make sure you request resources in good time. Use your communication channels to remind your client of their responsibilities.
While it can be difficult to take on more than one project at once, particularly early in your career, it’s risky to rely on one client who could easily let you down.
So that’s it! A high level overview of everything you need to know to become a WordPress developer. We’ve linked to some additional useful information throughout the text for further reading. If you’re ready to take your WordPress education to the next level, the WordPress Development Bootcamp at Web Courses Bangkok has been developed to ensure that you learn everything covered in this article. See you in class!