How to Create a WordPress Intranet for the Organization

Do you wish to develop a WordPress intranet for your organization? WordPress actually powerful platform with a great deal of versatile choices that means it is perfect to be used as your organization’s intranet. In this specific article, we’ll show you how exactly to produce a WordPress intranet for your organization while maintaining it personal and secure.

Creating a WordPress intranet for the company

What is Intranet or Extranet? Why Utilize WordPress as Your Intranet Platform?

Intranet or Extranet is really a communications platform utilized by an organization for communication, file sharing, announcements, as well as other organizational tasks.

WordPress is an excellent platform to construct your organization’s intranet or extranet. It is easy to maintain, open supply, and gives you use of tens and thousands of WordPress plugins to include new features when needed.

An intranet operates for an organization’s personal community. Typically, an office IT system is connected via cable or wireless community adapters. One computer regarding the system can be utilized as the web server and host a WordPress web site.

Proceed with the guidelines within our guide on how to install WordPress on a Windows community using WAMP or install WordPress on a Mac computer using MAMP to begin your WordPress intranet.

Having said that, an extranet is definitely an intranet platform accessible to a more substantial system or public internet. In plain English, this might be a web site publicly accessible but limited to authorized users just.

It really is particularly of use if for example the company is distributed across different geographical places.

To create your WordPress extranet, you’ll desire a WordPress web hosting account and a domain name. Afterwards, you are able to install WordPress and then work it to be used as your organization’s intranet.

Once you have set up WordPress as your intranet, the next phase is to convert it as a communications hub for the organization.

To accomplish this, you’ll be using several WordPress plugins. We are going to demonstrate the fundamental setup that will serve whilst the foundation for your WordPress intranet to cultivate and meet your organization’s objectives.

Starting BuddyPress as Your WordPress Intranet Hub

BuddyPress is just a sibling task of WordPress. It converts your WordPress web site right into a social network. Check out regarding the things a BuddyPress driven intranet may do:

  • You’ll be able to to invite users to join up on company intranet
  • Users will be able to produce extensive user profiles
  • Task channels enable users to follow along with latest updates like Twitter or Facebook
  • It is possible to create individual groups to sort users into divisions or teams
  • Users can follow both as buddies
  • Users can send personal messages to one another
  • You can include new features with the addition of third-party plugins
  • You’ll have actually numerous design choices with WordPress themes for BuddyPress

To get going, first you will have to install and trigger BuddyPress plugin. For more details, see our step-by-step guide on how best to install a WordPress plugin.

Upon activation, mind over to Settings » BuddyPress web page to configure plugin settings.

BuddyPress settings

For complete detailed directions see our guide on the best way to turn WordPress into a social network with BuddyPress.

Secure Your WordPress Intranet with All-in-One Intranet

If you’re managing a WordPress intranet on local host, you’ll be able to secure it by restricting use of interior IPs inside .htaccess file.

But if you should be running an Extranet, then your users might be accessing the intranet from various companies and IP details.

To make sure that only authorized users access your organization intranet, you need to make your extranet personal and available to only users.

For that, you’ll should install and stimulate the All-in-One Intranet plugin. For lots more details, see our detailed guide on how to install a WordPress plugin.

Upon activation, mind over to Settings » All-in-One Intranet page to configure the plugin settings.

All in a single Intranet settings

First you will need to check out the box next to ‘Force website become entirely private’ option. This can make all pages of one’s WordPress site completely private.

The only thing this plugin will not make private may be the files within uploads directory. Don’t worry, we’ll show you just how to protect it later on in this article.

Next, you’ll want to give a Address where you would like users to be rerouted when they’re logged in. This may be any page on your intranet.

Lastly, you can immediately logout inactive users after a specific amount of minutes.

Don’t forget to click on the save changes button to keep your settings.

Securing Media Uploads in your WordPress Intranet

Making your website entirely private does not influence media files. If some one knows the exact URL of the file, they can access it without the limitation.

Let’s modification that.

For better security, I will be redirecting all demands built to the uploads folder to a easy PHP script.

