Skip to content
This repository has been archived by the owner on Nov 4, 2024. It is now read-only.

0. Quick Start

Jump to bottom
Caryl Wyatt edited this page Aug 24, 2020 · 27 revisions

Before you begin editing the theme, please read through the rest of this wiki.This section will only help you setup a basic dev environment.

roots development, locally

There are three overall steps to working locally on the UA Libraries wordpress theme:

  1. Installing a local server
  2. Installing Wordpress
  3. Cloning the theme and installing/building dependencies/apps

Install a local server

  • A way to serve php/apache/mysql

    • mamp (mac)

      • A common practice with wordpress dev on macOS is to change your ports to 80/3306 (apache/mysql) so you can use localhost in your browser without localhost:8888
      • You may also want to set your document root to a general folder/directory instead of one specific install of wordpress (this may come in handy later when you want to work on multiple WP sites at once). Later, you will be able to visit your local WP install at localhost/[WPDIRECTORYNAME]

    • wamp (windows)

      • Follow the default install, but add php 7.2 (this is the version our server currently runs as of Jan 2020)

      • Multiple people in this unit have had issues with port 80 in WAMP. An easy workaround is to change the port numbers in the apache config file at c:\wamp64\bin\apache\apache[VER]\conf\httpd.conf (which can also be found from WAMP (in your system tray) > Apache > httpd.conf).

      • Replace the 80 in these lines with some other port number, for example 5050

        #Listen 12.34.56.78:80
Listen 0.0.0.0:80
Listen [::0]:80

    • xampp (all)

Install Wordpress

If you're using Local by Flywheel, WordPress is already installed! Skip ahead to clone the theme

macOS

‼️ Screencast with step-by-step instructions as outlined below ‼️

  1. (download and install MAMP if needed, then) launch mamp
  2. go to webstart page
  3. go to tools > phpmyadmin
  4. in the main window, click the databases tab
  5. under Create database add a name for a new database (for this example, I'm naming it roots, but it doesn't matter what you name it as long as you remember it or can look it up in phpmyadmin)
  6. download latest WP from wordpress.org/download and unzip
  7. move that wordpress folder to where you want your wordpress install to live (on macs, use or create /Sites) and rename to new path name (in this example, it will be roots-wp)
  8. if you haven't already done so, change MAMP directory to where your folder is (MAMP > Preferences > Web Server > Document Root)
  9. might also want to change your ports to 80/3306 so you don't have to do localhost:8888
  10. in your browser, head to localhost, click the directory for your new WP install, roots-wp (or go to localhost/roots-wp
  11. run through WP install process: database name is whatever you named your database in step 5, username/password are both root, leave the last two alone; click run installation
  12. on welcome page, create your login info... I like to keep this to the same as my other wordpress logins so I don't confused later
  13. log in to new WP, should see the dashboard

Jump ahead to clone the theme

Windows

Screencast with step-by-step instructions as outlined below (no sound, sorry)

  1. (download and install WAMP if needed, then) launch wamp
  2. go to webstart page (if you changed the port numbers in your apache config file, you will need to go to localhost:[PORT] (e.g. localhost:5050) to see the start page
  3. first step is to create a new database: toward the bottom of the page, under heading "Your Aliases", click phpmyadmin
  4. log in as root and no password
  5. on the left, click the link New to create a new database
  6. in the window on the right under Create database add a name for a new database (for the rest of the instructions, this will be roots, but it really doesn't matter what you name it as long as you remember it) and click Create
  7. download latest WP from wordpress.org/download and unzip
  8. move that wordpress folder to where you want your wordpress install to your wamp path: c:\wamp64\www\wordpress and rename if you want to distinguish from other future WP installs (for the rest of the instructions, this will be roots-wp but again, it doesn't matter)
  9. in your browser, head to localhost:5050/roots-wp
  10. run through WP install process: database name is whatever you named your database in step 6, username is root, untype the password and leave blank, leave the last two alone; click run installation
    • if at this point you get an "Okay, Sparky... run installation" message, you did it!
    • if instead you get "Error establishing database" message, you either put the wrong username/password for the database you created OR your user (root) doesn't have localhost listed in the user settings. In phpmyadmin, go to the home screen (may need to click the house icon in the upper left), select the User Accounts tab. You may need to edit the root user Host from % to Local. That may not fix the problem, and you'll need to create a new user with the Host set to Local. If you create a new user, put that username/password combo in the install form at localhost:5050/roots-wp instead of root user.
  11. on welcome page, create your login info... I like to keep this to the same as my other wordpress logins so I don't confused later
  12. log in to new WP, should see the dashboard

Clone the theme

  1. from roots github repo or in GitHub desktop, clone roots-ualib repo into roots-wp/wp-content/themes directory
  2. move into that roots-ualib directory to install necessary packages/dependencies
  3. INSTALL ALL THE THINGS (note: none of this will work if you don't have node.js installed, so don't skip that step)
    • npm i -g grunt-cli bower
    • sudo npm i
    • bower install
    • grunt
    • once it finishes building, Ctrl+C to stop watching
    • open roots-ualib/wp-config.php and add define( 'WP_ENV', 'development' ); to the top under the initial comment block and before the database configurations
  4. In WP dashboard, head to Appearance > Themes and activate University of Alabama Libraries theme
  5. Visit site, see your handiwork!
    • If you get an error, something from the above list of lots of things to install either did not install or did not build; run through it again
    • Both bower and grunt will have many warnings and errors, this is okay for now, so don't worry about it 👍

◄ Home     Before you begin ►

Clone this wiki locally