wordpress in 30 minutes
DESCRIPTION
How to configure a server, install WordPress, customize the output, and deploy using git... All in 30 minutes. A presentation for the Philly 'Burbs WordPress Meetup.TRANSCRIPT
![Page 1: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/1.jpg)
30 MinutesTo Build a WordPress Site
![Page 2: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/2.jpg)
What's About To Happen?Live, Unscripted Code
Provided the wifi holds up...Are you
INSANE???Oh, yes...
![Page 3: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/3.jpg)
The Intent of This PresentationHow One Could Construct and Deploy a WordPress Site in 30MinutesProvide Thoughts for Research, Not Detailed InstructionsGenerally: Pragmatic ideas for stepping up your game
![Page 4: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/4.jpg)
Who Are We?Owen Winkler
You!WordPress EnthusiastsGraphic/Web DesignersWordPress Implementers
![Page 5: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/5.jpg)
What Do We Need To Begin?Discovered RequirementsGraphic AssetsService Credentials
DNSVPS Hosting
Our Wits
![Page 6: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/6.jpg)
Requirements Gathering
![Page 7: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/7.jpg)
Requirements Mad LibsColor
Person's Name
Number (1-100)
Animal
Fruit
![Page 8: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/8.jpg)
RequirementsProduce a site to inform the public aboutnutrition bars for their hungry production
facilities.
Each bar will cost a mere $ and will provide atestimonial.
Someone is very fond of the color .
![Page 10: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/10.jpg)
Server Setup
![Page 11: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/11.jpg)
VPS/Cloud HostingMy Recommended Providers:
Rackspace - Digital Ocean -
![Page 12: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/12.jpg)
VPS/Cloud Hosting InstallationSteps
1. Choose and configure 2. Record the IP address used for the server:
3. Download and execute the
wget -q -O - http://asym.us/spinup_ubuntu1204_lnmp | bash
![Page 13: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/13.jpg)
DNSLocal DNSStaging DNSProduction DNS
![Page 14: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/14.jpg)
Local DNS
Windows 8 -
Linux & OSX -
Domain to use: wp.claire
![Page 15: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/15.jpg)
Production DNSGoDaddy - Stop using this!
Namecheap -
Domain to use: wp.owenw.com
IP Address:
![Page 16: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/16.jpg)
Host ConfigDoes have LNMP spun up?
Create a directory to house the site.mkdir -p /var/www/wp.owenw.com/htdocscd /var/www/wp.owenw.com/htdocs
![Page 17: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/17.jpg)
Speed Test<!DOCTYPE html><html><head> <title>Am I Fast?</title> <style type="text/css"> .fast { color: green; } .slow { color: red; font-weight: bold; } </style></head><body>
<h1>All of these should be green:</h1>
<?php function test($val) { echo $val ? '<span class="fast">✓</span>' : '<span class="slow">✗</span>'; } ?>
<dl> <dt>Using NGINX:</dt> <dd><?php test(preg_match('#nginx#', $_SERVER['SERVER_SOFTWARE'])); ?></dd> <dt>Using PHP as FastCGI:</dt> <dd><?php test(preg_match('#fcgi#', php_sapi_name())); ?></dd> <dt>Using PHP-FPM:</dt> <dd><?php test(preg_match('#fpm#', php_sapi_name())); ?></dd> <dt>Enabled APC:</dt> <dd><?php test(function_exists('apc_cache_info') && @apc_cache_info('opcode')); ?></dd> <dt>Enabled MySQL QCache:</dt> <dd><?php$conn = new mysqli('localhost', 'root', '');$qry = $conn->query("show variables like 'query_cache_size'"); test(intval($qry->fetch_object()->Value) > 0); ?></dd>
</body></html>
![Page 18: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/18.jpg)
Where's the WordPress in thisWordPress presentation?
![Page 19: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/19.jpg)
Configure the Local WordPressEnvironment
1. Setup local DNS2. Setup local web root3. Setup local database4. Setup version control with a copy of WordPress5. Set up a simple theme
![Page 20: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/20.jpg)
Local Web Root & DatabaseLocal Web Root will be different for everyone
mkdir -p /c/xampp/htdocs/vdr/wp.clairecd /c/xampp/htdocs/vdr/wp.claire
Database is generally the same for everyone
mysql -urootcreate database wp;
![Page 21: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/21.jpg)
Setup Version ControlUsing git and GitHub!
1. on GitHub for your site named "wp"2. and extract WordPress to your local environment3. Initialize the repo with the WordPress files4. Push the files from your local environment to the newly
created repo at GitHub
curl http://wordpress.org/latest.tar.gz | tar xvzmv wordpress htdocs; cd htdocsgit initgit add .git commit -m "Added WordPress to start"git remote add origin [email protected]:ringmaster/wp.gitgit push -u origin master
![Page 22: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/22.jpg)
Set up a Simple ThemeLet's build a child theme of twentytwelve!
/*Theme Name: Someone's Whut BarsTheme URI: http://redalt.com/Description: A theme for the Someone's Whut Bars site, built as a child of twentytwelveAuthor: Owen WinklerAuthor URI: http://owen.com/Template: twentytwelveVersion: 1.0*/@import url("../twentytwelve/style.css");
If not, then maybe use ...
![Page 23: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/23.jpg)
Customization
![Page 24: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/24.jpg)
Static Home PageOur product site is not primarily a blog
Settings » Reading » Front page displays
![Page 25: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/25.jpg)
Main MenuMenus are easy and effective
Create pages as targetsCreate a menuAdd the pages to the menu
![Page 26: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/26.jpg)
Color AccentDon't forget that Someone really likes the color .
html body.custom-background { background-color: #004488;}h1, h1 a, .site-header h1 a { color: #004488;}
Appearance » Background can set the background color, but...
![Page 27: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/27.jpg)
What's this "Word Press" thing?Let's remove the WordPress credit from the footer.
Copy the existing footer.php from twentytwelve into our customwp theme.
![Page 28: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/28.jpg)
Kill CommentsWe don't want comments on our modern product blog
Override the comments.php template with a blank file!
![Page 29: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/29.jpg)
Custom Product TypeLet's create a to use in a sidebar product
listing
add_action( 'init', 'create_product_type' );function create_product_type() { register_post_type( 'wp_product', array( 'labels' => array( 'name' => __( 'Products' ), 'singular_name' => __( 'Product' ) ), 'public' => true, 'has_archive' => false, 'rewrite' => array('slug' => 'products'), ) );}
![Page 30: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/30.jpg)
Things to KnowThis can go in functions.php or a new pluginThe custom type can have its own template:single-{typename}.php
![Page 31: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/31.jpg)
Product WidgetLet's to automatically list items from our
custom product post type
class Products_Widget extends WP_Widget { function __construct() { parent::__construct( 'Products_Widget', 'Products Widget', array( 'description' => 'Displays a listing of Products', ) ); } public function widget( $args, $instance ) { $args = array( 'post_type' => 'wp_product', 'posts_per_page' => 10 ); $loop = new WP_Query( $args ); echo '
Our Products'; while ( $loop->have_posts() ) : $loop->the_post(); the_title(); echo ''; the_content(); echo ''; endwhile; echo '';
![Page 32: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/32.jpg)
Why not use plugins?Two answers:
1. Go ahead!2. More plugins equals more weight, maintenance, and
deployment complication.
![Page 33: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/33.jpg)
Deployment
![Page 34: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/34.jpg)
Deploy FilesStep 1 - Prepare
Make sure everything necessary is in git and pushed to github:
git statusgit commit -am "Update everything."git push origin master
The wp-config.php file?
![Page 35: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/35.jpg)
Deploy FilesStep 2 - "Upload"
Instead of using SFTP to upload files,we'll use git to download them directly to the server
cd /var/www/wp.owenw.comgit clone https://github.com/ringmaster/wp.git htdocs
![Page 36: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/36.jpg)
Deploy DatabaseStep 1 - Prepare
Database transfer is complicated... Let's use the plugin.
cd /c/xampp/htdocs/vdr/wp.claire/htdocs/wp-content/uploadsscp wp-migrate-....sql [email protected]:/var/www/wp
![Page 37: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/37.jpg)
Deploy DatabaseStep 2 - Restore
This process overwrites all of the database data on the servermysql -uroot wp < wp-migrate-....sql
![Page 38: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/38.jpg)
The Nuts
![Page 39: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/39.jpg)
Missed Some WordPressThings
BackupUsersSEOPlugins and must-use plugins
![Page 40: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/40.jpg)
Missed Some ConfigurationThings
wp-config.php on dev/staging/localCaching Reverse-Proxy? Varnish?Wait, where's the .htaccess?
![Page 41: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/41.jpg)
Missed Some DeploymentThings
Automated deployment. See: capistranoHow are updates to code/core handled?How are updates from production handled?How are user uploads handled?What happens when something goes wrong?
![Page 42: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/42.jpg)
Missed Some Security ThingsWhat's with all the "root" access?MySQL users don't have passwords?Where are your firewall rules?
![Page 43: WordPress in 30 minutes](https://reader033.vdocument.in/reader033/viewer/2022051616/555cdf29d8b42a4f2b8b5666/html5/thumbnails/43.jpg)
The End