This php script will check if a person is logged in. If they’re, then it’ll serve the file. Otherwise, the consumer may be rerouted toward login page.

First you’ll want to create a new file on your desktop employing a plain text editor like Notepad. You then should duplicate and paste the following code and save your self the file as download-file.php on your own desktop.

require_once('wp-load.php'); is_user_logged_in() || auth_redirect(); list($basedir) = array_values(array_intersect_key(wp_upload_dir(), array('basedir' => 1)))+array(NULL); $file = rtrim($basedir,'/').'/'.str_replace('..', '', isset($_GET[ 'file' ])?$_GET[ 'file' ]:'');
if (!$basedir || !is_file($file)) { status_header(404); die('404 — File maybe not discovered.');
} $mime = wp_check_filetype($file);
if( false === $mime[ 'type' ] && function_exists( 'mime_content_type' ) ) $mime[ 'type' ] = mime_content_type( $file ); if( $mime[ 'type' ] ) $mimetype = $mime[ 'type' ];
else $mimetype = 'image/' . substr( $file, strrpos( $file, '.' ) + 1 ); header( 'Content-Type: ' . $mimetype ); // always deliver this
if ( false === strpos( $_SERVER['SERVER_SOFTWARE'], 'Microsoft-IIS' ) ) header( 'Content-Length: ' . filesize( $file ) ); $last_modified = gmdate( 'D, d M Y H:i:s', filemtime( $file ) );
$etag = '"' . md5( $last_modified ) . '"';
header( "Last-Modified: $last_modified GMT" );
header( 'ETag: ' . $etag );
header( 'Expires: ' . gmdate( 'D, d M Y H:i:s', time() + 100000000 ) . ' GMT' ); // Support for Conditional GET
$client_etag = isset( $_SERVER['HTTP_IF_NONE_MATCH'] ) ? stripslashes( $_SERVER['HTTP_IF_NONE_MATCH'] ) : false; if( ! isset( $_SERVER['HTTP_IF_MODIFIED_SINCE'] ) ) $_SERVER['HTTP_IF_MODIFIED_SINCE'] = false; $client_last_modified = trim( $_SERVER['HTTP_IF_MODIFIED_SINCE'] );
// If sequence is empty, return 0. If you don't, try to parse as a timestamp
$client_modified_timestamp = $client_last_modified ? strtotime( $client_last_modified ) : 0; // create a timestamp for our latest modification...
$modified_timestamp = strtotime($last_modified); if ( ( $client_last_modified && $client_etag ) ? ( ( $client_modified_timestamp >= $modified_timestamp) && ( $client_etag == $etag ) ) : ( ( $client_modified_timestamp >= $modified_timestamp) || ( $client_etag == $etag ) ) ) { status_header( 304 ); exit;
} readfile( $file ); 

Now connect with your internet site utilizing an FTP customer. When connected, upload the file you merely designed to /wp-contents/uploads/ folder on your site.

Next, you will need modify the .htaccess file within website’s root folder. Add the next rule at the bottom of your .htaccess file:

RewriteCond %{REQUEST_FILENAME} -s
RewriteRule ^wp-content/uploads/(.*)$ download-file.php?file=$1 [QSA,L]

Don’t forget to truly save your modifications and upload the file back into your internet site.

Now all user demands towards media folder is sent to a proxy script to test for verification and redirect users to login web page.

4. Incorporating Types to Your WordPress Intranet with WPForms


The primary goal of a business intranet is communication. BuddyPress does a great job with task channels, opinions, and personal texting.

However, often you’ll need certainly to collect information independently in a poll or survey. You’ll should also sort and store that information for later on usage.

That’s where WPForms comes in. It is the best WordPress type builder available in the market.

Not just it allows you to effortlessly produce beautiful kinds, additionally saves individual reactions inside database. You are able to export responses for any form in to a CSV file.

This allows you to definitely organize form reactions in spreadsheets, print them, and share among your colleagues.

Extending Your WordPress Intranet

