Setting Up A Local Server For WordPress

Setting Up A Local Server For WordPress

Posted on by

Develop A WordPress Site On Your Computer Before Making It Live

Windows Setup | Mac Setup

My first web design job was a website redesign. Switching the current website from a static HTML website to the WordPress CMS. The challenge was to make sure there was no downtime for the organization’s clients needing daily service and scheduling information while I was developing. The solution was setting up a local server for WordPress on my computer then migrating the finished site to the live server.

Another reason for setting up WordPress on a local server is not wanting a random internet surfer to preview your incomplete work, especially when starting to customize a fresh wordpress site. If you’re a startup, a good first impression is important for keeping visitors coming back or believing in your product. You may also risk search engine bots logging broken links or logging “work in progress” content pages devaluing your search engine rankings.

Unlike a static HTML website where it’s easy to view your progress through a browser, building or customizing a WordPress theme you need the full functionality as if it were live. Which is what makes WordPress so remarkable, the ability to capitalize on the vast free widgets and plugins available.

For those who are just starting to get used to the local concept, in this article I will explain how to setup WordPress locally for both Windows and Mac.

 

Setting Up A Local Server For WordPress On Windows

Mac Setup

XAMPP Install

  1. First install the free open source program called XAMPP which will act as your apache server. For those interested XAMPP stands for Cross Platform (X) Apache MySQL PHP Perl.
    1. Go to apachefriends.org.
    2. Download the XAMPP for Windows version.
    3. Find where the directory XAMPP was downloaded to (usually the windows downloads folder) then double-click the folder to begin the install. About 5 minute install.
    4. Select the “launch when finished option.”
  2. In the XAMPP control panel, we now want to start the Apache and MySQL web servers by clicking the start button under actions for both. **If you get a warning, make sure to click unblock or allow access.Start Apache and MySQL on XAMPP
  3. Test XAMPP is working properly by opening your browser and entering http://localhost into the address bar. If working properly, the XAMPP logo/splash screen should come up.

 

Setting Up A Database

  1. In your browser’s address bar, enter http://localhost/phpmyadmin to open the PHP console panel.
  2. Next click on the “New” button to set up a new database.New Database XAMPP
  3. Name the database. Since this is a local setup, the name of the database isn’t important. Example DB Name: wordpress. > Create.Name Database XAMPP
  4. Add a new user.
    1. Open the new database just created to set up a new user.
    2. At the top menu, click on the “Privileges” tab. Then click on “Add User”.Create New User XAMPP
    3. Fill in a username. Example: wordpress (I like to keep it simple so I don’t have to remember usernames and passwords).
    4. Change the host from “any” to “local” from the drop down menu.
    5. Create a password. Example: wordpress. Then confirm/retype the password.Enter New User Database Information XAMPP
    6. Scroll down to to the bottom and click “go”.

 

Downloading and Installing WordPress

  1. Go to wordpress.org and download the latest version of WordPress to your computer. Yes, it’s free.
  2. Unzip the WordPress folder download by double-clicking on it. A window should pop up with a single file named “wordpress” in it. We will eventually move the “wordpress” file into a XAMPP folder but first we have to navigate to the folder it will eventually be moved to.
  3. Go to the XAMPP console, click “explorer”. Which will open the XAMPP folder. In the XAMPP folder look for another folder “htdocs” and open it. This will be the location where wordpress will live on your local server. Recap: XAMPP console > Explorer > htdocs.Explorer XAMPPXAMPP Folder htdocs Directory
  4. Move the “wordpress” folder into the “htdocs” by drag and dropping. The wordpress file should take a minute to copy over.
  5. Navigate to the new folder by going to your browser and entering http://localhost/wordpress into the address bar. You should see the WordPress logo with the option to choose your language.WordPress Choose Your Language Screen

    1. Choose your language > Continue > Let’s Go.
    2. Enter the database information you setup earlier > Submit > Run the install.
  6. Finish adding additional information in the wordpress installer. In a live server situation you would want to create a very strong username and password…not as important in a local server situation.
    1. Site Tile. Example: My Local WordPress Site
    2. Username. Example: admin
    3. Password. Example: admin
    4. Email. Example: yourname@email.com
    5. Click Install > Login
  7. When you get to the Login page enter in the username and password you just created.
  8. Your local wordpress dashboard will now reside at http://localhost/wordpress/wp-admin. Make sure to have the XAMPP control panel open with Apache and MySQL running every time you want to work on your wordpress site.

Setting Up A Local Server For WordPress On Mac

Windows Setup

MAPP Install

  1. Go to mamp.info, scroll down and choose which version of MAMP you would like to install. Free version is fine. Then click download. For those interested MAMP stands for My Apache – MySQL – PHP.
  2. Install and launch.
  3. Next we will point MAMP to the location where we will install WordPress, which can be anywhere. For demo I will install on my desktop.
    1. Create a new folder on your desktop and name. Example: localwordpresssite
    2. Click “Preferences” on MAMP console. Then click on the “Apache” tab and select the new site folder you just created. OK.MAMP Apache Tab
    3. If servers don’t start automatically, click on “Start Servers”.
    4. You will know it worked correctly because your web browser should open automatically with the MAMP welcome page. http://localhost/MAMP/

Setting Up A Database

  1. Navigate to phpMyAdmin console.
    1. The MAMP welcome page in your browser should still be open. At the top menu click on the “phpMyAdmin” tab.
  2. Name your database in the “Create new database” text box. Example: wordpress. Create.Create Name New Database MAMP

 

Downloading and Installing WordPress

  1. Download WordPress.
    1. Go to wordpress.org and download the latest version of WordPress to your computer.
    2. Double-click on the downloaded .ZIP file and extract the “wordpress” file.
  2. Move the “wordpress” files into new site directory we created on our desktop. My example: localwordpresssite file.
    1. Open the “wordpress” directory and select all (CMD A).
    2. Drag and drop all of the “wordpress” files into the new site directory. Can delete the empty wordpress directory as well as the empty .ZIP.Move WordPress Into New Directory
  3. Install WordPress
    1. Navigate to http://localhost/ in your browser.
    2. The WordPress logo with the language selection dialogue box should appear. Select language > Continue > Let’s go!WordPress Choose Your Language Screen
    3. Fill in the database information.
      1. Database Name: My example: wordpress
      2. User Name: root
      3. Password: root
      4. Database Host: localhost
      5. Submit > Run the install
    4. Finish adding additional information in the wordpress installer. In a live server situation you would want to create a very strong username and password…not as important in a local server situation.
      1. Site Tile. Example: My Local WordPress Site
      2. Username. Example: admin
      3. Password. Example: admin
      4. Email. Example: yourname@email.com
      5. Click Install > Login
    5. When you get to the Login page enter in the username and password you just created.
    6. Your local wordpress dashboard will now reside at http://localhost/wp-admin. Make sure to have the MAMP control panel open every time you want to work on your wordpress site.
Posted in WordPress and tagged , , , , , , .

Leave a Reply