Loading...

Follow WPShout — WordPress Development Tutorials and More on Feedspot

Continue with Google
Continue with Facebook
Or

Valid



One the most common features that makes living with a membership site easier is the ability to quickly see what a given user is seeing. This can be a hard to do if you’re make a web app yourself, but if you’re using WordPress, there’s a plugin for that. :)

The plugin we’re talking about is called “User Switching,” by John Blackbourn. What’s great about it is that it makes is as easy as going into a user list, and clicking “Switch To” under their name. No need to know their password, or create a new account with a given level and log in to that one. Instead, you can use your existing WordPress Admin account and simply take on any other role you want in seconds.

Here’s a video all about it:

How to Quick Switch WordPress Users - YouTube

And if text is more your speed, here’s how to do it in a few simple steps…

How to Quickly Log In To Other WordPress User Accounts and Roles
  1. Install and activate the User Switching plugin from John Blackbourn by going to “Plugins > Add New.” Then you’ll search for ‘user switching’ and click the “Install Now” button, followed by the “Activate” one which will quickly replace it.
  2. Once you’ve installed and activated, you’ll simply go to the User list on your site while logged in as an Admin. There, under each user, you’ll see a “Switch To” link on hover. Click that link for the user you want to switch to.
  3. To switch back to you real Admin user account, you’ll have two options.
    1. If you see the Admin Bar, you’ll be able to find a “Switch back to…” link in the top right.
    2. If you don’t have that, you’ll see the option to switch back if you go to your WordPress login screen. It’ll be above the log in box on the page.
Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

An Introduction to Styling Themes for Gutenberg →

This is a great little post about the process of making a theme compatible with the much-discussed Gutenberg editor slated to come out in WordPress 5.0. ThemeShaper — the (maybe) official WordPress.com theming blog — goes into a lot of detail about what their theme team has done to get their themes ready for it.

They cover in good detail some of the issues they faced in trying to make good changes to the default styles, as well as the new add_theme_support calls you’ll need to make.

If you’re wondering what effect Gutenberg will have on your theming, looking at what the team has accomplished and how is a great idea. In MasterWP, Ben recommends that you test out the Ohana theme. Saying, “It’s the most complete example and has support for editor styles, and fully customized block styles.”

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

This article introduces one of the most important topics in WordPress development: WordPress hooks, including action hooks and filter hooks.

We’ve jam-packed this explanation of WordPress hooks with a helpful overview video, key points, a detailed infographic, a quiz, and even a summary limerick(!). That’s because it’s not just one of our normal articles: It’s a sample chapter from our “learn WordPress development” guide Up and Running, which will soon launch in its revised and expanded 3rd Edition.

The 3rd Edition will include a new section for developers on what Gutenberg means for the future of WordPress. If you like this chapter, check out Up and Running! Access is forever, so buy today, get learning, and you’ll automatically get the 3rd Edition when it ships.

Get Access to Up and Running

UaR: Hooks -- Actions and Filters - YouTube

Key Takeaways:
  • WordPress hooks are a crucial WordPress feature that allows developers to insert custom code into WordPress’s PHP processing, at specified junctions during that processing.
  • Developers write this custom code in PHP functions called hooked functions. Two kinds of hooked functions exist: actions and filters.
  • Two kinds of hooks exist: action hooks and filter hooks. Action hooks “hook in” actions, and filter hooks “hook in” filters.
  • Filters are passed code or markup by their filter hooks; they modify what they are passed, and must return the result back for WordPress to use in its regular processing.
  • Actions, by contrast, do not need to return a value, and often are not passed specific parameters by their action hooks.

In this chapter, we’re covering one of the most important ideas in WordPress plugin and theme development: hooks. You could also say that this chapter is about “actions and filters,” because actions and filters are the two kinds of functions that interact with WordPress hooks.

Understanding hooks isn’t all that easy, partly because the terms themselves are rather tricky to visualize and distinguish from one another.

But the payoff is huge: as a developer, we find that working with filters and actions is probably the most common way we interact with WordPress. And over time, it’s become one of our favorite things to do in WordPress, as well.

Terminology

Particularly in this case, understanding terms—”hook,” “action,” and “filter”—is half the battle. The WordPress Codex, for example, uses all three terms very casually and inconsistently.

The definitions we use in this chapter are the most common ones you’ll find in WordPress generally, and they’re the best for actually understanding what’s going on. So stick with the understanding we present here, and don’t get discouraged when other people use these terms in multiple ways.