Chances are you should have a perfectly capable intranet for your company. However, while you test the working platform or start it for users, you might want to add brand new features or ensure it is better.

There are plenty of WordPress plugins that can help you are doing that. Below are a few tools that you could desire to add right away.

That’s all for the present time.

Develop this short article helped you create a WordPress intranet for your company. You may even desire to see our a number of most useful WordPress widgets for the site.

In the event that you liked this informative article, then please contribute to our YouTube Channel for WordPress video lessons. You can also find us on Twitter and Twitter.

How to Install and Setup WordPress Multisite Network

quite a few users quickly learn to confidently manage numerous WordPress websites independently. Some even begin managing WordPress websites for customers, buddies, and family members. Recently, certainly one of our users asked us the way they can simply install and setup WordPress multisite. These were operating numerous WordPress web sites on sub-domains and desired to manage all their sites together. In this article, we’ll show you how to install and setup WordPress multisite community.

What exactly is WordPress Multisite?

A WordPress multisite community allows you to run and manage multiple WordPress web sites from a single WordPress installation. You are able to produce new web sites instantly and handle them utilising the exact same account. You can also allow other users to signup and produce unique blogs on your own domain.

Pros of using a Multisite system

1. Due to the fact community admin, it is possible to administer multiple websites from a single dashboard.

2. Each site might have its very own admins with abilities to control only their website.

3. Install plugins and themes on multiple internet sites with one down load.

4. Multisite system additionally makes it easier for you to control updates. You simply must improve your WordPress, plugins, or themes using one install.

Cons of Using a Multisite System

1. Most of the internet sites on community share equivalent resources, so when your site is down, all web sites in your system are down.

2. Managing server resources in case of unforeseen traffic can be difficult for a beginner degree individual.

3. If the website gets hacked, then this means most of the internet sites in your system can get hacked.

4. Some WordPress plugins may well not work well on a multisite community.

Who Needs a WordPress Multisite Network

Simply because you’ve got numerous WordPress installation does not always mean that you need to develop a multi-site system. You should use services like ManageWP or InfiniteWP to control multiple various internet sites.

Making a multisite network is sensible for:

  • A mag website with different sections managed by various teams.
  • A business site with sub-sites for different areas and branches
  • Federal government or non-profit websites can use multisite for different departments, places, and areas.
  • Your very own system of blogs running on multiple subdomains.
  • Schools and universities enabling students generate their very own blog sites on college servers

Needs for the WordPress Multisite Network

The main thing you will have to run a WordPress multisite community is great WordPress hosting. If you are not likely to produce many internet sites and do not expect numerous visitors, then you can break free with shared hosting. Nonetheless due to the nature of multi-sites, you’d most likely desire a VPS or dedicated server as your web sites grow.

We recommend Bluehost simply because they provide both hosting that is shared and VPS/Dedicated servers, plus they are also one of many official WordPress hosting partners.

We’ve additionally caused SiteGround and InMotion Hosting, and they provide exemplary solution.

Besides website hosting, you will need some routine knowledge of setting up WordPress and modifying files using FTP.

Selecting a Domain Construction for the Multisite Network

For a WordPress multisite community, you could have your internet sites installed in either subdomains or sub-directories.

If you choose subdomains, then you’ll definitely need certainly to configure wildcard subdomains in your server (we will demonstrate just how to do that later on in this specific article).

Having said that, in the event that you choose sub-directories or path based URLs for subsites on your own community, then your only thing you need to do is allow pretty permalinks on your own root site.

Setting Up Wildcard Subdomains

Log-in to your website hosting account, and you’ll land on your own cPanel dashboard. You will need to scroll down to the domains section and then click on Subdomains.

Subdomains in cPanel

In the next display screen, you will need to enter * sign in the subdomain field and choose your main domain through the drop down menu. Cpanel will immediately detect the document root, and it’ll show it in the industry below. Now just click in the make key to add your wildcard subdomain.

Adding a wildcard subdomain using cPanel

Enabling WordPress Multisite Network Feature

