SlideShare a Scribd company logo
1 of 23
Download to read offline
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
FRAMEWORKS, PARENTS & CHILDREN
• Parent Theme
• A base theme that sets up functionality
• Can be extended
• Must be written to allow overrides
• Child Theme
• Extends a parent theme
• Can carry over or override elements from parent
• Cannot be extended without plugins
• Framework
• Not a full theme; more of a plugin for a theme
• Allows creation of parent and child themes with shared functionality
http://justintadlock.com/archives/2010/08/16/frameworks-parent-child-and-grandchild-themes
EXAMPLES
Hybrid Core is a framework. - http://themehybrid.com/hybrid-core
• No theme structure
• Full package goes inside parent theme
Genesis “Framework” is a parent theme -
http://www.studiopress.com/features
• Has a theme structure
• Can be used on its own
• Does not go inside of another theme
TwentyTwelve is a parent theme -
http://wordpress.org/extend/themes/twentytwelve
• Although it has less of a framework built in, same concept as Genesis
“Education” is a child theme - http://my.studiopress.com/themes/education/
• Cannot be used without Genesis (parent theme) installed
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
REQUIRED FILES
CSS Stylesheet (style.css)*
• Implements the CSS for the theme
• Not included by default
• enqueue it in functions.php or
• use <link href=“<?php bloginfo( „stylesheet_uri‟ ) ?>”/> in <head>
• Provides base information about the theme
• Theme name, URI, version, license, etc.
(http://codex.wordpress.org/Theme_Development#Theme_Stylesheet)
Index (index.php)
• Implements the structure of the theme
• Can be split out into multiple files
• Acts as fallback for all pages**
* - style.css is the only file required in a child theme; all others fallback to parent theme
** - the Template Hierarchy governs which files are used for each page; index is the final fallback
TYPICAL THEME FILES
Theme Functions (functions.php)
• Central location for function, variable, constant defintions used in theme
• Included automatically by theme engine before after_setup_theme action
Default Sidebar (sidebar.php)
• Outputs default sidebar (get_sidebar())
Default WordPress Loop (loop.php)
• Not included automatically by theme
• Used to separate “the loop”*** from other structure
Comments Template (comments.php)
• List of comments and comment form; use comments_template() to include
Search (search.php)
• Search results template; automatically used on search results page
MOAR THEME FILES
Automatic Template Files (page.php, 404.php, single.php)
• Used automatically based on type of page being shown;
• Overrides index.php (see the Template Hierarchy)
Miscellaneous Files (sidebar-[slug].php, etc.)
• Include with the get_template_part( „sidebar‟, „[slug]‟ ) function
• Sidebar, header and footer files can be included with:
• get_sidebar( ‘[slug]’ )
• get_header( ‘[slug]’ )
• get_footer( ‘[slug]’ )
Header and Footer (header.php, footer.php)
• Not included automatically
• Call with get_header() & get_footer()
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
THE WORDPRESS TEMPLATE HIERARCHY
WordPress automatically searches for appropriate theme template file
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
WHAT IS “THE LOOP”?
The Loop outputs the main content area
• Loops through all matching content objects
if ( have_posts() ) : while ( have_posts() ) : the_post();
// Output all of your content
endwhile; endif;
have_posts() and the_post()
• Global methods of main query object ($wp_query)
• have_posts() generates array of “post” objects
• the_post() sets global variables related to current post object
OTHER “LOOP” FUNCTIONS
Inside the loop, various functions are available
• the_title() – echoes the title of the current post
• the_content() – echoes the body of the current post
• the_post_thumbnail() – echoes the “featured image” for current post
MOAR LOOP TIPS
If you need to use the same query loop more than once:
• Use rewind_posts() to reset the loop to be used again
You can start your own loop with a custom query:
$myquery = new WP_Query( ‘[query parameters go here]’ );
if ( $myquery->have_posts() ) : while ( $myquery-
>have_posts() ) : $myquery->the_post();
// Your custom loop stuff here
endwhile; endif;
• Don’t alter the global $wp_query or use query_posts() unless you know
what you’re doing
• Use get_posts() or create your own loop, instead
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
STEP 1: DESIGN
• Identify goals
• Wireframe and design
• Layout priorities
• Final template design
• Initial HTML layout
STEP 2: DIVIDE AND CONQUER
• Identify layout elements
• Identify content elements
• Identify visual decoration
• Determine common elements
• Identify alternative layouts
STEP 3: DEVELOP
• Begin developing basic layout
• Separate layout elements from
content elements
• Replace content elements with
placeholders
• Create layout structure and style
• Develop content containers
(body, widgets, footer, header,
etc.)
• Develop custom functionality
Writing a WordPress Theme - HighEdWeb 2013 #WRK2
LET’S DO THIS THING
Examine Theme Design – http://2013.highedweb.org/
Identify Theme Elements
Create required files
style.css - http://j.mp/153SWWv
index.php – wp_head() & wp_footer() - http://j.mp/153Tagt
functions.php (not required, but recommended)
QUESTIONS? COMMENTS?
Twitter: @cgrymala
Website(s): http://umw.edu/ (Multi-Network Setup)
http://ten-321.com/
http://svn.ten-321.com/ (SVN Repo)
http://wphighed.org/ (WP resources for Higher Ed)
Email: cgrymala@umw.edu
curtiss@ten-321.com
SpeakerRate: http://spkr8.com/s/10608
http://about.me/cgrymala

More Related Content

What's hot

Minimalist Theming: How to Build a Lean, Mean Drupal 8 Theme
Minimalist Theming: How to Build a Lean, Mean Drupal 8 ThemeMinimalist Theming: How to Build a Lean, Mean Drupal 8 Theme
Minimalist Theming: How to Build a Lean, Mean Drupal 8 ThemeSuzanne Dergacheva
 
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon Baltimore
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon BaltimoreCreating Landing Pages and Layouts for Drupal 8 - DrupalCon Baltimore
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon BaltimoreSuzanne Dergacheva
 
Creating Web Templates for SharePoint 2010
Creating Web Templates for SharePoint 2010Creating Web Templates for SharePoint 2010
Creating Web Templates for SharePoint 2010Mark Collins
 
Creating a Reusable Drupal Website for Higher Education - at USG Tech Day
Creating a Reusable Drupal Website for Higher Education - at USG Tech DayCreating a Reusable Drupal Website for Higher Education - at USG Tech Day
Creating a Reusable Drupal Website for Higher Education - at USG Tech DaySuzanne Dergacheva
 
Creating a Reusable Drupal Website for Higher Education - Webinar
Creating a Reusable Drupal Website for Higher Education - WebinarCreating a Reusable Drupal Website for Higher Education - Webinar
Creating a Reusable Drupal Website for Higher Education - WebinarSuzanne Dergacheva
 
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon Dublin
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon DublinCreating Layouts and Landing Pages for Drupal 8 - DrupalCon Dublin
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon DublinSuzanne Dergacheva
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themesrfair404
 
WordPress Theme Workshop: Part 2
WordPress Theme Workshop: Part 2WordPress Theme Workshop: Part 2
WordPress Theme Workshop: Part 2David Bisset
 
Turbo charged WordPress theme development - WordCamp Edinburgh 2012
Turbo charged WordPress theme development - WordCamp Edinburgh 2012Turbo charged WordPress theme development - WordCamp Edinburgh 2012
Turbo charged WordPress theme development - WordCamp Edinburgh 2012Jonny Allbut
 
WordPress Template hierarchy
WordPress Template hierarchyWordPress Template hierarchy
WordPress Template hierarchyJason Yingling
 
WordPress Template Hierarchy
WordPress Template HierarchyWordPress Template Hierarchy
WordPress Template HierarchySarah Whinnem
 
How to get your theme in WordPress
How to get your theme in WordPressHow to get your theme in WordPress
How to get your theme in WordPressNisha Singh
 
10 Steps Not To Forget After Installing Drupal
10 Steps Not To Forget After Installing Drupal 10 Steps Not To Forget After Installing Drupal
10 Steps Not To Forget After Installing Drupal Cory Gilliam
 
YAG - Yet Another Gallery / T3CON11
YAG - Yet Another Gallery / T3CON11YAG - Yet Another Gallery / T3CON11
YAG - Yet Another Gallery / T3CON11Daniel Lienert
 
YAG - Yet Another Gallery
YAG - Yet Another GalleryYAG - Yet Another Gallery
YAG - Yet Another GalleryDaniel Lienert
 
flickr's architecture & php
flickr's architecture & php flickr's architecture & php
flickr's architecture & php coolpics
 
EECI 2010 - The Power of ExpressionEngine's Dynamic Templates
EECI 2010 - The Power of ExpressionEngine's Dynamic TemplatesEECI 2010 - The Power of ExpressionEngine's Dynamic Templates
EECI 2010 - The Power of ExpressionEngine's Dynamic TemplatesFortySeven Media
 
Drupal 8 introduction to theming
Drupal 8  introduction to themingDrupal 8  introduction to theming
Drupal 8 introduction to themingBrahampal Singh
 

What's hot (20)

Drupal 8 theming
Drupal 8 themingDrupal 8 theming
Drupal 8 theming
 
Minimalist Theming: How to Build a Lean, Mean Drupal 8 Theme
Minimalist Theming: How to Build a Lean, Mean Drupal 8 ThemeMinimalist Theming: How to Build a Lean, Mean Drupal 8 Theme
Minimalist Theming: How to Build a Lean, Mean Drupal 8 Theme
 
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon Baltimore
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon BaltimoreCreating Landing Pages and Layouts for Drupal 8 - DrupalCon Baltimore
Creating Landing Pages and Layouts for Drupal 8 - DrupalCon Baltimore
 
Creating Web Templates for SharePoint 2010
Creating Web Templates for SharePoint 2010Creating Web Templates for SharePoint 2010
Creating Web Templates for SharePoint 2010
 
Creating a Reusable Drupal Website for Higher Education - at USG Tech Day
Creating a Reusable Drupal Website for Higher Education - at USG Tech DayCreating a Reusable Drupal Website for Higher Education - at USG Tech Day
Creating a Reusable Drupal Website for Higher Education - at USG Tech Day
 
Creating a Reusable Drupal Website for Higher Education - Webinar
Creating a Reusable Drupal Website for Higher Education - WebinarCreating a Reusable Drupal Website for Higher Education - Webinar
Creating a Reusable Drupal Website for Higher Education - Webinar
 
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon Dublin
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon DublinCreating Layouts and Landing Pages for Drupal 8 - DrupalCon Dublin
Creating Layouts and Landing Pages for Drupal 8 - DrupalCon Dublin
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
A Custom Drupal Theme in 40 Minutes
A Custom Drupal Theme in 40 MinutesA Custom Drupal Theme in 40 Minutes
A Custom Drupal Theme in 40 Minutes
 
WordPress Theme Workshop: Part 2
WordPress Theme Workshop: Part 2WordPress Theme Workshop: Part 2
WordPress Theme Workshop: Part 2
 
Turbo charged WordPress theme development - WordCamp Edinburgh 2012
Turbo charged WordPress theme development - WordCamp Edinburgh 2012Turbo charged WordPress theme development - WordCamp Edinburgh 2012
Turbo charged WordPress theme development - WordCamp Edinburgh 2012
 
WordPress Template hierarchy
WordPress Template hierarchyWordPress Template hierarchy
WordPress Template hierarchy
 
WordPress Template Hierarchy
WordPress Template HierarchyWordPress Template Hierarchy
WordPress Template Hierarchy
 
How to get your theme in WordPress
How to get your theme in WordPressHow to get your theme in WordPress
How to get your theme in WordPress
 
10 Steps Not To Forget After Installing Drupal
10 Steps Not To Forget After Installing Drupal 10 Steps Not To Forget After Installing Drupal
10 Steps Not To Forget After Installing Drupal
 
YAG - Yet Another Gallery / T3CON11
YAG - Yet Another Gallery / T3CON11YAG - Yet Another Gallery / T3CON11
YAG - Yet Another Gallery / T3CON11
 
YAG - Yet Another Gallery
YAG - Yet Another GalleryYAG - Yet Another Gallery
YAG - Yet Another Gallery
 
flickr's architecture & php
flickr's architecture & php flickr's architecture & php
flickr's architecture & php
 
EECI 2010 - The Power of ExpressionEngine's Dynamic Templates
EECI 2010 - The Power of ExpressionEngine's Dynamic TemplatesEECI 2010 - The Power of ExpressionEngine's Dynamic Templates
EECI 2010 - The Power of ExpressionEngine's Dynamic Templates
 
Drupal 8 introduction to theming
Drupal 8  introduction to themingDrupal 8  introduction to theming
Drupal 8 introduction to theming
 

Similar to Writing a WordPress Theme - HighEdWeb 2013 #WRK2

Wordpress theme development
Wordpress theme developmentWordpress theme development
Wordpress theme developmentNaeem Junejo
 
Theming in WordPress - Where do I Start?
Theming in WordPress - Where do I Start?Theming in WordPress - Where do I Start?
Theming in WordPress - Where do I Start?Edmund Turbin
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017Amanda Giles
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme EnlightenmentAmanda Giles
 
Theming moodle technical
Theming moodle   technicalTheming moodle   technical
Theming moodle technicalAlex Walker
 
Intro to WordPress theme development
Intro to WordPress theme developmentIntro to WordPress theme development
Intro to WordPress theme developmentThad Allender
 
Basic word press development
Basic word press developmentBasic word press development
Basic word press developmentDavid Wolfpaw
 
Anatomy of a Wordpress theme
Anatomy of a Wordpress themeAnatomy of a Wordpress theme
Anatomy of a Wordpress themeDave Wallace
 
Intro to WordPress Child Themes (NERDS Sept 2014)
Intro to WordPress Child Themes (NERDS Sept 2014)Intro to WordPress Child Themes (NERDS Sept 2014)
Intro to WordPress Child Themes (NERDS Sept 2014)Kelly Dwan
 
WCLV - Introduction to child themes
WCLV - Introduction to child themesWCLV - Introduction to child themes
WCLV - Introduction to child themesvegasgeek
 
The WordPress University
The WordPress UniversityThe WordPress University
The WordPress UniversityStephanie Leary
 
full-site-editing-theme-presentation.pptx
full-site-editing-theme-presentation.pptxfull-site-editing-theme-presentation.pptx
full-site-editing-theme-presentation.pptxPlasterdog Web Design
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themesopenchamp
 
Keeping Your Themes and Plugins Organized.
Keeping Your Themes and Plugins Organized.Keeping Your Themes and Plugins Organized.
Keeping Your Themes and Plugins Organized.Jacob Martella
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Themecertainstrings
 
Drupal theming - a practical approach (European Drupal Days 2015)
Drupal theming - a practical approach (European Drupal Days 2015)Drupal theming - a practical approach (European Drupal Days 2015)
Drupal theming - a practical approach (European Drupal Days 2015)Eugenio Minardi
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Themecertainstrings
 
WordPress Themes and Plugins
WordPress Themes and PluginsWordPress Themes and Plugins
WordPress Themes and Pluginssuperann
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingJamie Schmid
 

Similar to Writing a WordPress Theme - HighEdWeb 2013 #WRK2 (20)

Wordpress theme development
Wordpress theme developmentWordpress theme development
Wordpress theme development
 
Theming in WordPress - Where do I Start?
Theming in WordPress - Where do I Start?Theming in WordPress - Where do I Start?
Theming in WordPress - Where do I Start?
 
The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017The Way to Theme Enlightenment 2017
The Way to Theme Enlightenment 2017
 
The Way to Theme Enlightenment
The Way to Theme EnlightenmentThe Way to Theme Enlightenment
The Way to Theme Enlightenment
 
Theming moodle technical
Theming moodle   technicalTheming moodle   technical
Theming moodle technical
 
Intro to WordPress theme development
Intro to WordPress theme developmentIntro to WordPress theme development
Intro to WordPress theme development
 
Basic word press development
Basic word press developmentBasic word press development
Basic word press development
 
Anatomy of a Wordpress theme
Anatomy of a Wordpress themeAnatomy of a Wordpress theme
Anatomy of a Wordpress theme
 
Intro to WordPress Child Themes (NERDS Sept 2014)
Intro to WordPress Child Themes (NERDS Sept 2014)Intro to WordPress Child Themes (NERDS Sept 2014)
Intro to WordPress Child Themes (NERDS Sept 2014)
 
WCLV - Introduction to child themes
WCLV - Introduction to child themesWCLV - Introduction to child themes
WCLV - Introduction to child themes
 
The WordPress University
The WordPress UniversityThe WordPress University
The WordPress University
 
full-site-editing-theme-presentation.pptx
full-site-editing-theme-presentation.pptxfull-site-editing-theme-presentation.pptx
full-site-editing-theme-presentation.pptx
 
Wordpress overview
Wordpress overviewWordpress overview
Wordpress overview
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
Keeping Your Themes and Plugins Organized.
Keeping Your Themes and Plugins Organized.Keeping Your Themes and Plugins Organized.
Keeping Your Themes and Plugins Organized.
 
Builing a WordPress Theme
Builing a WordPress ThemeBuiling a WordPress Theme
Builing a WordPress Theme
 
Drupal theming - a practical approach (European Drupal Days 2015)
Drupal theming - a practical approach (European Drupal Days 2015)Drupal theming - a practical approach (European Drupal Days 2015)
Drupal theming - a practical approach (European Drupal Days 2015)
 
Arizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress ThemeArizona WP - Building a WordPress Theme
Arizona WP - Building a WordPress Theme
 
WordPress Themes and Plugins
WordPress Themes and PluginsWordPress Themes and Plugins
WordPress Themes and Plugins
 
Introduction to Custom WordPress Themeing
Introduction to Custom WordPress ThemeingIntroduction to Custom WordPress Themeing
Introduction to Custom WordPress Themeing
 

More from Curtiss Grymala

Writing a WordPress Plugin: #heweb12
Writing a WordPress Plugin: #heweb12Writing a WordPress Plugin: #heweb12
Writing a WordPress Plugin: #heweb12Curtiss Grymala
 
10 Minute WordPress Shortcode
10 Minute WordPress Shortcode10 Minute WordPress Shortcode
10 Minute WordPress ShortcodeCurtiss Grymala
 
Writing a WordPress Plugin
Writing a WordPress PluginWriting a WordPress Plugin
Writing a WordPress PluginCurtiss Grymala
 
WordPress Coding Standards
WordPress Coding StandardsWordPress Coding Standards
WordPress Coding StandardsCurtiss Grymala
 

More from Curtiss Grymala (8)

WordPress as a CMS
WordPress as a CMSWordPress as a CMS
WordPress as a CMS
 
WordPress in HigherEd
WordPress in HigherEdWordPress in HigherEd
WordPress in HigherEd
 
Umw WordPress Primer
Umw WordPress PrimerUmw WordPress Primer
Umw WordPress Primer
 
Writing a WordPress Plugin: #heweb12
Writing a WordPress Plugin: #heweb12Writing a WordPress Plugin: #heweb12
Writing a WordPress Plugin: #heweb12
 
10 Minute WordPress Shortcode
10 Minute WordPress Shortcode10 Minute WordPress Shortcode
10 Minute WordPress Shortcode
 
Writing a WordPress Plugin
Writing a WordPress PluginWriting a WordPress Plugin
Writing a WordPress Plugin
 
WordPress Coding Standards
WordPress Coding StandardsWordPress Coding Standards
WordPress Coding Standards
 
WordPress Multi-Network
WordPress Multi-NetworkWordPress Multi-Network
WordPress Multi-Network
 

Recently uploaded

COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaborationbruanjhuli
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
100+ ChatGPT Prompts for SEO Optimization
100+ ChatGPT Prompts for SEO Optimization100+ ChatGPT Prompts for SEO Optimization
100+ ChatGPT Prompts for SEO Optimizationarrow10202532yuvraj
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxMatsuo Lab
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1DianaGray10
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
The Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementThe Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementNuwan Dias
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAshyamraj55
 
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...Daniel Zivkovic
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioChristian Posta
 
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostKubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostMatt Ray
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXTarek Kalaji
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8DianaGray10
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Will Schroeder
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintMahmoud Rabie
 

Recently uploaded (20)

COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online CollaborationCOMPUTER 10: Lesson 7 - File Storage and Online Collaboration
COMPUTER 10: Lesson 7 - File Storage and Online Collaboration
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
201610817 - edge part1
201610817 - edge part1201610817 - edge part1
201610817 - edge part1
 
100+ ChatGPT Prompts for SEO Optimization
100+ ChatGPT Prompts for SEO Optimization100+ ChatGPT Prompts for SEO Optimization
100+ ChatGPT Prompts for SEO Optimization
 
Introduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptxIntroduction to Matsuo Laboratory (ENG).pptx
Introduction to Matsuo Laboratory (ENG).pptx
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1UiPath Platform: The Backend Engine Powering Your Automation - Session 1
UiPath Platform: The Backend Engine Powering Your Automation - Session 1
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
The Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API ManagementThe Kubernetes Gateway API and its role in Cloud Native API Management
The Kubernetes Gateway API and its role in Cloud Native API Management
 
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPAAnypoint Code Builder , Google Pub sub connector and MuleSoft RPA
Anypoint Code Builder , Google Pub sub connector and MuleSoft RPA
 
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
All in AI: LLM Landscape & RAG in 2024 with Mark Ryan (Google) & Jerry Liu (L...
 
Comparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and IstioComparing Sidecar-less Service Mesh from Cilium and Istio
Comparing Sidecar-less Service Mesh from Cilium and Istio
 
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCostKubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
KubeConEU24-Monitoring Kubernetes and Cloud Spend with OpenCost
 
VoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBXVoIP Service and Marketing using Odoo and Asterisk PBX
VoIP Service and Marketing using Odoo and Asterisk PBX
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 
UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8UiPath Studio Web workshop series - Day 8
UiPath Studio Web workshop series - Day 8
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
Apres-Cyber - The Data Dilemma: Bridging Offensive Operations and Machine Lea...
 
Empowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership BlueprintEmpowering Africa's Next Generation: The AI Leadership Blueprint
Empowering Africa's Next Generation: The AI Leadership Blueprint
 

Writing a WordPress Theme - HighEdWeb 2013 #WRK2

  • 4. FRAMEWORKS, PARENTS & CHILDREN • Parent Theme • A base theme that sets up functionality • Can be extended • Must be written to allow overrides • Child Theme • Extends a parent theme • Can carry over or override elements from parent • Cannot be extended without plugins • Framework • Not a full theme; more of a plugin for a theme • Allows creation of parent and child themes with shared functionality http://justintadlock.com/archives/2010/08/16/frameworks-parent-child-and-grandchild-themes
  • 5. EXAMPLES Hybrid Core is a framework. - http://themehybrid.com/hybrid-core • No theme structure • Full package goes inside parent theme Genesis “Framework” is a parent theme - http://www.studiopress.com/features • Has a theme structure • Can be used on its own • Does not go inside of another theme TwentyTwelve is a parent theme - http://wordpress.org/extend/themes/twentytwelve • Although it has less of a framework built in, same concept as Genesis “Education” is a child theme - http://my.studiopress.com/themes/education/ • Cannot be used without Genesis (parent theme) installed
  • 7. REQUIRED FILES CSS Stylesheet (style.css)* • Implements the CSS for the theme • Not included by default • enqueue it in functions.php or • use <link href=“<?php bloginfo( „stylesheet_uri‟ ) ?>”/> in <head> • Provides base information about the theme • Theme name, URI, version, license, etc. (http://codex.wordpress.org/Theme_Development#Theme_Stylesheet) Index (index.php) • Implements the structure of the theme • Can be split out into multiple files • Acts as fallback for all pages** * - style.css is the only file required in a child theme; all others fallback to parent theme ** - the Template Hierarchy governs which files are used for each page; index is the final fallback
  • 8. TYPICAL THEME FILES Theme Functions (functions.php) • Central location for function, variable, constant defintions used in theme • Included automatically by theme engine before after_setup_theme action Default Sidebar (sidebar.php) • Outputs default sidebar (get_sidebar()) Default WordPress Loop (loop.php) • Not included automatically by theme • Used to separate “the loop”*** from other structure Comments Template (comments.php) • List of comments and comment form; use comments_template() to include Search (search.php) • Search results template; automatically used on search results page
  • 9. MOAR THEME FILES Automatic Template Files (page.php, 404.php, single.php) • Used automatically based on type of page being shown; • Overrides index.php (see the Template Hierarchy) Miscellaneous Files (sidebar-[slug].php, etc.) • Include with the get_template_part( „sidebar‟, „[slug]‟ ) function • Sidebar, header and footer files can be included with: • get_sidebar( ‘[slug]’ ) • get_header( ‘[slug]’ ) • get_footer( ‘[slug]’ ) Header and Footer (header.php, footer.php) • Not included automatically • Call with get_header() & get_footer()
  • 11. THE WORDPRESS TEMPLATE HIERARCHY WordPress automatically searches for appropriate theme template file
  • 13. WHAT IS “THE LOOP”? The Loop outputs the main content area • Loops through all matching content objects if ( have_posts() ) : while ( have_posts() ) : the_post(); // Output all of your content endwhile; endif; have_posts() and the_post() • Global methods of main query object ($wp_query) • have_posts() generates array of “post” objects • the_post() sets global variables related to current post object
  • 14. OTHER “LOOP” FUNCTIONS Inside the loop, various functions are available • the_title() – echoes the title of the current post • the_content() – echoes the body of the current post • the_post_thumbnail() – echoes the “featured image” for current post
  • 15. MOAR LOOP TIPS If you need to use the same query loop more than once: • Use rewind_posts() to reset the loop to be used again You can start your own loop with a custom query: $myquery = new WP_Query( ‘[query parameters go here]’ ); if ( $myquery->have_posts() ) : while ( $myquery- >have_posts() ) : $myquery->the_post(); // Your custom loop stuff here endwhile; endif; • Don’t alter the global $wp_query or use query_posts() unless you know what you’re doing • Use get_posts() or create your own loop, instead
  • 18. STEP 1: DESIGN • Identify goals • Wireframe and design • Layout priorities • Final template design • Initial HTML layout
  • 19. STEP 2: DIVIDE AND CONQUER • Identify layout elements • Identify content elements • Identify visual decoration • Determine common elements • Identify alternative layouts
  • 20. STEP 3: DEVELOP • Begin developing basic layout • Separate layout elements from content elements • Replace content elements with placeholders • Create layout structure and style • Develop content containers (body, widgets, footer, header, etc.) • Develop custom functionality
  • 22. LET’S DO THIS THING Examine Theme Design – http://2013.highedweb.org/ Identify Theme Elements Create required files style.css - http://j.mp/153SWWv index.php – wp_head() & wp_footer() - http://j.mp/153Tagt functions.php (not required, but recommended)
  • 23. QUESTIONS? COMMENTS? Twitter: @cgrymala Website(s): http://umw.edu/ (Multi-Network Setup) http://ten-321.com/ http://svn.ten-321.com/ (SVN Repo) http://wphighed.org/ (WP resources for Higher Ed) Email: cgrymala@umw.edu curtiss@ten-321.com SpeakerRate: http://spkr8.com/s/10608 http://about.me/cgrymala