How Hook, Action, and Filter Relate

Actions and filters are custom functions. They hook into action hooks and filter hooks.

This is just to get started; don’t worry if this doesn’t make total sense at the moment:

  • A hook is a place in WordPress’s code that can get functions added to it. When you create a hook, you give yourself and other developers the opportunity to add in additional functionality at that location.
  • Hooked functions are custom PHP functions that we can “hook into” WordPress, at the locations specified by its hooks.
  • Two types of hooked functions exist: actions and filters. Filters modify existing output, while actions can do any type of custom functionality.
  • Hooks come in two types—action hooks and filter hooks—based on which type of hooked function they accept.

Good so far? Don’t worry either way, and let’s move on. (At the end, you may want to come back and see if the above makes more sense.)

Here’s a visual summary of this information. It’s also in WordPress Hooks in Resources.

Don’t try to get into it too far for now—for now, just understand that “Actions hook into action hooks, and filters hook into filter hooks.”

WordPress Hooks: Bringing Outside Contractors into the WordPress Factory

Hooks are how WordPress invites the “outside contractors” that help it do its work.

To explain hooks, we’ll return to our central analogy of WordPress as a factory.

Remember that WordPress calls on outside contractors to do some of its work. Our contractors don’t have a permanent place in the WordPress factory—they’re stuck outside until they’re invited in by the factory itself.

For our purposes, these outside contractors come from two places:

  1. Plugins
  2. The functions.php file inside the parent or child theme

The outside contractors themselves are the custom code in the plugins and functions.php that alter the functioning of the WordPress factory.

Hooks pull in outside code, in specified ways and at specified places.

Hooks—both action hooks and filter hooks—are how WordPress calls on these outside contractors. In other words, WordPress hooks pull in outside code, in specified ways and at specified places.

How WordPress Calls on its Contractors

We can think of WordPress “hooks” as actual giant factory hooks, which the contractors ride in on, like this:

Each hook is labeled with a specific name, such as wp_head, corresponding to a part of the WordPress factory’s process (in the case of wp_head, the process of building the page’s HTML <head> section).

These hooks travel out to the lobby so that contractors can ride them in, and they do it in a specific order. The wp_head hook travels out to the lobby and back right before <head> completes, the wp_footer hook travels to the lobby and back right before <body> completes, and so on. So the contractor is always riding his hook directly to the active, to-be-worked-on part of the factory.

When a contractor wants to be part of a specific process, he waits for that hook to show up at the entrance—and rides that hook straight into the proper part of the factory.

If the contractor didn’t ride the proper hook in, he couldn’t get where he’s going in the factory. Hooks are what “invites” outside code (from functions.php, plugins, and so on) into defined areas of WordPress’s PHP processing.

Two Kinds of Hooks, Two Kinds of Contractors

We’re halfway to understanding WordPress hooks, actions, and filters. The other part is a bit more specific: the lobby has two kind of hooks, action hooks and filter hooks.

Look back up at the WordPress Hooks diagram, and let’s understand action and filter hooks.

Action Hooks

Action hooks tend to get dangled at milestones: for example, “you’re almost done building the page’s <head> section” for the wp_head action hook, or “you’re almost done building the page’s <body> section” for the wp_footer action hook.

When contractors ride action hooks into the factory, they tend to do just about anything they want: add a bunch of stuff to the page, or do completely other things like log an error or even send an email.

Filter Hooks

Filter hooks work a bit differently. Contractors who ride in on action hooks can do whatever they want, and have no responsibility to anyone. But contractors who ride in on filter hooks actually insert themselves in the normal workers’ process: they’re given something to handle—say a block of text—and have to give that same block of text (slightly modified, probably) back to the regular worker, via a PHP return statement.

So a contractor using a filter hook generally doesn’t just do whatever he wants; he works with the piece of work that he’s given in his section of the factory. “This section works on the post title,” the section’s manager might say. “Do whatever you want to the post title, but if you don’t hand me back the post title after you’ve made your changes, this whole process won’t work properly.”

What Are These Contractors?

Our “contractors” are custom PHP functions that we (or anyone else) can write.

Hopefully we’re making sense so far; now we’re going to get a bit more technical so you can actually start writing these things.

The contractors—both those hooked to action hooks and those hooked to filter hooks—are custom PHP functions that we or anyone else can write.