Multisite Network feature comes built-in with every WordPress install. All you have to do is install and setup WordPress as you generally would. Browse our complete WordPress installation guide if you need help.

You can also enable Multisite function on an current WordPress site. Just before permit multisite, make certain you have created a complete backup of the WordPress site.

Allow Multisite, you need to access your website having an FTP customer or cPanel file manager and open wp-config.php file for modifying.

You will need to add this line towards wp-config.php file right before the /* That’s all, stop modifying! Happy blogging. */ line.

/* Multisite */
define( 'WP_ALLOW_MULTISITE', true );

Save and upload your wp-config.php file back into the host. Now your WordPress site supports multisite network.

Installing The Network

Now that you have got effectively enabled the Multisite system feature on your own WordPress website, it’s time to put up your network. Just before accomplish that, initial thing you need to do is deactivate all plugins on your website. After that, you will need to head to Tools » Network Setup to configure your multisite network.

system Setup

Regarding network setup display screen, you will notice a realize that you will need Apache’s mod_rewrite module set up on your host to create multisite network. This module is set up and enabled on most reputable WordPress web hosting providers.

The next thing you have to do is always to tell WordPress what type of domain framework you will end up using for sites in your community, e.g. Subdomains or Sub-directories. After that you would need to supply a title for the system making certain the e-mail address into the Network Admin e-mail is correct. Lastly, go through the install switch to continue.

Regarding the next display, WordPress will reveal some guidelines that you need to add to your wp-config.php and .htaccess file. Use an FTP customer to edit those two files and content paste the code.

Configuring Network Settings

After successfully creating the Multisite Network, you will need to switch to the system Dashboard to configure community settings, include new sites, and do all things. Just take your mouse up to My websites menu within the admin toolbar, a flydown popup can look. Click Network Admin » Dashboard.

Switching to Multisite system Admin Dashboard

You will see that there are new menu what to manage your multisite community. You will also see a dashboard widget allowing you to create new website and add brand new users.

Multisite Network Admin Dashboard in WordPress

To configure Network Settings click the Settings website link inside admin sidebar. On network settings display, the initial choice is setting your site title and admin email address. These fields is likely to be filled with the network title and admin e-mail you joined through the community setup.

Starting Your Multisite System for Registrations

The Registration Settings part regarding the network settings display has become the most critical setting inside network setup. By default, both individual and website registrations are going to be disabled in the network. You’ll elect to open your internet site for user enrollment, or allow existing users to generate brand new internet sites, or enable both individual and site registration.

Registration settings on a WordPress Multisite Network

You can check the box next to Registration Notification to get email notifications each time a brand new individual or site is registered.

If you wish to let the site administrators the capacity to include new users on their sites, you’ll be able to check the field next to include New customers.

Limited e-mail Registration options will assist you to limit site or individual enrollment to email address from particular domain names, then you can certainly include those domains here. This is particularly useful in the event that you only desire to enable folks from your own company to join up and produce users or sites. Similarly you may want to ban specific domain names from registration.

Limited e-mail domain

Brand New Website Settings

This new Site Settings area regarding system settings screen allows you to configure default options for the latest sites created in your system. You are able to change the welcome e-mails and the contents of first default post, page, and comment.

New site settings

Upload Settings for the Multisite System

It is important for you to keep close track of the use of the host resources. Underneath the Upload Settings section, you are able to restrict the quantity of area a website may use for uploads. The default value is 100 MB that will be probably good for about 100 picture uploads. You’ll increase or decrease this area according to just how much disk space you’ve got.

Upload settings for internet sites in the system

The standard upload file kinds are pictures, audio/video, and pdfs. You could add extra file kinds if you want, e.g. doc docx odt. Lastly, you’ll opt for a quality restriction, so users can’t upload insanely big files to the server.

Menu Settings

Beneath the menu settings, you will find the choice to enable administrative menu the plugins section regarding system websites. Enabling this can show plugins menu to site admins. They may be able stimulate or deactivate a plugin on the individual internet sites, but they cannot install brand new plugins.

Enable Plugins menu for site admins

