This helpful walk-through goes over debugging WordPress core by tracking hooks, actions, and filters and knowing when to use and implement them.
Most WordPress developers are familiar with the concept of actions and filters. At the very heart of WordPress, these hooks allow developers to extend the functionality of WordPress in numerous ways. Whether you want to run a process when a post is saved, add a new section to the Edit User page, or modify the SQL used when querying the database, WordPress has hooks for (almost) everything. One thing I’ve noticed a lot, as a frequent user of the WordPress StackExchange, is that many developers don’t know where to start when trying to figure out which actions or hooks might be available to them. In this blog post, I want to help walk through the process of tracking down various hooks with examples of when you might want to use them and how to implement them.
Actions and Filters: What’s the Difference?
This is a very basic mistake I see often when helping people figure out their WordPress issues. They want to modify the Query with the pre_get_posts filter, but they can’t figure out why their code isn’t modifying anything. Well, let’s take a look at a basic example that sets the post_type parameter to “page”:
add_action( 'pre_get_posts', function(
Face 2019 with some new knowledge of your website. Read over these design and development myths and learn what you can do right in the new year.
I’ve written about New Year website prep before and how this is a popular time to give your website a good once-over for the new year. You can read Get Your WordPress Site Ready for the New Year: What to do Now! for some helpful ideas on getting things running smoothly. Every client that I work with has ideas about what their new or existing website needs without really thinking about what it means for their website in the long term. New or potential clients have their own misconceptions around their potential websites as well, so I thought it might be helpful to talk about some design and development myths or misconceptions and address them so you can face 2019 with some new knowledge. Myth: Sliders and Hidden Content Are a Must
Let’s make a resolution right now: no more carousels, sliders, modals or accordions.
Starting a new series of "quick tips" on RachieVee. My first quick tip is about how WP body classes can help orient ourselves within the WordPress template hierarchy.
Let’s talk about WordPress body classes! But first, an explanation of what this is. This is the first short post, from what I hope will end up being several short posts, called “Quick Tips”. It can take me weeks to write a “normal” sized post on RachieVee, and so, in an effort to keep myself active in 2019, and still pass on tidbits of knowledge, I’ve started this new category. I have also categorized these “Quick Tip” posts based on developer experience. This first post is geared towards “Beginners”. This level is meant for developers just getting to know how WordPress themes work. What are WordPress body classes?
Back on topic! WordPress body classes are exactly what they sound like. They are HTML classes applied to the body tag of a WordPress site. WordPress themes use the body_class() function to apply these classes auto-magically.
If you’ve ever had an error show up on the front-end of your site, or if you’re looking to change something in a WordPress theme – taking a glance at these classes are a quick way to orient yourself. While these classes won’t tell you exactly what template to look for
According to the webpack website:
Now you might be asking yourself, what is a dependency graph? In webpack, there are files specified as entry points. These entry points are at the top of the dependency graph. Any files required or imported from the entry files will be processed and bundled by webpack.
There are plenty of ways you can rely on reusable code snippets to save time and provide you with the best possible work and turnaround.
When was the last time you started a project from scratch? I mean literally from scratch—not using a framework, a parent/child theme, or any plugins. Maybe never? One could argue that as long as you’re using WordPress that you’re not necessarily creating anything from scratch since the CMS offers so much functionality out of the box already. What you do, though, is iterate on that functionality and build upon the tools provided to you or the tools you have built for yourself in the past. After all, if you’re doing work around the house and need to hammer some nails into the wall, you’re not going to head into your garage to carve the wood and forge the steel to make a new hammer every single time (unless you’re our very own builder and wood magician Will Schmierer). You’ll use the same hammer to do the same job until the hammer is no longer useful or you find a new tool with which to replace it.
Why then would you not develop a site in the same way? Granted, most projects are going to require distinct sets of functionality unique to the projects themselves but there are plenty of ways you can reuse code to save time so you can truly focus on
Learn about the benefits of Headless WordPress with React and NextJS from a Senior Frontend Developer at WordPress development agency WebDevStudios.
We recently discovered a situation where we were able to find some fun and interesting ways to extend our standard ACF Flexible Content Blocks. Let's dig in and find out what we did!
Here at WebDevStudios, we do quite a bit with Flexible Content Blocks in Advanced Custom Fields (ACF). If you aren’t familiar with the plugin, ACF allows for the creation of a multitude of custom meta field types using a graphical user interface (GUI) in the WordPress Dashboard. You can do almost anything with these fields—from simple text and URL inputs to searching for posts and pages and building image galleries. ACF allows you to power your site with robust customization options, which you can use to create and manage dynamic pages. Instead of being locked into a set of page templates where the functionality and layout are tied directly to the theme’s files, building pages with ACF Flexible Content Blocks puts the power of customization into your hands as a site manager and editor. You can add, remove, and rearrange blocks as needed and have full control over the content within each of those blocks.
Sometimes, though, simply customizing the content within those blocks isn’t enough. Sure, it’s nice enough to be able to edit the title of a block or select a different set of Featured Posts to display. But, what if you don’t want to have to get that
Mario Peshev of DevriX explains in detail why "affordable WordPress development" ends up costing a lot later on down the road.
When I switched to WordPress over a decade ago, I was aiming at maximizing RAD (Rapid Application Development). But not for the reason everyone assumes first.
Coding Can Last Forever
My background in engineering is enterprise-grade development. I spent a few years with Java (JavaServer Faces, Google Web Toolkit) and some dabbling into .NET.
Gathering a team of 20+ working on a project for 5 years is significantly different than bootstrapping a powerful application in two or three months.
Throughout my transition period, I switched between web and mobile Java development, Python (Django) for a UNICEF project, programming for set-top boxes before smart TVs were a thing, and PHP development with CodeIgniter, CakePHP, and custom frameworks.
I even tried to sell my own custom Java CMS, but this was pointless. I couldn't match the "time to market" with PHP's abilities, nor the server costs back in the day.
WordPress Can Be A RAD Framework
This is one of the reasons why WordPress currently powers nearly 33% of the Web.
A PHP-driven CMS promising backward compatibility, offering unlimited design opportunities, a streamlined editorial experience, and a powerful modular infrastructure
Hooks - the most powerful feature of WordPress. Also known as actions and filters, we will look at what they are, how to use them and why they can really change the way you develop with WordPress.
Introduction I have been using WordPress for many years – all the way back to version 2.0 in 2005. A key breakthrough for me, in terms of being a WordPress developer, was when I finally fully understood how to edit the behaviour of WordPress and plugins and themes using hooks.
I hope by reading this post that you will come away with a better understanding of what actions are, how they are used and how you can use them to extend WordPress and of course your own plugins and themes.
Video: Using a filter in WordPress
Before I get into the details of this post, I thought it would be a good idea to show you a hook in use. This video is a demonstration of using a hook in WordPress to modify the output of the tag cloud widget.
Hooks are a way for one piece of code to interact/modify another piece of code.
What are WordPress hooks and how do they work?
Hooks are what WordPress uses to allow one piece of code to interact with and/or modify another piece of code. For example, a plugin could modify another piece of code which WordPress runs. WordPress also makes extensive use of hooks to modify its own code.
Hooks are named events (such as save_post) to which developers can attach functions.
This... this is absolutely the right solution. Hope it happens.
Over the past week, developments which I predicted back in December last year have come to fore, and I am deeply concerned about the effects they will have on WordPress (the application) and the community unless we take decisive action. Short version: For various reasons, many WordPress users will be faced with a complex dilemma when 5.0 and Gutenberg comes out:
a) Get the latest version of WordPress and risk compatibility issues / costly retraining, redesign, or entire rebuilds, and/or other problems, or b) choose not to upgrade and end up running an old and eventually insecure version of the content management system.
So far, the response from WordPress leadership has been to install the “Classic Editor” plugin which as the name suggests reintroduces the classic WYSIWYG editor once the Gutenberg Block Editor becomes the default. This is, in my opinion, a dangerous road to go down both for the end-user and WordPress itself.
Classic Editor as a permanent solution won’t work
Classic Editor is a bit like using a band-aid to plug a hole in a ballon as you are inflating it. It may work right now, but as the balloon continues to grow, the band-aid not only won’t do
I've sold my laptop and replaced it with an iPad Pro. I go over the things it does really well, as well as some of the stuff I wish it did better (like development).
Since going out on my own full time, my tech stack has been a bit of a revolving door. In the quest to find the perfect set up I went from a MacBook Pro to a PC / smaller MacBook for travel. Less than a year later and I’m not too happy with that setup. Nothing against the PC, but living in two-thirds Apple land makes having parity between machines very hard (plus, Camtasia, my main video editor, is a hot mess). So when Apple announced the new iPad Pros, I made a decision to go with that and only that as my travel machine. So first, as much as I like the idea of an iPad-only lifestyle, I simple can’t (not yet anyway). The video and audio editing tools are not nearly as good on iOS as they are on macOS, and doing local development is much much easier.
Primary Machine: The iMac Pro
So what does 2019 have in store for my tech setup? Well, last year I cheaped out because I though a PC would be just as good as an iMac Pro. So I’m selling both my MacBook (sold) and my PC (still working on that one, if interested), and I’m buying an iMac Pro as my primary machine. This will bring me wholly back into Apple’s ecosystem and allow me to use all the tools I currently
PHP 7.3 is knocking on our door and with it comes new useful features, functionalities, deprecations, and a good number of bug fixes. This release is definitely all about developers!
PHP 7.3 is knocking on our door and with it comes new useful features, functionalities, deprecations, and a good number of bug fixes. This release is all about web developers. The current Beta 2 version was released on August 16, coming perfectly on time with the PHP 7.3 timetable. You can download the current PHP 7.3 version for your development and testing, but keep in mind that, this shouldn’t currently be used in production environments.
In this post, we’ll provide an overview of the features and changes that we personally consider most relevant. But you can always check the full list of features, changes and bug fixes in PHP 7.3 upgrade notes and PHP 7.3 Requests For Comments.
What’s new in PHP with PHP 7.3?
In this post we’re covering the following PHP 7.3 changes:
Flexible Heredoc and Nowdoc Syntaxes
This is probably one of the most relevant improvements coming with PHP 7.3, and we think it deserves a little more attention. So, before diving into PHP 7.3 heredoc/nowdoc changes, we’ll provide a quick overview of this useful core feature. If you are already confident with nowdoc and heredoc, feel free to jump to the PHP 7.3 changes.
An overview of
Vue.js WordPress Starter A WordPress Vue.js starter plugin with required toolbelts
This Senior Frontend Engineer is leaving Homestead and takes the reader on a journey to discovering the best all-around local development environment.
Back in 2016, I wrote a blog post about using Laravel Homestead as my local environment. At the time, my only real options were Vagrant or MAMP as an Apple user. Since then, the number of options has increased slightly to include Local by Flywheel, a more significant push to using your computer, and a set of packages like nginx and dsnmasq to run a local environment from a directory on the fly. At the time, Homestead was my local development environment of choice because it was easy to install, quickly configurable, and lightweight—something I appreciated using an older MacBook Air as my daily driver at the time. However, the more robust my sites became, and the more websites I collected on my local, the slower Homestead appeared to run almost certainly because it relies on VirtualBox or a virtual system to run your instance, which caused me to look elsewhere. I avoided MAMP or Vagrant and similar software because they were too resource heavy for my late 2011 setup for many of the same reasons.
Flywheel offers a solution (at the time called Pressmatic; Flywheel acquired the company in late 2016), which provides individually configurable docker instances in
WP Reset is free (no pro version, upsells or any of that nonsense) WordPress plugin primarily aimed at developers to help them develop, test and debug themes and plugins.
A look at the pros and cons of making the switch to Gutenberg. Existing sites may be better off staying put.
With the impending release of WordPress 5.0, the new Gutenberg editor will make its way onto millions of websites. It’s a big change in how content is created, stored and managed. Not to mention the potential compatibility issues that could crop up with some themes and plugins. As the new editor prepares for full release, we should note that the “Classic” Editor will remain available as a plugin. Activating it will enable site owners to use it in conjunction with Gutenberg or bypass it completely.
Because the Classic Editor affords us a second path, it’s worth considering whether or not to take it. Gutenberg represents a big shift in how WordPress operates. The question becomes, is it really worth utilizing the new editor on an existing site, or is it better to stick with the tried-and-true Classic version?
To answer that question, there are several factors to consider. So, before you take the plunge and switch to Gutenberg, here are a few items you’ll want to think about.
The Past and Future of Your Content
The content on your existing website, along with the way you manage it, has already been established. Odds are that your pages and blog posts follow
TL;DR: Tom McFarlin isn't planning to update any of his own plugins for Gutenberg compatibility until Gutenberg is in core and clients / end users are asking for it. But that's not because Gutenberg isn't necessary, only because clients can't ask for something they don't know exists.
I’ve been asked, on a few occasions, why I’ve not released anything that’s compatible with Gutenberg or why certain plugins aren’t compatible with the current version of the Gutenberg plugin. In the WordPress economy, I’ve seen few things as divisive as this shift in WordPress (though it seems to be finally have chilled a bit). And I’m not interested in entertaining a position on it on this blog.
But when others ask why I’ve not bothered to write anything about it or make certain plugins compatible with it, I find that it’s worth talking about it at least to a certain degree.
Demand for Gutenberg Is Not There
As far as building solutions for others are concerned, there’s yet to be demand for Gutenberg compatibility at all. This doesn’t mean that people don’t see it on the horizon nor that they don’t see the need to prepare for it.
But customers who pay WordPress developers, designers, and other experts in our field aren’t using it right now, so the demand for building something on Gutenberg is not there.
Another way of looking at is that there’s interest and potentially even a demand for it for those
In this article, we're going to build on what we have looked at previously in this WordPress Deployment series and consider some alternative hosted services that can help us with automated deployments for our WordPress site.
In my last article, we looked at different methods of deploying a WordPress site using Git. We also looked at using an external CI service (such as Travis) to automatically trigger a deployment on your remote git repo. In this article, we’re going to build on what we have looked at previously and consider some alternative hosted services that can help us with automated deployments for our WordPress site. There are many hosted services that we could use to deploy our WordPress site but we’re just going to look at a few of the bigger ones: Buddy and DeployBot. Unlike Travis, these services are dedicated to automated deployments and offer a lot more functionality and flexibility.
As I’ve mentioned several times now, for the purpose of this series I’m going to assume you have your site stored in Git and you are using Composer to manage your WordPress site, plugins and themes. If you’re looking for a quick code example to get you going you can use this skeleton repo I’ve set up (that I’ll also be using for demo purposes in this article).
As was the case in my previous articles, I’m also going to assume you have a destination server
This is why CSS Grid & Flexbox are powerful platforms and why they're very much recommended by experts
Flexbox and CSS Grid have both provided web property developers with more convenient ways to do website design from scratch. The amount of control that they give to developers, particularly when customizing and styling complex web pages, is unprecedented and instrumental. More importantly, both these platforms are vital for ensuring that your website would always be able to adhere to responsive design guidelines. Often, comparisons are made between CSS Grid and Flexbox. While there are noticeable differences, what’s sure is that both are reliable and actually work extremely well if used together.
Advantages of Flexbox & CSS Grid
Avoids dependence on third-party libraries
CSS Grid and Flexbox were invented and developed to overcome a major hurdle prevalent in standard CSS layout system: the overreliance on third-party libraries. These libraries were often used to make up for the features that web developers have found to be lacking in the system. These third-party libraries were usually utilized to perform steps that are practically no longer needed to be done thanks to CSS Grid and Flexbox.
CSS Grid, after all, has its own grid layout system, which basically makes it easier
If you're like Pete, during development, you probably refresh your browser and click on buttons a million times a day to make sure you didn't break anything. Fortunately this can be automated by an end-to-end testing tool like Cypress:
Don’t fall asleep juuuust yet. If you’re like me, during development, you probably refresh your browser and click on buttons a million times a day to make sure you didn’t break anything. This clicking-on-buttons-and-checking-it-still-works is essentially what fancy people call end-to-end testing. I’ve been doing this a lot recently while testing the Theme & Plugin Files Addon and working through a refactor of the WP Migrate DB Pro codebase.
Fortunately, like other types of testing, there is a way to automate end-to-end testing.
In this post we’re going to cover Cypress and how it simplifies end-to-end testing in the browser. You can use Cypress to test any ‘critical path’ on your site. This can be actions like making sure your sales funnel still works after a code push, or that a contact form submits correctly. Anything you would normally test by hand you can automate with Cypress!
Cypress is a new-ish test runner that aims to simplify end-to-end testing.
Before Cypress you’d have to figure out which testing library to use (Mocha, Karma, Jest), install Selenium, choose an assertion library, choose a mocking library, lose
WebDevStudios has used Beaver Builder for several projects. The development documentation for Beaver Builder is pretty good, however it falls short in one particular area: custom fields. Our Senior Backend Engineer walks you through creating Beaver Builder custom fields.
At WebDevStudios (WDS), we’ve used Beaver Builder for several projects because it provides a quick and intuitive way for our clients to customize their websites. The development documentation for Beaver Builder is pretty good, however it falls short in one particular area: custom fields. What fields am I talking about? They’re the ones that show up when you’re editing a particular Beaver Builder module’s settings: There are a couple of links in the documentation to the templating used with custom fields, but no start-to-finish example. Let’s do one here so you can start creating your own custom fields.
For this example, I created a plugin with a Beaver Builder module called “Post Category List” to show a list of posts that are in the selected categories. The plugin is very simple—only the minimum amount of components are needed to create a Beaver Builder module:
A module class that extends FLBuilderModule
A module registration call – FLBuilder::register_module()
A frontend.php template used for rendering
Going over the common reasons for plugin/theme conflicts I've ran into too many times.
Going over the most common reasons for theme/plugin conflicts in WordPress and how to avoid them in your theme or plugin. In this tutorial we’ll cover how to restrict viewing comments and submitting comments based on whether the visitor is a customer.
In this tutorial we’ll cover how to enable comments functionality for EDD downloads and how to add “purchased” and “author” badges to the comments.
A good list of tools developers (and WordPress admins) can use to host a local copy of a WordPress website with links to tutorials on how to set these tools up. The list includes the typical WAMP, XAMP etc, Local, DesktopServer and also Docker!
Looking for a solution to install WordPress locally? While there are some pros and cons to working on a local WordPress install, I love this approach because:
It’s just plain faster because you don’t have to wait on your network connection.
You can work offline, which is great if you like to develop WordPress sites on-the-go (or live in a developing country with poor Internet, like I do).
It’s private by default. While it’s certainly possible to make a live development site private, it adds extra steps to the process.
If you’re looking for a way to install WordPress locally, you probably don’t need any more convincing on the benefits of this approach.
As someone whose job is to test hundreds of different WordPress themes and plugins, I’ve become well-acquainted with all the different methods available to install WordPress locally. And in this post, I’m going to share them with you, as well as link out to detailed instructions to help you get setup with whichever method(s) piques your interest.
5 Different Ways You Can Install WordPress Locally
Below, I’ll go through all the popular methods that you can use to install WordPress locally
In very simple terms, a Learning Management System (LMS) is a website that hosts eLearning programs and provides students and/or employees a way to participate in online training. In this guide to building an LMS with WordPress, learn about common features that you should consider when developing your LMS, as well as plugins to help.
In very simple terms, a Learning Management System (LMS) is a website that hosts eLearning programs and provides students and/or employees a way to participate in online training. Implementing an LMS with WordPress is something we have done for several clients here at WebDevStudios (WDS). For example, we implemented an LMS for Starbucks for their employee intranet. The corporation needed a platform they could use to train Baristas worldwide on the different drink recipes from their menu, as well as the equipment used to create those yummy treats! In this guide to building a Learning Management System with WordPress, I’ll take you though a plethora of common features that you should consider when developing your LMS, as well as plugins to help. Because WDS built a custom solution that uses WordPress, BuddyPress, BadgeOS and LearnDash, Starbucks’ employee intranet allows Baristas to log in, take quizzes based on training videos they’ve watched, and receive participation badges based on their training progress and quiz scores.
Common LMS Features
An LMS has several different features for online training. When the time comes for you to consider building a Learning Management