Because these functions make it into WordPress by attaching themselves to WordPress hooks—that is, being “hooked in” from outside—the formal term for them is hooked functions.

There are two kinds of hooked functions:

  1. Actions, also called action functions, which hook onto WordPress’s action hooks, and
  2. Filters, also called filter functions, which hook onto WordPress’s filter hooks.

Let’s look at one of each.

Example Use of a Filter Function

Our first contractor is a filter or filter function. In other words, it’s a function that rides a filter hook into the factory.

/* Environment: We're in functions.php or a PHP file in a plugin */

function wpshout_filter_example( $title ) {
	return 'Hooked: ' . $title;
}
add_filter( 'the_title', 'wpshout_filter_example' );

Here’s what to know about the code above:

  1. Our filter—that is, the code that hooks into our filter hook—is indeed a PHP function, hence the function { }.
  2. wpshout_filter_example is the name of the filter function.
  3. ($title) is the function’s single argument. It’s what the WordPress factory (WordPress core itself) passes to the contractor to work on.
  4. return 'Hooked: '.$title; is the work the function does. It adds the word “Hooked: ” to the title it was passed, and gives it back to WordPress core to continue to process regularly.
  5. return is very important: it’s how the function gives back its work to WordPress core. That line is perhaps best read right-to-left: it says: “Take the regular title and add ‘Hooked: ‘ before it, then pass it back.”
  6. add_filter('the_title', 'wpshout_filter_example'); is very important: it’s how you add filter functions to filter hooks! This merits its own bulleted list.

Now, here’s how to understand that last line:

  1. add_filter( ); is a WordPress function. It says: “Hook a new filter onto an existing filter hook.”
  2. 'the_title' is the name of the filter hook that we’re going to ride into the factory.
  3. 'wpshout_filter_example' is the name of the contractor: in other words, the name of the filter we’ve written, and that we want to hook onto the filter hook (in this case, the_title) that we’ve specified.

So the filter wpshout_filter_example() hooks onto the filter hook the_title. When it does, it simply adds “Hooked: ” to the title, and returns it back. Make sense?

The result, on a live site, looks like this:

Example Use of an Action Function

Our next contractor is an action or action function: a function that rides an action hook into the factory.

/* Environment: We're in functions.php or a PHP file in a plugin */

function wpshout_action_example( ) {
	echo "WPShout was here.";
}
add_action( 'wp_footer', 'wpshout_action_example' );

If you’ve understood the filter example above, you’ll understand almost everything about this example of a WordPress action:

  1. function wpshout_action_example() {} means that this action (or action function) is named wpshout_action_example() and carries no arguments.
  2. echo "WPShout was here."; is what the function does. echo is a PHP command that we’ll discuss shortly.
  3. add_action('wp_footer', 'wpshout_action_example'); is what hooks the wpshout_action_example action to the wp_footer action hook.

As we noted, the major difference from our filter example is that the hooked function doesn’t return anything. Instead, it echos (prints) a message directly onto the page. Where will this message print? It’ll print at the very beginning of the footer section—wherever the theme author has placed the wp_footer action hook.

This difference—actions can do most anything, filters must return modifications to what they’re given—is the main distinction between the two types of functions, who are otherwise quite similar.

On a live site, our action has this result:

What We’ve Learned

WordPress uses actions and filters to extend what it can do—from the silly examples we showed off today, all the way up to ultra-complex plugins like WooCommerce. We’ve learned what hooks, actions, and filters are for, and the basics of how they work.

To sum up: WordPress registers action and filter hooks at specific places in the WordPress page generation process. Any developer can then write their own functions that hook onto these action and filter hooks. Filters (or “filter functions”) modify what they’re given and hand it back via a return; actions (or “action functions”) can echo text, modify data, and just about anything else, and do not need to return a value.

The WordPress hooks system is really the gateway to full-fledged WordPress development, so don’t be afraid to go back over the material, experiment with it, and make it your own.

Summary Limerick

Here’s an idea for the books:
The system (in WordPress) of hooks.
At regular junctions
They hook in new functions,
Which change how the site acts and looks.