Adding Brand New Sites towards WordPress Multisite System

To incorporate a brand new site to your WordPress multisite, simply click on Sites under My websites » Network Admin menu inside admin toolbar.

web sites on your own multisite WordPress

This can explain to you a listing of web sites on your present Multisite installation. Automatically, you have got most of your site detailed while the only site within WordPress Multisite community. To include a new site, go through the Add brand new button at the top.

select Add a new comer to put in a brand new site

Regarding the Add New website display, you will need to give you the site’s address. You don’t have to form the total address, simply the component you need to make use of as subdomain or sub-directory. After that supply a website name, and include the site’s admin current email address.

Incorporating a fresh site in WordPress Multisite system

You could add an admin email besides the one you’re at this time utilizing to manage your multisite. In the event that email address just isn’t presently being used by another user on your site, then WordPress will generate a fresh user and send the password and username towards the current email address you enter.

An individual will be done, click the Add website switch. A brand new website will likely to be put into your multisite network. Due to the fact network admin, you are going to be given a brand new site registration email. If you created a new individual, then that individual will get their username and password with instructions to login regarding email you offered.

Including Themes and Plugins to Your Multisite System

Automagically, specific site administrators cannot install themes and plugins by themselves. As the system admin, you’ll install plugins and themes for them while making those themes / plugins open to them. To Achieve That you’ll want to login to your primary site and head to My Websites » Network Admin » Themes.

Multisite Themes

In the system Admin’s themes screen, you will notice a listing of at this time set up theme in your WordPress multisite. You can make a layout available to other internet sites by simply clicking Enable system under that theme. Likewise, you are able to disable a layout by hitting Disable Network website link beneath the theme.

Enable or Disable themes on Multisite WordPress system

Similarly it is possible to trigger or deactivate a plugin for the whole community from My websites » Network Admin » Plugins display screen. Keep in mind that if you have examined the Plugins Menu as open to site admins inside system Settings, then site administrators can stimulate or deactivate set up plugins by themselves.

Activate or Deactivate plugins on multisite network in WordPress

Troubleshooting WordPress Multisite Problems

Most common issues happen as a result of incorrect setup of Wildcard Subdomains. Make sure that your web host supports wildcard subdomains.

Another universal problem is the fact that when utilizing WordPress Multisite with sub-directories, some users can’t login toward admin area of their sites once they add the necessary code in wp-config.php file. To correct this, try replacing

define('SUBDOMAIN_INSTALL', false);

line in wp-config.php file with

define('SUBDOMAIN_INSTALL', 'false');.

Develop this article aided you install and setup WordPress multisite system. If you liked this short article, then sign up to our YouTube Channel for lots more WordPress instructional videos. You may want to join united states on Google+ and Twitter.

How WordPress really works Behind the Scenes (Infographic)

maybe you have wondered exactly how WordPress is proven to work behind the scenes? For some users, this indicates easy because you type a Address plus web page lots in few seconds, but there is a great deal that happens behind the scenes. Inside guide, we will walk you through exactly how WordPress really works behind the scenes, and now we have developed a straightforward to follow along with infographic aswell.

How WordPress Functions Behind the Scenes

Why You Should Understand How WordPress Works?

WordPress can be an available source software, which means any one can learn its rule and write their very own apps (plugins) and templates (themes) because of it.

Learning just how WordPress works and how are you affected behind the scenes can help you know very well what you are able to do with it. You are able to learn about increasing WordPress performance and write better rule for your own tasks.

This guide will walk you through the entire procedure detail by detail. We will begin with when a individual requests a full page and end whenever that web page is fully loaded.

Prepared? Let’s get going.

Simply click to see the Behind the Scenes WordPress Infographic

You’ll be able to follow our written tutorial below for lots more details.

1. Load wp-config.php File

The wp-config.php could be the WordPress setup file. It sets worldwide factors for the WordPress website possesses your WordPress database information. This is actually the first file WordPress lots for obvious reasons. Find out more about wp-config.php file and exactly how to modify it.

2. Setup Standard Constants

