Web Design

This is the second post about my journey working with WordPress Multisite. You can also read my first post on this topic: Developing a WordPress Multisite Network of Sites Using Thesis Theme.

My situation is: I am redesigning a website and a blog and I decided to hook them together using WordPress’s Multisite function to make future administration much simpler. I’ve got Website-1 which is not currently using WordPress and Blog-1 which is currently on WordPress and is a subdomain of Website-1. They each will have their own domain names. I’ve developed the website on my computer using MAMP. Now I need to move the newly designed site to the live server and map the domains.

The official WordPress Codex article: Migrating Multiple Blogs into WordPress 3.0 Multisite

Steps to Move from Local to Live Server:

Backup your localsite and livesite, both database and files. How-to on the Codex.
Grab the database that was created locally for import to the livesite server. Navigate to phpMyAdmin on MAMP screen in your broswer. Export the localsite database to your computer as a zipped SQL file.
Using FTP to connect to your livesite server, upload all the local WordPress files to your livesite in the root directory (public_html). Don’t place them in a folder. To be clear, you are uploading all the contents of WordPress folder, but not the folder itself. This upload will take a while. While that’s going on….
Log in to cpanel for your livesite and go to MySQL Databases. Create a new Database and a User. Write down the Database name, User, and Password. Give User all privileges.
On the FTP, open up the wp-config.php file just uploaded to your livesite server and make these changes to the database name, user, password in the file. (See Step 3 on this helpful walkthrough.)
In cpanel, go to phpMyAdmin and import the localsite database saved to your computer in step 2 to your newly created database.
In cpanel phpMyAdmin, open up the new database. You will need to make several changes to the domain and site_url fields. (Instead of pointing to http://localhost, you want your site to point to http://yourdomain.com.) For this step, follow the instructions on this blog post, and I followed steps 6-13. Make sure to read the comments about changed the blogs_id as well.

Domain Mapping

I wanted to use distinct URLs for both the Website-1 and Blog-1. When you set up multisite with a subdirectory install, the default URLs look like:

http://website-1.com
http://website-1.com/blog-1

How do you redirect the second URL to http://blog-1.com?

This is where a handy plugin, called WordPress MU Domain Mapping, comes in handy. (Although it frustrates me that this is not an option included with WordPress itself and that it’s so darn hard to find good documentation on how to complete domain mapping for a newbie like me!)

There is a detailed walkthrough found on WPWebHost: Using multiple Domains with WordPress MU
Another detailed walkthrough is found on OttoPress: WordPress 3.0 Domain Mapping Tutorial

I would recommend backing up before installing the plugin, because I had problems the first time, probably due to my own ignorance.

OK, because I often use a mash-up of the walkthroughs I read, here are the steps I took to map my blog’s domain:

Download WordPress MU Domain Mapping plugin. Log in to FTP. Drop the unzipped folder into ‘Plugins’ folder in ‘wp/content’. Copy ‘sunrise.php’ and paste into ‘wp-content’ folder.
Edit ‘wp-config.php’. Add the following line of code before the line /* That's all, stop editing! Happy blogging. */:
define( 'SUNRISE', 'on' );
Log in to WordPress Network Admin area. Go to ‘Settings’ — ‘Domain Mapping’. Add your IP Address. Click options as desired. I just did ‘Permanent Redirect’. Click ‘Save’.
Got to ‘Settings’ — ‘Domains’. Define the site id (2 for me) and the domain to redirect to (for me blog-1.com).
In my case, I didn’t need to edit the DNS, because that domain was already pointing to the IP Address, under an old WordPress install. I deleted the old Subdomain and Addon Domain in cpanel.
Then in cpanel, I added a Parked Domain, directing blog-1.com to public_html (the root where my WordPress Multisite is installed).
Click refresh (maybe wait two minutes) and your new domain mapping should be working fine.

I hope this walkthrough has been helpful! If you have any comments or updates, please share in the comments below. Happy coding!

I was asked to re-design two websites and we decided that using WordPress’s multisite function would be a perfect way to make administration and upkeep much easier for the two sites, considering another site or two might get connected in the future. You can read about how to Create a Network on the WordPress Codex.

The second consideration was which theme to use, and we decided to use Thesis by DIYthemes, which is used by many developer types and has great flexibility.

I am a basic–intermediate level when it comes to making WordPress sites. I’m no coder, although I’m trying to learn more. Thus, I rely on the generosity of other bloggers who kindly post tutorials and guides on their blogs. I want to share which bloggers and posts I relied on for this project, so that anyone else developing a WordPress multisite network of sites using the Thesis theme will have the resource.

Here is my step-by-step process:

1. Using MAMP to locally host websites during development

The software MAMP (acronym stands for: Macintosh, Apache, MySQL, and PHP) allows you to install WordPress on your computer, for development purposes. The website will be shown in your browser as if it were live online, but only you can see it.

I suggest first reading the WordPress tutorial on installing MAMP and WordPress on your machine. However, after you’ve read this, use the adaptation on the blog Musings of an Esposito, which modifies the process to work for multisite.

The only problem I ran into was in Step 4.1 “Editing Your httpd.conf “. The code given did not work for me. This is the code I ended up putting in my httpd.conf file:

NameVirtualHost *:80
<VirtualHost *:80>
DocumentRoot "/Users/[Username]/Sites/wordpress"
ServerName [mysitename].dev
<Directory "/Users/[Username]/Sites/wordpress">
AllowOverride All
</Directory>
</VirtualHost>

That worked for me, but I found several variants. It depends where you install your WordPress. I installed mine under Sites directory.

You should be able to type localhost into your web browser and complete the WordPress install and set up your sites through the dashboard.

2. Installing Thesis for Multisite

It’s best to follow the instructions on fourblogger.com on how to install Thesis theme to enable it to be used for all sites on the network. This means that each site can be customized using one Thesis install. I followed these steps and it worked perfectly.

3. Modifying Thesis

With Thesis, one has the opportunity to made a number of changes to design using just the editor in your Dashboard. The Site Options and Design Options tabs are full of changes you can make.

Here is a great post on artofblog.com about the difference between Page Framework and Full-Width Framework in Thesis. I used and modified the code given to make changes to my Nav and Footer and Header colours.

Thesis uses hooks to define parts of your theme. These hooks are used in the PHP code and DIYthemes has provided a Thesis Hook Reference Lists. If you don’t know much about hooks, read the Sugarrae.com post Thesis Tutorial – Hooks for Dummies.

Using full-width headers and footers is a common style for websites these days. I really liked kristarella.com for its simple and effective tutorials on both these subjects (full-width headers and full-width footers). I suggest further exploring kristarella.com for more tutorials on the Thesis theme.

Conclusion

I’m still working on the design of my websites, and plan to share in a future post my results and more resources to build great websites using Thesis. Best of luck to all Thesis developers!

Migrating MAMP locally hosted WordPress Multisite to live server