Quiz Time!
  1. A WordPress hook is a(n):
    1. Function containing custom code
    2. Way to pull in custom code
    3. Function that modifies custom code
  2. The following is not true of WordPress filters:
    1. They are always passed parameters by their hooks
    2. They are expected to return a value
    3. They may not change the site’s data or echo HTML output
  3. To automatically remove profanity from the site’s display of user comments, a developer would most likely use:
    1. A filter
    2. An action
    3. A methodology other than hooked functions
Answers and Explanations
  1. B. A refers to actions and filters, collectively called hooked functions: the functions that hooks pull in. C is mostly gibberish.
  2. C. Together, A and B describe how filter functions receive a piece of data (usually a string of HTML output) from their filter hook and must return a modified version of it. (Many action functions receive nothing from their action hook, and actions do not return back a value.) However, both filters’ and actions’ PHP logic can do anything—including change data, echo markup, log errors, or even send emails—and so C is false.
  3. A. Filtering content is a classic use of WordPress filters, as the name implies. The filter function would take the raw comment content, remove or alter words matching an array of targets, and return the modified content to the filter hook, for processing into the comments section of the webpage being constructed.

If you liked this chapter on WordPress hooks, you’ll love our full guide to WordPress development: Up and Running!

Get Up and Running Now

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Amazon sells just about everything. And if you’re in the US, or another country where they have a big presence, using your site to make a little money linking to Amazon’s pages for products you love is a very appealing proposition. The Amazon Associates program is an easy way to make a small percentage on all sales of a product that you recommend to your audience. But making the links is a little cumbersome. But it doesn’t have to be.

That’s where the Amazon Affiliate Tag plugin comes in. It’s an easy way to make any link to Amazon you add to the content of your site into an Amazon affiliate link. Who wouldn’t want that?!

Here’s a video explaining in more detail:

How to Easily Add Amazon Affiliate Links to Posts - YouTube

And the written version:

How to Easily Add Amazon Associates Links to Your WordPress Content
  1. Create you posts as normal. Link to Amazon pages as normal. (So far, you’re making no effort to assure that your Amazon Associates code appears. That comes later…)
  2. Go to “Plugins > Install New” in your left sidebar.
  3. Search for the “Amazon Affiliate Tag” plugin. Install and activate it.
  4. Navigate to “Settings > Amazify”.
  5. Here is where you’ll need some data from your Amazon Associates affiliate section: you’ll need your Amazon affiliate tag. It’ll probably look something like davidbhayes-20, or XXXXXXXX-##. You’ll past that code into the box labelled “Your Amazon Tag” and you’ll click the “Save Changes” button on the bottom.
  6. You’re set. You’ll notice that if you inspect or click your links, the URL you get will have a “&tag=davidbhayes-20” segment at the end. You’ll be set!
Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Talking Gutenberg on Shop Talk Show →

While I’ve not been a regular listener recently, I do love the Shop Talk Show with Dave Rupert and Chris Coyier. Both Dave and Chris are smart and talented guys, and their attitude is consistently friendly and positive.

In Episode 298, they have a chat with Tammie Lister and Matias Ventura, who are the design and development leads on the Gutenberg project.

One of the things they cover (around 14 minutes in) that is really relevant to me now is the way that while they’ve supported existing metaboxes very will with Gutenberg, the paradigms that underlie them will almost certainly and appropriately change in the future. Hopefully in a few weeks I can share with you why that so caught my ear, but for now I’ll just say that I totally agree with Matias on it that the new structure naturally makes a change make sense. Metaboxes were never that great anyway.

Definitely check it out. It’s a great conversation and should give you a better understanding of how the most important people to the Gutenberg project think about their goals and methods.

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

This is a chapter from our “learn WordPress development” guide Up and Running, about to launch in its revised and expanded 3rd Edition.

We created Up and Running to be the best possible introduction to the fundamentals of WordPress development. Our customers tell us it worked. :) Enjoy this sample chapter!

Learn More About Up and Running

WordPress is a Factory - YouTube

Key Takeaways:
  • The easiest way to understand what WordPress does, and how it does it, is to dig into the following analogy: WordPress is a factory that makes webpages.
  • The WordPress factory’s raw materials are its posts, and its warehouse (where it stores its raw materials) is the MySQL database.
  • The factory’s assembly lines are the various PHP template files of the WordPress theme.
  • The factory can call on specialized outside contractors for specific jobs; these are WordPress plugins.
  • The finished product is the full HTML markup necessary to display a webpage; the factory ships this product to the requesting user’s browser on every page load.