After loading wp-config.php file, WordPress will proceed to set default constants. This consists of information like default WordPress upload location, maximum file sizes, along with other default constants set in wp-config.php file.

3. Load advanced-cache.php File

If advanced-cache.php file exists on your own site, then WordPress will load it next. This file will act as a drop-in file and it is employed by several popular plugins particularly WordPress caching plugins. In case the website is by using this file, then you’ll definitely view a new product regarding plugins screen called Drop-ins.

advanced-cache.php file showing up as drop-in

4. Load wp-content/db.php File

WordPress enables designers to create their own database abstraction levels and load them in a db.php file placed within the wp-content folder. It’s popular by WordPress caching plugins to improve database performance. If the website has this file present, then WordPress will load it.

5. Connect MySQL and choose Database

WordPress are in possession of sufficient information to proceed further. It’s going to proceed to connect to the MySQL server and select the database.

If WordPress struggles to connect to the database, then you will start to see the “Error establishing database connection” error and WordPress will quit right here.

If everything works fine, then it’ll move on to next actions.

6. Load object-cache.php or wp-includes/cache.php File

WordPress will now try to find object-cache.php file. If it cann’t occur, then WordPress will move on to load wp-includes/cache.php file.

7. Load wp-content/sunrise.php File

If it is a multisite system, then WordPress will now search for sunrise.php file if it exists in wp-content folder.

8. Load Localization Library

WordPress will now load l10n.php library in wp-includes folder. This file loads WordPress localization system, lots translations, sets locales, etc. See our guide on how to utilize WordPress in other languages.

9. Load Multisite Plugins

In case it is a multisite community, then WordPress will now load the multisite plugins. Find out about just how plugins work on WordPress multisite community.

system activated plugins

10. Do Action ‘muplugins_loaded’

The action muplugins_loaded has become run by WordPress. This step can be obtained only to network triggered plugins for a WordPress multisite.

11. Load Active Plugins

WordPress will now load all active plugins on the internet site. It can that by looking inside active_plugins entry within the choices dining table of one’s WordPress database. This allows WordPress to ignore plugins which are set up on your website although not triggered.

12. Load pluggable.php File

The pluggable.php file contains functions that may be redefined by WordPress plugins. WordPress will now see if the functions inside this file are already defined by another plugin. Otherwise, it will define those functions itself.

13. Do Action ‘plugins_loaded’

WordPress will now run the action ‘plugins_loaded’. It allows developers to hook their functions to run in the end active plugins have been loaded.

14. Load Rewrite Rules

WordPress will now load the rewrite guidelines. These rewrite rules help WordPress use Search Engine Optimization friendly URLs.

15. Instantiate $wp_query, $wp_rewrite, $wp

At this time WordPress loads these objects:

$wp_query: The international example that holds WP_Query class. It tells WordPress what content is requested in an average WordPress question format.

$wp_rewrite: The global example that holds your WP_Rewrite class. It includes your rewrite guidelines and functions which tell WordPress which Address to make use of to display the requested content.

$wp: The worldwide instance for the WP course containing functions which will parse your demand and perform the key question.

16. Do Action ‘setup_theme’

WordPress will now proceed to run ‘setup_theme’ action. This step runs before your WordPress theme is loaded.

17. Load Child Theme’s functions.php File

The functions.php file acts as plugin and is utilized in WordPress themes to include theme specific features to your site. If you use a child theme, then WordPress will now load your youngster theme’s functions.php file.

Otherwise, it will just load your active theme’s functions.php file.

18. Load Parent Theme’s functions.php File

If you use a kid theme, then WordPress will now load your moms and dad theme’s functions.php file.

19. Do Action ‘after_setup_theme’

This step runs after WordPress has setup the theme and loaded theme functions. It is the first action open to themes.

20. Setup Current User Object

Now, WordPress lots the existing user object. Permits WordPress to handle the demand prior to the user’s part and abilities.

21. Do Action ‘init’

WordPress has up to now packed all important information it requires. Now it fires the ‘init’ action.

