(For more resources related to this topic, see here.)
Now that you’ve got a working multisite installation, we can start to add some customizations. Customizations can come in a few different forms. You’re probably aware of the customizations that can be made via WordPress plugins and custom WordPress themes. Another way we can customize a multisite installation is by creating a landing page that displays information about each blog in the multisite network, as well as displaying information about the author for that individual blog.
I wrote a blog post shortly after WordPress 3.0 came out detailing how to set this landing page up. At the time, I was working for a local newspaper and we were setting up a blog network for some of our reporters to blog about politics (being in Iowa, politics are a pretty big deal here, especially around Caucus time). You can find the post at http://www.longren.org/how-to-wordpress-3-0-multi-site-blog-directory/ if you’d like to read it. There’s also a blog-directory.zip file attached to the post that you can download and use as a starting point.
Before we get into creating the landing page, let’s get the really simple stuff out of the way and briefly go over how themes and plugins are managed in WordPress multisite installations. We’ll start with themes. Themes can be activated network-wide, which is really nice if you have a theme that you want every site in your blog network to use. You can also activate a theme for an individual blog, instead of activating the theme for the entire network. This is helpful if one or two individual blogs need to have a totally unique theme that you don’t want to be available to the other blogs.
Theme management
You can install themes on a multisite installation the same way you would with a regular WordPress install. Just upload the theme folder to your wp-content/themes folder to install the theme. Installing a theme is only part of the process for individual blogs to use the themes; you’ll need to activate them for the entire blog network or for specific blogs.
To activate a theme for an entire network, click on Themes and then click on Installed Themes in the Network Admin dashboard. Check the themes that you want to enable, select Network Enable in the Bulk Actions drop-down menu, and then click on the Apply button. That’s all there is to activating a theme (or multiple themes) for an entire multisite network. The individual blog owners can apply the theme just as you would in a regular, nonmultisite WordPress installation.
To activate a theme for just one specific blog and not the entire network, locate the target blog using the Sites menu option in the Network Admin dashboard. After you’ve found it, put your mouse cursor over the blog URL or domain. You should see the action menu appear immediately under the blog URL or domain. The action menu includes options such as Edit, Dashboard, and Deactivate. Click on the Edit action menu item and then navigate to the Themes tab. To activate an individual theme, just click on Enable below the theme that you want to activate. Or, if you want to activate multiple themes for the blog, check all the themes you want through the checkboxes on the left-hand side of each theme from the list, select Enable in the Bulk Actions drop-down menu, and then click on the Apply button. An important thing to keep in mind is that themes that have been activated for the entire network won’t be shown here. Now the blog administrator can apply the theme to their blog just as they normally would.
Plugin management
To install a plugin for network use, upload the plugin folder to wp-content/plugins/ as you normally would. Unlike themes, plugins cannot be activated on a per-site basis. As network administrator, you can add a plugin to the Plugins page for all sites, but you can’t make a plugin available to one specific site. It’s all or nothing.
You’ll also want to make sure that you’ve enabled the Plugins page for the sites that need it. You can enable the Plugins page by visiting the Network Admin dashboard and then navigating to the Network Settings page. At the bottom of that page you should see a Menu Settings section where you can check a box next to Plugins to enable the plugins page. Make sure to click on the Save Changes button at the bottom or nothing will change. You can see the Menu Settings section in the following screenshot. That’s where you’ll want to enable the Plugins page.
Enabling the Plugins page
After you’ve ensured that the Plugins page is enabled, specific site administrators will be able to enable or disable plugins as they normally would.
To enable a plugin for the entire network go to the Network Admin dashboard, mouse over the Plugins menu item, and then click on Installed Plugins. This will look pretty familiar to you; it looks pretty much like the Installed Plugins page does on a typical WordPress single-site installation. The following screenshot shows the installed Plugins page:
Enable plugins for the entire network
You’ll notice below each plugin there’s some text that reads Network Activate. I bet you can guess what clicking that will do. Yes, clicking on the Network Activate link will activate that plugin for the entire network.
That’s all there is to the basic plugin setup in WordPress multisite. There’s another plugin feature that is often overlooked in WordPress multisite, and that’s must-use plugins. These are plugins that are required for every blog or site on the network.
Must-use plugins can be installed in the wp-content/mu-plugins/ folder but they must be single-file plugins. The files within folders won’t be read. You can’t deactivate or activate the must-use plugins. If they exist in the mu-plugins folder, they’re used. They’re entirely hidden from the Plugin pages, so individual site administrators won’t even see them or know they’re there. I don’t think must-use plugins are a commonly used thing, but it’s nice information to have just in case. Some plugins, especially domain mapping plugins, need to be installed in mu-plugins and need to be activated before the normal plugins.
Third-party plugins and plugins for plugin management
We should also discuss some of the plugins that are available for making the management of plugins and themes on WordPress multisite installations a bit easier. One of the most popular plugins is called Multisite Plugin Manager, and is developed by Aaron Edwards of UglyRobot.com. The Multisite Plugin Manager plugin was previously known as WPMU Plugin Manager. The plugin can be obtained from the WordPress Plugin Directory at http://wordpress.org/plugins/multisite-plugin-manager/. Here’s a quick rundown of some of the plugin features:
- Select which plugins specific sites have access to
- Set certain plugins to autoactivate itself for new blogs or sites
- Activate/deactivate a plugin on all network sites
- Assign some special plugin access permissions to specific network sites
Another plugin that you may find useful is called WordPress MU Domain Mapping. It allows you to easily map any blog or site to an external domain. You can find this plugin in the WordPress Plugin Directory at http://wordpress.org/plugins/wordpress-mu-domain-mapping/.
There’s one other plugin I want to mention; the only drawback is that it’s not a free plugin. It’s called WP Multisite Replicator, and you can probably guess what it does. This plugin will allow you to set up a “template” blog or site and then replicate that site when adding new sites or blogs. The idea is that you’d create a blog or site that has all the features that other sites in your network will need. Then, you can easily replicate that site when creating a new site or blog. It will copy widgets, themes, and plugin settings to the new site or blog, which makes deploying new, identical sites extremely easy. It’s not an expensive plugin, costing about $36 at the moment of writing, which is well worth it in my opinion if you’re going to be creating lots of sites that have the same basic feature set. WP Multisite Replicator can be found at http://wpebooks.com/replicator/.
Creating a blog directory / landing page
Now that we’ve got the basic theme and plugin stuff taken care of, I think it’s time to move onto creating a blog directory or a landing page, whichever you prefer to call it. From this point on I’ll be referring to it as a blog directory. You can see a basic version of what we’re going to make in the following screenshot. The users on my example multisite installation, at http://multisite.longren.org/, are Kayla and Sydney, my wife and daughter.
Blog directory example
As I mentioned earlier in this article, I wrote a post about creating this blog directory back when WordPress 3.0 was first released in 2010. I’ll be using that post as the basis for most of what we’ll do to create the blog directory with some things changed around, so this will integrate more nicely into whatever theme you’re using on the main network site.
The first thing we need to do is to create a basic WordPress page template that we can apply to a newly created WordPress page. This template will contain the HTML structure for the blog directory and will dictate where the blog names will be shown and where the recent posts and blog description will be displayed.
There’s no reason that you need to stick with the following blog directory template specifically. You can take the code and add or remove various elements, such as the recent post if you don’t want to show them.
You’ll want to implement this blog directory template as a child theme in WordPress. To do that, just make a new folder in wp-content/themes/. I typically name my child theme folders after their parent themes. So, the child theme folder I made was wp-content/themes/twentythirteen-tyler/.
Once you’ve got the child theme folder created, make a new file called style.css and make sure it has the following code at the top:
/*
Theme Name: Twenty Thirteen Child Theme
Theme URI: http://yourdomain.com
Description: Child theme for the Twenty Thirteen theme
Author: Your name here
Author URI: http://example.com/about/
Template: twentythirteen
Version: 0.1.0
*/
/* ================ */
/* = The 1Kb Grid = */ /* 12 columns, 60 pixels each, with 20
pixel gutter */
/* ================ */
.grid_1 { width:60px; }
.grid_2 { width:140px; }
.grid_3 { width:220px; }
.grid_4 { width:300px; }
.grid_5 { width:380px; }
.grid_6 { width:460px; }
.grid_7 { width:540px; }
.grid_8 { width:620px; }
.grid_9 { width:700px; }
.grid_10 { width:780px; }
.grid_11 { width:860px; }
.grid_12 { width:940px; }
.column {
margin: 0 10px;
overflow: hidden;
float: left;
display: inline;
}
.row {
width: 960px;
margin: 0 auto;
overflow: hidden;
}
.row .row {
margin: 0 -10px;
width: auto;
display: inline-block;
}
.author_bio {
border: 1px solid #e7e7e7;
margin-top: 10px;
padding-top: 10px;
background:#ffffff url('images/sign.png') no-repeat right bottom;
z-index: -99999;
}
small { font-size: 12px; }
.post_count {
text-align: center;
font-size: 10px;
font-weight: bold;
line-height: 15px;
text-transform: uppercase;
float: right;
margin-top: -65px;
margin-right: 20px;
}
.post_count a {
color: #000;
}
#content a {
text-decoration: none;
-webkit-transition: text-shadow .1s linear;
outline: none;
}
#content a:hover {
color: #2DADDA;
text-shadow: 0 0 6px #278EB3;
}
The preceding code adds the styling to your child theme, and also tells WordPress the name of your child theme. You can set a custom theme name if you want by changing the Theme Name line to whatever you like. The only fields in that big comment block that are required are the Theme Name and Template. Template, which should be set to whatever the parent theme’s folder name is.
Now create another file in your child theme folder and name it blog-directory.php. The remaining blocks of code need to go into that blog-directory.php file:
<?php
/**
* Template Name: Blog Directory
*
* A custom page template with a sidebar.
* Selectable from a dropdown menu on the add/edit page screen.
*
* @package WordPress
* @subpackage Twenty Thirteen
*/
?>
<?php get_header(); ?>
<div id="container" class="onecolumn">
<div id="content" role="main">
<?php the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<?php if ( is_front_page() ) { ?>
<h2 class="entry-title"><?php the_title(); ?></h2>
<?php } else { ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php } ?>
<div class="entry-content">
<!-- start blog directory -->
<?php
// Get the authors from the database ordered randomly
global $wpdb;
$query = "SELECT ID, user_nicename from $wpdb->users WHERE ID != '1'
ORDER BY 1 LIMIT 50";
$author_ids = $wpdb->get_results($query);
// Loop through each author
foreach($author_ids as $author) {
// Get user data
$curauth = get_userdata($author->ID);
// Get link to author page
$user_link = get_author_posts_url($curauth->ID);
// Get blog details for the authors primary blog ID
$blog_details = get_blog_details($curauth->primary_blog);
$postText = "posts";
if ($blog_details->post_count == "1") {
$postText = "post";
}
$updatedOn = strftime("%m/%d/%Y at %l:%M %p",strtotime($blog_details-
>last_updated));
if ($blog_details->post_count == "") {
$blog_details->post_count = "0";
}
$posts = $wpdb->get_col( "SELECT ID FROM wp_".$curauth->primary_
blog."_posts WHERE post_status='publish' AND post_type='post' AND
post_author='$author->ID' ORDER BY ID DESC LIMIT 5");
$postHTML = "";
$i=0;
foreach($posts as $p) {
$postdetail=get_blog_post($curauth->primary_blog,$p);
if ($i==0) {
$updatedOn = strftime("%m/%d/%Y at %l:%M %p",strtotime($postdetail-
>post_date));
}
$postHTML .= "• <a href="$postdetail->guid">$postdetail->post_
title</a><br />";
$i++;
}
?>
The preceding code sets up the theme and queries the WordPress database for authors. In WordPress multisite, users who have the Author permission type have a blog on the network. There’s also code for grabbing posts from each of the network sites for displaying the recent posts from them:
<div class="author_bio">
<div class="row">
<div class="column grid_2">
<a href="<?php echo $blog_details->siteurl; ?>"><?php echo get_
avatar($curauth->user_email, '96','http://www.gravatar.com/avatar/
ad516503a11cd5ca435acc9bb6523536'); ?></a>
</div>
<div class="column grid_6">
<a href="<?php echo $blog_details->siteurl; ?>" title="<?php echo
$curauth->display_name; ?> - <?=$blog_details->blogname?>"><?php //
echo $curauth->display_name; ?> <?=$curauth->display_name;?></a><br />
<small><strong>Updated <?=$updatedOn?></strong></small><br />
<?php echo $curauth->description; ?>
</div>
<div class="column grid_3">
<h3>Recent Posts</h3>
<?=$postHTML?>
</div>
</div>
<span class="post_count"><a href="<?php echo $blog_details->siteurl;
?>" title="<?php echo $curauth->display_name; ?>"><?=$blog_details-
>post_count?><br /><?=$postText?></a></span>
</div>
<?php } ?>
<!-- end blog directory -->
<?php wp_link_pages( array( 'before' => '<div class="page-link">' .
__( 'Pages:', 'twentythirteen' ), 'after' => '</div>' ) ); ?>
<?php edit_post_link( __( 'Edit', 'twentythirteen' ), '<span
class="edit-link">', '</span>' ); ?>
</div><!-- .entry-content -->
</div><!-- #post-<?php the_ID(); ?> -->
<?php comments_template( '', true ); ?>
</div><!-- #content -->
</div><!-- #container -->
<?php //get_sidebar(); ?>
<?php get_footer(); ?>
Once you’ve got your blog-directory.php template file created, we can get actually started by setting up the page to serve as our blog directory. You’ll need to set the root site’s theme to your child theme; do it just as you would on a nonmultisite WordPress installation.
Before we go further, let’s create a couple of network sites so we have something to see on our blog directory.
Go to the Network Admin dashboard, mouse over the Sites menu option in the left-hand side menu, and then click on Add New. If you’re using a directory network type, as I am, the value you enter for the Site Address field will be the path to the directory that site sits in. So, if you enter tyler as the Site Address value, that the site can be reached at http://multisite.longren.org/tyler/. The settings that I used to set up multisite.longren.org/tyler/ can be seen in the following screenshot. You’ll probably want to add a couple of sites just so you get a good idea of what your blog directory page will look like.
Example individual site setup
Now we can set up the actual blog directory page. On the main dashboard (that is, /wp-admin/index.php), mouse over the Pages menu item on the left-hand side of the page and then click on Add New to create a new page. I usually name this page Home, as I use the blog directory as the first page that visitors see when visiting the site. From there, visitors can choose which blog they want to visit and are also shown a list of the most recent posts from each blog.
There’s no need to enter any content on the page, unless you want to. The important part is selecting the Blog Directory template. Before you publish your new Home / blog directory page, make sure that you select Blog Directory as the Template value in the Page Attributes section. An example a Home / blog directory page can be seen in the following screenshot:
Example Home / blog directory page setup
Once you’ve got your page looking like the example, as shown in the previous screenshot, you can go ahead and publish that page. The Update button in the previous screenshot will say Publish if you’ve not yet published the page.
Next you’ll want to set the newly created Home / blog directory page as the front page for the site. To do this, mouse over the Settings menu option on the left-hand side of the page and then click on Reading. For the Front page displays value, check A static page (select below). Previously, Your latest posts was checked. Then for the Front Page drop-down menu, just select the Home page that we just created and click on the Save Changes button at the bottom of the page. I usually don’t set anything for the Posts page drop-down menu because I never post to the “parent” site. If you do intend to make posts on the parent site, I’d suggest that you create a new blank page titled Posts and then select that page as your Posts page. The reading settings I use at multisite.longren.org can be as shown in the following screenshot:
Reading settings setup
After you’ve saved your reading settings, open up your parent site in your browser and you should see something similar to what I showed in the Blog directory example screenshot. Again, there’s no need for you to keep the exact setup that I’ve used in the example blog-directory.php file. You can give that any style/design that you want. You can rearrange the various pieces on the page as you prefer. You should probably have a decent working knowledge of HTML and CSS to accomplish this, however.
You should have a basic blog directory at this point. If you have any experience with PHP, HTML, and CSS, you can probably extend this basic code and do a whole lot more with it. The number of plugins is astounding and they are of very good quality, generally. And I think Automattic has done great things for WordPress in general. No other CMS can claim to have anything like the number of plugins that WordPress does.
Summary
You should be able to effectively manage themes and plugins in a multisite installation now. If you set the code up, you’ve got a directory showcasing network member content and, more importantly, know how to set up and customize a WordPress child theme now.
Resources for Article :
Further resources on this subject:
- Customization using ADF Meta Data Services [Article]
- Overview of Microsoft Dynamics CRM 2011 [Article]
- Customizing an Avatar in Flash Multiplayer Virtual Worlds [Article]