Much of this book is very specific—at the level of individual APIs and functions—but you should first have an overall, intuitive picture of how WordPress works.

This chapter introduces the most helpful analogy for understanding WordPress’s overall functioning: WordPress is a factory that builds webpages. If you understand this chapter and nothing else, you’ll already have your basic bearings in the WordPress world, even if you can’t yet program in it.

WordPress is a Factory

WordPress is a factory that makes webpages.

WordPress is a factory that makes webpages. More specifically, it processes one or more WordPress posts stored in your database into the webpage your browser sees when you visit a URL (like https://wpshout.com/articles).

Let’s break this down into some very important key terms. We’ll first be looking at the general environment in which the WordPress “webpage factory” operates, and then at the specific technical makeup of the factory itself.

The Overall Factory Environment

This section describes general relationships between the browser and web server.

In this section, we’ll look at the key entities that either make up or interact with a WordPress site: entities such as the user, browser, and server. This section establishes general relationships, to give you a basic understanding of “What does WordPress do, for whom, and why?”

Browser: The Consumer

Factories run with a consumer in mind. For a WordPress site, that consumer is a (human running a) web browser.

The browser doesn’t really want to know what goes on at the factory; it wouldn’t understand very much of that. Most of a WordPress site’s server processing is in PHP, and browsers don’t “speak” PHP at all.

Rather, the browser is only interested in the final product that comes out of the factory: a processed HTML document that it knows how to render into a human-readable webpage. The browser requests these documents, and the server works hard to deliver them—so everything that happens at the factory is ultimately tied back to satisfying the browser’s requests.

URL: The Production Order

The consumer knows how to tell the factory what it wants. A browser tells a WordPress site which webpage to produce, by sending an HTTP request for a specific URL.

As a user, each URL you type into your browser becomes a “production order” sent from your browser to the web server that hosts the WordPress site. That production order tells the WordPress factory to chug to life, and to deliver a specific webpage back to the browser.

For example, the URL https://wpshout.com/ is an “order”—from a browser to the server that hosts https://wpshout.com/—to create and deliver back the WPShout homepage, which lists around a dozen of WPShout’s latest posts. https://wpshout.com/about is an “order” to create and deliver WPShout’s About page, which provides only the contents of that single WordPress page.

Webpage: The Finished Product

Like a car factory produces finished cars for delivery to dealerships, WordPress produces finished webpages for delivery to web browsers.

Webpages are written in HTML, the language a browser understands. They have the elements you’ve come to expect from a webpage: stuff at the top (in a header); stuff at the bottom (in a footer); some amount of main content; and often content in one or more sidebars. They also have a bunch of stuff a normal user can’t see directly, like <meta> tags.

Below is a webpage, as rendered (displayed) in a browser. The user requested https://wpshout.com/articles, which triggered the browser to send a specific request to the server. On the server, the site’s WordPress processing—through the PHP code in the site’s themes, plugins, and the core WordPress software itself—pieced together a webpage containing a header, nav menu, and so on. In this case, the webpage’s main content is a listing of WPShout’s most recent articles displayed in reverse chronological order. The server sent this completed webpage as HTML back to the browser, which displayed it to the user as shown.

Server: The Factory Site
A cPanel interface, one of the most common (and least technical) ways of managing a web server.

Every factory has to be built somewhere—on a piece of land with a specific address. That land has to be properly zoned, accessible by roads, equipped with plumbing and electricity, and so on. The factory site isn’t the machinery inside the factory, or the raw materials inside the warehouse; rather, it provides the environment for all of the above.

Just like a factory is built on a plot of land, every WordPress site is built on a web server. A server knows how to interpret orders from browsers, how to allocate resources when there are lots of computers making requests simultaneously, how to run PHP scripts and process MySQL queries, and more. It is the hardware and software environment that makes a WordPress site possible.

Inside the WordPress Factory

This section describes the inner workings of WordPress itself.

Okay, now let’s look at how the factory itself churns out product. This section describes the inner workings of WordPress itself.

Posts: The Raw Materials

Like a car is made mainly out of metal, a WordPress webpage is made mainly out of one or more posts.

The unit of WordPress content is the post.

A WordPress post is a specific, technical term: it means a block of text and HTML stored in the WordPress database. (We cover this topic in-depth in the next chapter, What “Post,” “Page,” and “Webpage” Mean in WordPress.)

Whatever post type a post is part of—such as Page, Post, Media Attachment, or a custom post type like Product or Recipe (or anything else!)—the unit of WordPress content is the post.

Below in the WordPress admin area, we see a new post being created. In this specific case, it’s a post of type Page.

This Page’s post contents will be the raw materials for a webpage that WordPress puts together, whenever a user visits the site’s /new-page/ URL.

Database: The Warehouse

Just like a car factory’s warehouse stores its raw materials when they’re not being made into cars, the WordPress database stores posts, user information, and quite a bit else.

WordPress uses MySQL databases. MySQL is just a very common way of structuring computer databases, and isn’t a topic you need to know deeply. A MySQL database is a collection of lots of database tables (a bit like Excel spreadsheets), each with lots of rows and columns. It’s in that database that a WordPress site stores most of its data, about users and passwords, site settings, and more.

Most importantly, the database stores almost all of the site’s content. Every WordPress post you write (of any post type) gets its own row in a table called, by default, wp_posts. And believe it or not, every WordPress post’s content—even a 10,000-word article—gets stored as a big jumble of text and HTML in a single cell of that row.

Below is the wp_posts table of a WordPress site’s database. You can clearly see WordPress’s default “sample page” text (“Welcome to WordPress…”) stored in the post_content column.

Without getting too much further into specifics on the WordPress database, the important thing to remember is that most text-based content ends up being stored as one or another type of post.

WordPress Core: The Factory Floor

As we discussed last chapter, WordPress core—the WordPress core software—is what WordPress itself is. Another term for WordPress core is just “WordPress.”

This is the “factory floor” of our WordPress factory. On this floor, WordPress accepts raw materials from the warehouse—WordPress posts and other database data—bundles them into shape, and prepares them to be shipped down one or another assembly line for final processing.

For the process of building up a particular webpage to display for a browser, WordPress core’s primary role is to fetch posts from the database. So for starters, imagine a factory floor with a single dedicated forklift, for fetching posts from the database.

WordPress core is a lot more than that, though: it also contains all the machinery that allows themes and plugins, which we’ll discuss next, to function. So in addition to our forklift, we’ve also got millions of dollars’ worth of supportive machinery—big electrical feeds, cooling systems, and so on—that together constitutes WordPress’s native APIs. And we, by writing themes and plugins, get to make the machinery that connects into those APIs.

The WordPress Theme: The Assembly Lines
A WordPress theme, Twenty Seventeen, as viewed uploaded to a server. Its key files, like style.css and index.php, dictate how it generates and styles webpages.

A theme assembles different types of post bundles into different types of webpages.

Our factory needs one or more assembly lines: manufacturing lines that can accept bundles of raw materials and process them into consumer-ready goods. For a car factory, that would mean things like welding the doors on, upholstering the seats, and painting the car.

A properly built WordPress theme does that work for a WordPress website. It takes raw materials (fetched posts), bolts them together during their progress down a single assembly line, and styles their presentation so that they’re attractive for the end consumer.

A WordPress theme’s PHP templates make up its assortment of assembly lines. These templates—index.php, page.php, single.php, home.php, archive.php, and more—are highly customizable and can whip up lots of different-looking products, even given the same raw materials.

How does the theme know which assembly line to send a particular post bundle down? With the WordPress template hierarchy. WordPress examines which raw materials were fetched—what kinds of posts were in the post bundle retrieved from the database—and then sends that bundle down the appropriate line according to the template hierarchy. So a complex WordPress theme is a set of parallel assembly lines: a way of automatically assembling different types of post bundles into different types of webpages.

Without assembly lines, raw material would just come in and sit on the factory floor. So every WordPress site must be running on a theme—no exceptions. Themes are the software that tells WordPress data (posts, pages, images, and lots else) how to display, as a finished product. They shouldn’t do much to actually change that data—that’s the job of plugins, and themes doing the job of plugins is a problem we call “theme creep”—but they’re in almost total control of how it displays to the user.

WordPress Plugins: Special Contractors

Imagine a car factory being asked to build rocket cars. They’re already building tires and windshields and stuff, so the environment is partly set up—but there’s a lot of machinery needed to build rocket engines that the factory simply doesn’t have on hand. If some outside contractor could come in and build the rocket engines, in a way that was able to respect and fit into the rest of the production process, then the factory’d be in business.

Sometimes WordPress needs these sorts of functionality boosts. People do all kinds of things in WordPress that aren’t available in WordPress core by default—everything from quickly and easily linking to Google Analytics, to setting up a full-fledged online store with thousands of products and multiple payment gateways.

To get these functionality boosts, WordPress relies on its vast ecosystem of plugins: pieces of standalone code that hook into the WordPress production process in specified ways, and which can fit in and do their work at any point along the factory floor’s processes.

Plugins don’t live in the factory. They live outside, and are invited in for special occasions—when it’s time to deliver a rocket engine, or something else cool and exotic. To learn how the factory incorporates their work, start with WordPress Hooks, Actions, and Filters: What They Do and How They Work.

Analogy Analyzed!

“WordPress is a factory” is somewhere on the border between a very apt analogy and a literal truth. “Webpage factory” is almost literally what WordPress is, at least rom the standpoint of a browser requesting webpages—just one that uses digital factory equipment (PHP files) and digital raw materials (database contents) rather than physical components.

If this all seems abstract, don’t worry about it right now. It’ll make more sense as you dive into WordPress itself. However, as you go through the book, revisit this chapter periodically: over time, you should find this analogy really useful for understanding how WordPress fits together.

Summary Limerick

To say (not in thousands of pages)
What it is in which WordPress engages:
It retrieves posts to process,
Then sends them across as
The markup that makes up webpages.

Quiz Time!
  1. WordPress “lives on”:
    1. A browser
    2. A server
    3. A database
  2. The primary function of WordPress core software is to:
    1. Process saved posts into webpages
    2. Simplify creating data associations on the fly, for quicker development of custom applications
    3. Optimize the technical performance (site speed) of an existing website
  3. Each of these tasks is better-suited for a WordPress theme than a plugin, except:
    1. Control the visual design of a site
    2. Extend the core functionality of WordPress
    3. Define what types of post data (for example, titles or featured images) appear on given webpages
Answers and Explanations
  1. B. WordPress is a set of primarily PHP files which reside and are executed on a server.
  2. A. WordPress exists mainly to aid in the creation and display of website content, which in WordPress is saved as posts.
  3. B. Themes should not add functionality to a WordPress site; plugins should. Themes control the presentation of a site’s webpages.
Pretty good, right? :)