This course of action permits designers to incorporate code which should be executed after WordPress has packed all earlier mentioned information.

22. Do Action ‘widget_init’

The widget_init action allows designers to register widgets and run code they needed seriously to run at the moment.

23. Run wp()

WordPress now calls wp() function that is located in wp-includes/functions.php file. It creates the WordPress question globals $wp, $wp_query, $wp_the_query after which calls $wp->main.

24. Parse Request

Now WordPress has all the information it needs to parse the consumer request. It starts by checking the rewrite guidelines to complement the user’s demand.

And then runs query adjustable filters, demand action hook, and delivers header demand.

25. Run Query

If no content matches the query, then WordPress will set is_404 variable.

Otherwise, WordPress goes onto load query factors.

It’ll then run WP_Query->get_posts().

Then, it fires DO_ACTION_REF_ARRAY ‘pre_get_posts’ action with WP_Query object.

WordPress will now run apply_filters to wash up question and run some final checks.

Now it fetches articles from database and applies articles_results and the_posts filters.

The question part ends with WordPress coming back the posts.

26. Do Action ‘template_redirect’

WordPress will now run the template_redirect action. This hook runs right before WordPress determines which template web page to load.

27. Load Feed Template

In the event that requested content is just a rss, then WordPress lots the feed template.

28. Load Template

WordPress will now try to find the template file predicated on WordPress template hierarchy. After that it loads the template which often has a WordPress loop.

29. Do Action ‘shutdown’

Right before ending all PHP execution, WordPress fires the last action called shutdown.

WordPress stops working here. It offers run the rule and generated user’s requested web page.

Now, your web web hosting server replies to user’s request by giving them the internet web page produced by WordPress. These pages contains HTML, CSS, and Javascript code, which tells user’s browser how exactly to display it on display screen.

Amazing isn’t it? All these things happen within milliseconds. If you work with one of these brilliant best WordPress web hosting services, then ideally your page will load in several moments.

Develop this short article helped you find out how WordPress works behind the scenes. You may even desire to see our step-by-step guide on how best to improve WordPress speed and performance for beginners.

If you liked this article, then please sign up for our YouTube Channel for WordPress video tutorials. There are also us on Twitter and Facebook.

How to Add Custom Meta Boxes in WordPress Posts and Post Types

Do you want to create custom meta boxes for your WordPress posts, pages, and custom post types? Custom meta boxes are commonly used to provide a better user interface for adding custom fields (meta data) into your content. In this article, we will explain what is a custom meta box, and how you can easily add custom meta boxes in WordPress posts and post types.

How to add custom meta boxes in WordPress posts

What is a Custom Meta Box in WordPress?

Custom meta box is a more user friendly interface to add custom fields (meta data) in your posts, pages, and other custom post types.

WordPress comes with an easy to use interface that helps you create content like posts and pages, or custom psot types.

Normally, each content type consists of the actual content and its metadata. Metadata is information related to that content like date and time, author name, title, and more. You can also add your own meta data by using custom fields.

Custom fields

However, adding metadata using the default custom fields box is not very intuitive. This is where custom meta boxes come in.

WordPress allows developers to create and add their own custom meta boxes on post edit screens. That’s how most popular plugins add different options on your post edit screens.

For example, the SEO title and meta description box inside Yoast SEO plugin is a custom meta box:

Category SEO Title and Meta description in Yoast SEO

Having said that, let’s see how you can easily add custom meta boxes in WordPress posts and post types.

Creating Custom Meta Boxes in WordPress

First, thing you need to do is install and activate the Advanced Custom Fields plugin. For more details, see our step by step guide on how to install a WordPress plugin.

Upon activation, the plugin adds a new menu item labeled ‘Custom Fields’ to your WordPress admin bar. Clicking on it will take you to the custom fields page.

This page will be empty since you haven’t created any custom fields yet. Go ahead and click on the ‘Add New’ button to continue.

Add new custom fields group

You will be taken to the ‘Add New Field Group’ page.

Here you need to provide a title for your field group. This title will be used as the title of your meta box.

