Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Intro to WordPress for Front End Web Workers

Intro to WordPress for Front End Web Workers

A brief introduction to WordPress concepts and the theme engine that powers WordPress sites.

Alison Foxall

April 10, 2015
Tweet

More Decks by Alison Foxall

Other Decks in Programming

Transcript

  1. @alisonmf What WordPress Is • Most popular publishing platform in

    the world, 23% of the web runs WordPress • Heavily supported– about 800 contributors to the core of WordPress, constantly improving it • Very expandable– Over 34,000 free plugins, 2,500 free themes in the repositories on WordPress.org
  2. @alisonmf WordPress Platform Eco-system • WordPress is modular system with

    plugins for additional functionality and themes for different styles
 You can have many plugins installed, activated, and running but you can only have 1 theme activated at any given time. • Smaller Core Updates are pushed to your site automatically
 These could be security patches, small bug patches, etc. They are pushed out in the background every few weeks. You can disable this if you manage a volatile, high-transaction/volume site and complete the updates manually
  3. @alisonmf Getting Started 1. WP Engine
 WordPress specific hosting, secure

    and fast using NGINX, has git push/pull available for usage. Automatic updates, backups, and staging area! One-click installs. 2. Pagely 3. Site Ground 4. Liquid Web Alison’s Tip:
 Please try to avoid shared hosting! Yes, it’s cheap, but it’s much more expensive to fix your site after it was hacked! WordPress Hosting Solutions
  4. @alisonmf WordPress Specific Vocabulary • Posts vs Pages vs Custom

    Post (Content) Type
 The only difference is one column in the database. It’s easier to think of posts as relevant to time and pages are outside of that. Both posts and pages can have comments but comments are normally disabled on pages. You can create additional custom post types for anything (e.g. “people, movies, songs, etc”).
 https:/ /wordpress.org/plugins/pods/ • Custom Fields
 Fields you can add to post types to manage additional data. Very popular for web developers to use these for clients to manage additional content on complex page layouts.
 https:/ /wordpress.org/plugins/advanced-custom-fields/ • Taxonomies
 Taxonomies are a way to organize things. One type of taxonomy that comes pre-installed with WordPress are “Categories”.
 https:/ /wordpress.org/plugins/pods/ • Post Formats
 9 post formats are available for themes to support. This support must be built into it. The post formats allow for different post layouts in your blog.
  5. @alisonmf Warning about repo themes • Any theme in the

    WordPress repository can be updated by its owner automatically. • Don’t modify these theme files, create a child theme instead! • If you’ve made changes to the theme and receive an update from the theme author, your changes will be overwritten!
  6. @alisonmf Child Themes • Create when you like the theme

    you are using but need to make a few modifications to the styles, layout, or functionality. • The new style.css file you use in your child theme will overwrite what’s in your parent theme. • The functions.php will load in addition to your parent theme functions file, and will not overwrite. It will load first, before your parent functions. https:/ /codex.wordpress.org/Child_Themes
  7. @alisonmf Theme Frameworks • The Genesis Framework is the best*


    *Totally Alison’s opinion, but usually she’s right • seo built in • secure and fast platform • regularly maintained • Other Theme Frameworks: • Thematic • WooFramework + Canvas • Thesis
  8. @alisonmf Premium (paid) Themes • Generally designed for the lay

    user to configure, not really for front-end web folks • Many have loads of options available to you to customize the site to your liking. This often causes “bloat”. • Very difficult to manipulate the theme the way you want them.
  9. @alisonmf Skeleton Themes • These are starter themes, meant to

    be forked and crafted into your own creation, some-what of a “boilerplate” for WordPress themes. • There are a handful of skeleton themes that are currently maintained. Some popular ones: • Underscores • Roots / Sage • Bones • We use “Gobble Blank 2” - a starter theme authored by us, using the Bourbon/Neat framework (uses scss).
 https:/ /github.com/gobblelogic/GobbleBlank2
  10. @alisonmf How Themes/Templates Work • PHP files work together to

    create the design and functionality a user experiences • Sections of the site would be housed in separate files like the header, footer, sidebar, etc. You would plan which parts go in which files. • WordPress determines which template file to use based on what type of page the user is viewing like a post, page, home page, blog page, category, etc. This is called the template hierarchy!
  11. @alisonmf Template Tags • Used within your templates to easily

    display dynamic information that is being fed by the user • WordPress offers functions (or template tags) to display or return data (e.g. the_author(); vs. get_the_author();). https:/ /codex.wordpress.org/Template_Tags
  12. @alisonmf Setting your Custom Home Page • Go to Settings

    -> Reading - > Front page displays -> A static page (selection)
  13. @alisonmf Other Custom Pages • Place “Template Name: My Custom

    Page Name” on top of your php pages as a comment. • Select the template on an individual page you’re editing. • This page will now use that template file https:/ /codex.wordpress.org/Page_Templates
  14. @alisonmf Menu System & Other Native Functions • Use the

    native navigation functions so your admin’s can edit the nav. Generally built into most skeleton themes and regular themes. • Featured image field, edit background and edit color fields can all be activated by the use of these functions as well. https:/ /codex.wordpress.org/Navigation_Menus
  15. @alisonmf Plugins Matter • Gravity Forms • Advanced Custom Fields

    or PODS • WooCommerce These plugins will sometime require you to modify styles or edit/create theme files so they fit your branding and styles.
  16. @alisonmf Development & Vagrant VVV - Varying Vagrant Vagrants
 Varying

    Vagrant Vagrants is an evolving Vagrant configuration focused on WordPress dev. https:/ /github.com/Varying-Vagrant-Vagrants/VVV VV - By Bradp
 Site wizard for VVV. The easiest way to set up WordPress sites automatically. https:/ /github.com/bradp/vv
  17. @alisonmf Tampa Bay WordPress • About 950 Members • 5

    Community Locations • Tampa • St. Pete • Brandon • New Port Richey • New Tampa & Wesley Chapel • Workshops, Lectures, 1-on-1 Help, & Classes • At least 4 meetups monthly for your to receive help!
  18. @alisonmf WordCamp Tampa 2015 Sept 25-27 • Conference just for

    WordPress • SAVE THE DATE – SEPT 25-27 • 350 Tickets Being Sold • USF Marshall Student Center, Tampa • 2 Full Days of Conferencing • Saturday - 3 Tracks for Design, Development, Internet Marketing & Publishing • Sunday - 2 Additional Tracks for Business & Entrepreneurial Topics • 1 Full Day for the Beginner Workshop on Friday • 1 Full Day of Developer Workshops on Sunday • Happiness Bar! Get all your questions answered.
  19. @alisonmf Thank You Thank you for having me! Connect with

    me on Twitter - @alisonmf Search for “WordPress Tampa” on Facebook & Join Our Group!