Get Up and Running Now

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Beaver Builder is one of my all-time favorite additions to the WordPress ecosystem (see our full Beaver Builder review here). It’s the first drag-and-drop WordPress layout builder I can really recommend, and use without resentment on my own clients’ sites. Given how helpful a good WordPress layout builder is, that feels a bit like saying it’s the first working teleporter—a big deal.

This Quick Guide shows you how to use Beaver Builder to create good-looking layouts that combine a single, readable text column with wider breakout images—much like Medium, the famously readable content platform. You’ll also get a good general sense how to use Beaver Builder as the flexible WordPress layout builder it’s designed to be, using different row and content width configurations. If you want a Medium style WordPress theme, this is a good way of getting it without having to choose from a narrow selection of “Medium-specific” WordPress themes.

Using Beaver Builder to Create Medium-Like Layouts in WordPress - YouTube

How to Create Medium-Like Layouts in Beaver Builder
  1. If you don’t have it, get the Beaver Builder plugin. I can also recommend the free Understrap starter theme as a simple base to build from.
  2. For a narrow text column, create a row whose content is “Fixed” to a relatively narrow width: 700px to 800px.
  3. For each “breakout” image, create a new row whose content is “Fixed” to a relatively wide value, such as Beaver Builder’s default of 1100px.
  4. For a fullscreen “hero” image, you’ll need to be using a template that lets you design within the entire viewport, such as Understrap’s “Empty Page Template.” Create a full-width row and give the row a background image.

