wordpress in 30 minutes
Post on 21-May-2015
2.814 Views
Preview:
DESCRIPTION
TRANSCRIPT
30 MinutesTo Build a WordPress Site
What's About To Happen?Live, Unscripted Code
Provided the wifi holds up...Are you
INSANE???Oh, yes...
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
Who Are We?Owen Winkler
owen@criticalhit.us
You!WordPress EnthusiastsGraphic/Web DesignersWordPress Implementers
What Do We Need To Begin?Discovered RequirementsGraphic AssetsService Credentials
DNSVPS Hosting
Our Wits
Requirements Gathering
Requirements Mad LibsColor
Person's Name
Number (1-100)
Animal
Fruit
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 .
Server Setup
VPS/Cloud HostingMy Recommended Providers:
Rackspace - Digital Ocean -
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
DNSLocal DNSStaging DNSProduction DNS
Local DNS
Windows 8 -
Linux & OSX -
Domain to use: wp.claire
Production DNSGoDaddy - Stop using this!
Namecheap -
Domain to use: wp.owenw.com
IP Address:
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
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>
Where's the WordPress in thisWordPress presentation?
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
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;
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 git@github.com:ringmaster/wp.gitgit push -u origin master
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 ...
Customization
Static Home PageOur product site is not primarily a blog
Settings » Reading » Front page displays
Main MenuMenus are easy and effective
Create pages as targetsCreate a menuAdd the pages to the menu
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...
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.
Kill CommentsWe don't want comments on our modern product blog
Override the comments.php template with a blank file!
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'), ) );}
Things to KnowThis can go in functions.php or a new pluginThe custom type can have its own template:single-{typename}.php
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 '';
Why not use plugins?Two answers:
1. Go ahead!2. More plugins equals more weight, maintenance, and
deployment complication.
Deployment
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?
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
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 root@wp.owenw.com:/var/www/wp
Deploy DatabaseStep 2 - Restore
This process overwrites all of the database data on the servermysql -uroot wp < wp-migrate-....sql
The Nuts
Missed Some WordPressThings
BackupUsersSEOPlugins and must-use plugins
Missed Some ConfigurationThings
wp-config.php on dev/staging/localCaching Reverse-Proxy? Varnish?Wait, where's the .htaccess?
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?
Missed Some Security ThingsWhat's with all the "root" access?MySQL users don't have passwords?Where are your firewall rules?
The End
top related