After that you can start adding your fields. Simply click on the ‘+ Add Field’ button to add your first field.

Add your fist field

This will bring up the field settings form. First you need to provide a label for your field. This label will be displayed in your meta box before the field.

Creating a new field for your custom meta box

After that you need to select the field type. Advanced Custom Fields plugin allows you to choose from a whole range of options. This includes text, textarea, radio buttons, checkboxes, full WYSIWYG editor, images, and more.

Next, you need to provide field instructions. These instructions will tell users what to add into the field.

Below that, you will find other options for your field. You need to carefully review these options and adjust them to match your needs.

Field settings

Next, click on the close field button to collapse the field.

If you need to add more fields to your metabox, then click on the ‘+ Add Field’ button to add another field.

Close field and add another

Once you are done adding fields, you can scroll down to the location section. This is where you can define when and where you want your meta box to be displayed.

Location rules

Advanced Custom Fields comes with a handful of predefined rules for you to choose from. For example, you can select post types, post category, taxonomy, page parent, and more.

Next, comes the meta box options settings.

First you need to choose the order number. If you have multiple field groups defined for one location, then you can select the order number for them to be displayed. If you are unsure, then leave it as 0.

Meta box options

Next, you need to choose the meta box position on the page. You can choose to show it after the content, before the content, or in the right column.

Below that, you will need to choose a style for your meta box. You can choose it to be like all other WordPress meta boxes, or you can choose it to be seamless (without any meta box).

If you are unsure, then select Standard (WP Meta box) option.

Lastly, you will see a list of fields normally displayed on a post edit screen. If you want to hide a particular field on your post edit screen, then you can check it here. If you are not sure, then its best to leave them unchecked.

Once you are done, click on the publish button to make your field group live.

Publish your field group

Congratulations, you have successfully created your custom meta box for your WordPress post or post type.

Depending on your settings, you can now visit your post or post type to see your custom meta box in action.

Custom metabox preview

You can use this custom meta box to add meta data into your posts or post types. This data will be stored in your WordPress database when you save or publish the post.

Displaying Your Custom Meta Box Data in WordPress Theme

So far we have successfully created a custom meta box and displayed it on our post edit screen. The next step is to display the data stored in those fields on your WordPress theme.

First, you need to edit the custom field group you created earlier. On the ‘Edit Field Group’ page, you will see your custom fields, and their names.

Field names

You will need these fields names to display them on your website.

Advanced Custom Fields allows you to do that in two different ways.

First, you can use a shortcode to display a custom field into your post.

[acf field="article_byline"]

You can also display them by adding code into your WordPress theme files. If you haven’t done this before, then take a look at our beginner’s guide on how to copy and paste code in WordPress.

You will need to edit the theme file where you want to display the data from these fields. For example, single.php, content.php, page.php, and so on.

You will need to make sure that you add the code inside the WordPress loop. The easiest way to make sure that you are entering the code inside the loop is to look for a line in your code that looks like this:

<?php while ( have_posts() ) : the_post(); ?>

You can paste your code after this line and before the line that ends the loop:

<?php endwhile; // end of the loop. ?>

Your custom field code would look something like this:

<h2 class="article-byline"><?php the_field('article_byline'); ?></h2>

This code will display the data entered into the article byline field of our custom meta box.

Notice how we wrapped the code in a h2 heading with a CSS class. This will help us format and style the custom field later by adding custom CSS into our theme.

Here is another example:

<blockquote class="article-pullquote"> <?php the_field('article_pullquote'); ?> </blockquote> 

Don’t forget to replace the field names with your own field names.

You can now visit the post where you have already entered the data into your custom fields. You would be able to see your custom meta data displayed.

Custom fields displayed on a website

Advanced Custom Fields is a very powerful plugin with a lot of options. This tutorial only scratches the surface. If you need more help, then don’t forget to check out the plugin’s documentation on how to further extend it.

We hope this article helped you learn how to add custom meta boxes in WordPress posts and post types. You may also want to see our step by step guide on how to boost WordPress speed and performance for beginners.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.