Having a WordPress layout builder we actually like opens up a tremendous number of possibilities, so we’ll definitely be doing more Beaver Builder tutorials in the future. I hope this helps you understand how to start using Beaver Builder row and content widths to make the layouts you’re looking for.

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Unsplash: Beautiful, Free, Unrestricted-Use Images →

I should spend more time talking to designers. An excellent designer I’m working with on a few projects noticed me Googling for a sample image to put into a new site design, and told me about Unsplash. It’s a major step up.

Unsplash is a huge repository of free-to-use images. Where it’s a bit unique is that the images are beautiful. The name “unsplash” presumably comes from these images’ suitableness as splash page backgrounds. They’re also ideal for landing pages, or for homepage hero images.

One other lovely element of Unsplash are the crystal-clear “do-whatever-you-want” licensing terms. If you’re fuzzy on the nuances of free image licensing—reuse with or without attribution, reuse with our without modification, what “Creative Commons” means, and so on—then you’ll find Unsplash’s guidelines refreshingly simple:

All photos published on Unsplash can be used for free. You can use them for commercial and noncommercial purposes. You do not need to ask permission from or provide credit to the photographer or Unsplash, although it is appreciated when possible.

Highly recommended!

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Beaver Builder is one of my all-time favorite additions to the WordPress ecosystem. It’s the first drag-and-drop WordPress layout builder I can really recommend, and use without resentment on my own clients’ sites. Given how helpful a good WordPress layout builder is, that feels a bit like saying it’s the first working teleporter—a big deal.

This Quick Guide shows you how to use Beaver Builder to create good-looking layouts that combine a single, readable text column with wider breakout images—much like Medium, the famously readable content platform. You’ll also get a good general sense how to use Beaver Builder as the flexible WordPress layout builder it’s designed to be, using different row and content width configurations.

Using Beaver Builder to Create Medium-Like Layouts in WordPress - YouTube

How to Create Medium-Like Layouts in Beaver Builder
  1. If you don’t have it, get the Beaver Builder plugin. I can also recommend the free Understrap starter theme as a simple base to build from.
  2. For a narrow text column, create a row whose content is “Fixed” to a relatively narrow width: 700px to 800px.
  3. For each “breakout” image, create a new row whose content is “Fixed” to a relatively wide value, such as Beaver Builder’s default of 1100px.
  4. For a fullscreen “hero” image, you’ll need to be using a template that lets you design within the entire viewport, such as Understrap’s “Empty Page Template.” Create a full-width row and give the row a background image.

Having a WordPress layout builder we actually like opens up a tremendous number of possibilities, so we’ll definitely be doing more Beaver Builder tutorials in the future. I hope this helps you understand how to start using Beaver Builder row and content widths to make the layouts you’re looking for.

Read Full Article
Visit website
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Don’t Get Abandoned on WordPress 4.9.3 →

A pretty unfortunate and important issue happened when WordPress 4.9.3 was released a few days ago: it has an error that makes it impossible for WordPress to update itself again. After the error was understood, they stopped rolling out automatic updates. But that was after quite a few sites (speculatively: millions) had updated to it. That’s a problem. So, if you’re running 4.9.3 on any WordPress site, make sure that it (manually, perhaps) gets to WordPress 4.9.4. That’s crucial. Let’s explore why.

One of the best things that WordPress has done to enhance the security of itself, and thus the wider internet, is auto-updates. Out-of-date WordPress sites are probably the top cause of compromise, and while automatic plugin updates haven’t become de rigueur, automatic WordPress core updates fortunately are. The issue is that if you’re on 4.9.3, you’re back to the state of manually having to click the “Update” button for your site to be secure again. It’s not the end of the world–we lived like that for years–but it’s not the ideal security situation.

There are many ways you or another WordPress administrator may not need to click the button inside each site dashboard, even with this issue. Let’s highlight a couple of them:

  • Many hosts who specialize in WordPress (including our favorite, SiteGround) are independently processing WordPress sites and doing minor version (4.9.x -> 4.9.y) on the regular. If these succeed, you’ll be fine.
  • If you’re doing remote management of WordPress (ManageWP, MainWP, InfiniteWP, etc), it should update the site just be fine.
  • If you’re in the habit of updating everything periodically–WordPress core, plugins, and themes–as you should be, you’ll eventually update from 4.9.3 easily. Fortunately neither 4.9.3 or 4.9.4 have any security implications, so you updating in the next few weeks is likely soon enough for your site to be safe.

It’s a pity, and highlights a process deficiency, that this sort of bug made it into a WordPress release. But it’s also not a disaster, which is something to both be grateful for and aware of. I’m sure the core team is seriously working on checks to make sure that this kind of thing doesn’t happen in the future, and I’ll definitely take that.

Read Full Article
Visit website

Read for later

Articles marked as Favorite are saved for later viewing.
close
  • Show original
  • .
  • Share
  • .
  • Favorite
  • .
  • Email
  • .
  • Add Tags 

Separate tags by commas
To access this feature, please upgrade your account.
Start your free year
Free Preview