SlideShare une entreprise Scribd logo
1  sur  33
KEEPYOUR CODE
ORGANIZED!
Templates, functions.php and custom plugins
http://jeremyclarke.org • @jeremyclarke
Download these slides:
http://slideshare.net/jeremyclarke
Creative Commons Share Alike
http://creativecommons.org/licenses/by-sa/3.0/
WHO IS JEREMY CLARKE?
• Communications Studies at Concordia
University.
• HTML+CSS since 2003
• Montreal WordPress Organizer
• Code & Design for GlobalVoices
GUIDING PRINCIPLES
• DRY: Don’t repeat yourself.
• Build APIs and use them.
• Code for the general case, use configuration for the specifics.
• Assume every feature will be disabled some day.
OUTLINE
• Themes and template hierarchy
• Functions.php is for theme programming
• Custom plugins are for site programming
• Build APIs for yourself
• Other vital practices
WHAT’S ATHEME?
• A directory full of files.
• Style.css (metadata+style) and editor-
style.css (forTinyMCE style)
• Templates for site sections and
template parts for components.
• functions.php for complex or site wide
code.
TEMPLATE HIERARCHY
• index.php is default for all screens.
• If a more specific template exists (search.php) it is used.
• Very specific templates are possible to micro-manage
sections.
• Using fewer templates is a virtue.
TEMPLATE HIERARCHY
Full hypertext hierarchy: http://wphierarchy.com
TEMPLATE DUPLICATION
• archive.php > category.php + tag.php + date.php
• category.php > category-2.php + category-3.php
• Template specificity duplicates HTML/PHP and adds
work and bugs later if you change things. (DRY!)
• Avoid specific templates whenever possible.
• Use conditionals ( is_*) or display functions to manage
the differences instead.
USING CONDITIONALS
• Specific templates contain much redundant HTML:
author.php category.php
• is_*() conditionals remove the need for duplication!
archive.php
http://codex.wordpress.org/Conditional_Tags
FUNCTIONS.PHP
• Intended to store functions used in the theme.
• Can contain any plugin code (PHP) you want loaded
along with the theme.
• De-activated along with its theme.
• Updated and changes lost when theme is updated.
• Child themes allow a second functions.php outside
main one.
FUNCTIONS.PHP USES
• PHP functions that encapsulate HTML re-used in
multiple templates (DRY!)
• Use of core or plugin APIs to activate features the
theme depends on (featured images, taxonomies).
• Hooks to alter core or plugin output to suit the theme
(excerpt length, unregister plugin widget).
• Custom configuration for this particular site (esp. child
theme functions.php).
PARENT AND CHILDTHEMES
• Child theme needs only a style.css file. Can include()
parent CSS so that only overrides are needed.
• Other templates imported from parent unless present
in child theme.
• Child theme’s functions.php loaded before and in
addition to parent’s functions.php.
• Updating parent won’t break changes in child theme
files.
http://codex.wordpress.org/Child_Themes
CUSTOM PLUGINS
• I.e. site-specific rather than
generally-useful plugins.
• Only need one file with
special header format.
• Persist regardless of active
theme.
• Can be disabled without
switching theme. Example custom plugin that filters the
excerpt length
CUSTOM PLUGIN USES
• Features needed by the site, regardless of active
theme (widgets, shortcodes, CPT)
• Features you might want to disable while keeping the
same theme.
• Any complex feature that would overwhelm
functions.php
• functions.php code if you use a 3rd party theme and
can’t use a child theme.
“MU-PLUGINS”:WTF
• “mu” is backronym for “must-use”.
• Any plugin in /wp-content/mu-plugins/ will always be
loaded and can’t be disabled by users.
• mu-plugin files are loaded before any other plugins.
• Plugins cannot be inside a folder. Most plugins do not
function well as mu-plugins.
• Use for server-scope configuration or fixes needed for
all themes & plugins.
• Also to modify other plugins by running code first.
LEARNTHE WORDPRESS API
• Actions/filters already exist throughout WordPress.
• “hook” in to run your code at a specific time (actions) or alter
output of internal functions (filters).
• Constants (WP_SITEURL) also used as a simple API for key
configuration, works in wp-config.php
• Learn the patterns used by WP and replicate them in your
code.
http://codex.wordpress.org/Plugin_API
WRITEYOUR OWN API
• Code theme features outside your templates with sensible
default behavior (on/off by default).
• Use action/filter hooks or constants to enable and configure
the feature in functions.php
• Faster to code because no user interface is needed.
• Allows configuration to be stored as code in version control,
rather than database.
• Makes your plugins and themes much more re-usable.
CONSTANT-BASED API
Add check for constant in your theme/plugin code
Define the constant in wp-config.php or functions.php
to alter the default behavior.
FILTER-BASED API
Plugin determines default value, but filters it so theme
can override if necessary.
In functions.php filter the value for the needs of this
particular site.
ACTION-BASED API
Add action hooks to key positions in your templates
or plugin output.
Use functions.php (child theme) or plugin to output
site-specific content in that location.
QUESTIONSTO ASKYOURSELF
• Where could this code or feature be stored?
• Which places are out of my control (3rd party themes
+plugins)
• What if I want to change themes?
• What if I want to disable the feature?
• Will the configuration be stored in database or version
control?
OTHER BEST PRACTICES
USEVERSION CONTROL (GIT)
• Version control is not optional.
• At minimum track your plugins and themes.
http://git-scm.com/book
OBJECT ORIENTATION
• Learn to write “OO”/object-oriented PHP if you aren’t
already.
• Encapsulate features as objects.
• Use wrapper functions that can be used in
functions.php to activate object-based features for a
theme.
DOCUMENTYOUR CODE
• Every function needs a
PHPDoc definition, non-
obvious PHP logic should
have inline comments.
• Writing comments forces you
to organize.
• Use an IDE (like NetBeans)
that exposes documentation
for text prediction.
http://codex.wordpress.org/
Inline_Documentation
CSS PREPROCESSORS
• Sass gives CSS the programmability of PHP with
equivalents of variables and functions.
• Gives access to libraries of useful CSS like Compass,
Foundation and others.
• Very powerful but adds steps and complexity to your dev
process.
http://sass-lang.com/
See also: My DRY CSS philosophy for organizing normal CSS:
http://simianuprising.com/2012/03/07/video-of-my-dry-css-talk/
WIDGETIZE EVERYTHING
• Never hard-code content in a theme.
• All promo text or non-permanent features should be in
widget areas (sidebars).
• Allows users to alter content without editing theme.
• Add widget areas all over site in case you need
something there.
• Register custom widgets to display complex content
rather than using template tags.
http://codex.wordpress.org/Widgets_API
USE SHORTCODES
• Avoid custom page templates by using shortcodes
instead.
• Easy to code especially as wrappers for existing
display functions.
http://codex.wordpress.org/Shortcode_API
WP_PARSE_ARGS()
• Allows one function argument to contain infinite values/
overrides.
• Used throughout WP core to great effect.
http://codex.wordpress.org/Function_Reference/wp_parse_args
BEFORE / AFTER / ECHO
• Another useful pattern from WP core. Make it part of all
display functions.
• ‘before’ and ‘after’ allow wrapper HTML that is hidden if there
is no output.
• ‘echo’ allows output to be returned instead of printed to
screen (vital for shortcodes).
USE ALLTHE APIS
• Settings API: Quickly build standard WP option screens.
Complicated but worthwhile.
• Theme Customization API:Allow users to quickly
preview setting changes to your theme.
• Custom Metadata Manager (plugin): Register post
editor metaboxes with a few lines of code.
http://codex.wordpress.org/Settings_API
https://codex.wordpress.org/Theme_Customization_API
http://wordpress.org/plugins/custom-metadata/
POP QUIZ:
WHERE DOES IT GO?
• Sidebar registration
• Widget registration
• Shortcode registration
• Custom post type registration
• Image slider gallery PHP/JS
• Featured image size registration
KEEPYOUR CODE
ORGANIZED!
Templates, functions.php and custom plugins
http://jeremyclarke.org • @jeremyclarke
Download these slides:
http://slideshare.net/jeremyclarke
Creative Commons Share Alike
http://creativecommons.org/licenses/by-sa/3.0/

Contenu connexe

Tendances

Search Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginnersSearch Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginners
Up2 Technology
 

Tendances (18)

Submitting to the WordPress Theme Directory
Submitting to the WordPress Theme DirectorySubmitting to the WordPress Theme Directory
Submitting to the WordPress Theme Directory
 
Rapid application development for WordPress using AWF
Rapid application development for WordPress using AWFRapid application development for WordPress using AWF
Rapid application development for WordPress using AWF
 
WordPress plugins
WordPress pluginsWordPress plugins
WordPress plugins
 
WordPress Theme Structure
WordPress Theme StructureWordPress Theme Structure
WordPress Theme Structure
 
Add-On Development: EE Expects that Every Developer will do his Duty
Add-On Development: EE Expects that Every Developer will do his DutyAdd-On Development: EE Expects that Every Developer will do his Duty
Add-On Development: EE Expects that Every Developer will do his Duty
 
AEM Asset and Tag API
AEM Asset and Tag APIAEM Asset and Tag API
AEM Asset and Tag API
 
State of play for Joomla - Nov 2014
State of play for Joomla - Nov 2014State of play for Joomla - Nov 2014
State of play for Joomla - Nov 2014
 
WordPress - fixing sites with problems
WordPress - fixing sites with problemsWordPress - fixing sites with problems
WordPress - fixing sites with problems
 
11 Live Node.js CMS Frameworks
11 Live Node.js CMS Frameworks11 Live Node.js CMS Frameworks
11 Live Node.js CMS Frameworks
 
Search Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginnersSearch Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginners
 
WordCamp Kent 2019 - WP 101: Local Development - Themes and Plugins
WordCamp Kent 2019 - WP 101: Local Development - Themes and PluginsWordCamp Kent 2019 - WP 101: Local Development - Themes and Plugins
WordCamp Kent 2019 - WP 101: Local Development - Themes and Plugins
 
O365Con18 - Using ARM Templates to Deploy Solutions on Azure - Kevin Timmermann
O365Con18 - Using ARM Templates to Deploy Solutions on Azure - Kevin TimmermannO365Con18 - Using ARM Templates to Deploy Solutions on Azure - Kevin Timmermann
O365Con18 - Using ARM Templates to Deploy Solutions on Azure - Kevin Timmermann
 
Drupal Site Building for Developers
Drupal Site Building for DevelopersDrupal Site Building for Developers
Drupal Site Building for Developers
 
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
Joomla! multiplied - How to run Multi-Sites - JandBeyond 2014
 
Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015Responsive Theme Workshop - WordCamp Columbus 2015
Responsive Theme Workshop - WordCamp Columbus 2015
 
Introduction to Alfresco Surf Platform
Introduction to Alfresco Surf PlatformIntroduction to Alfresco Surf Platform
Introduction to Alfresco Surf Platform
 
Welcome to the World of WordPress
Welcome to the World of WordPressWelcome to the World of WordPress
Welcome to the World of WordPress
 
Joomla! theming
Joomla! themingJoomla! theming
Joomla! theming
 

Similaire à Keep Your Code Organized! WordCamp Montreal 2013 Presentation slides

The WordPress University
The WordPress UniversityThe WordPress University
The WordPress University
Stephanie Leary
 
Theme development essentials columbus oh word camp 2012
Theme development essentials   columbus oh word camp 2012Theme development essentials   columbus oh word camp 2012
Theme development essentials columbus oh word camp 2012
Joe Querin
 
Pluggable patterns
Pluggable patternsPluggable patterns
Pluggable patterns
Corey Oordt
 

Similaire à Keep Your Code Organized! WordCamp Montreal 2013 Presentation slides (20)

Miami2015
Miami2015Miami2015
Miami2015
 
WordPress Themes and Plugins
WordPress Themes and PluginsWordPress Themes and Plugins
WordPress Themes and Plugins
 
The WordPress University
The WordPress UniversityThe WordPress University
The WordPress University
 
presentation
presentationpresentation
presentation
 
Wordpress theme development
Wordpress theme developmentWordpress theme development
Wordpress theme development
 
Intro to html5 Boilerplate
Intro to html5 BoilerplateIntro to html5 Boilerplate
Intro to html5 Boilerplate
 
presentation
presentationpresentation
presentation
 
Add-On Development: EE Expects that Every Developer will do his Duty
Add-On Development: EE Expects that Every Developer will do his DutyAdd-On Development: EE Expects that Every Developer will do his Duty
Add-On Development: EE Expects that Every Developer will do his Duty
 
Wordpress beyond blogging
Wordpress beyond bloggingWordpress beyond blogging
Wordpress beyond blogging
 
BP-9 Share Customization Best Practices
BP-9 Share Customization Best PracticesBP-9 Share Customization Best Practices
BP-9 Share Customization Best Practices
 
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdfITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
ITB_2023_Extend_your_contentbox_apps_with_custom_modules_Javier_Quintero.pdf
 
Theme development essentials columbus oh word camp 2012
Theme development essentials   columbus oh word camp 2012Theme development essentials   columbus oh word camp 2012
Theme development essentials columbus oh word camp 2012
 
Best Practices for Building WordPress Applications
Best Practices for Building WordPress ApplicationsBest Practices for Building WordPress Applications
Best Practices for Building WordPress Applications
 
Child Themes and CSS in WordPress
Child Themes and CSS in WordPressChild Themes and CSS in WordPress
Child Themes and CSS in WordPress
 
Wordpress overview
Wordpress overviewWordpress overview
Wordpress overview
 
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
 
Strategies and Tips for Building Enterprise Drupal Applications - PNWDS 2013
Strategies and Tips for Building Enterprise Drupal Applications - PNWDS 2013Strategies and Tips for Building Enterprise Drupal Applications - PNWDS 2013
Strategies and Tips for Building Enterprise Drupal Applications - PNWDS 2013
 
Responsive themeworkshop wcneo2016
Responsive themeworkshop wcneo2016Responsive themeworkshop wcneo2016
Responsive themeworkshop wcneo2016
 
BP-7 Share Customization Best Practices
BP-7 Share Customization Best PracticesBP-7 Share Customization Best Practices
BP-7 Share Customization Best Practices
 
Pluggable patterns
Pluggable patternsPluggable patterns
Pluggable patterns
 

Plus de Jer Clarke

Global Voices proves Creative Commons is Awesome • CC Salon Montreal
Global Voices proves Creative Commons is Awesome • CC Salon MontrealGlobal Voices proves Creative Commons is Awesome • CC Salon Montreal
Global Voices proves Creative Commons is Awesome • CC Salon Montreal
Jer Clarke
 

Plus de Jer Clarke (11)

globalvoices.org - How our CC license spawned a world class translation commu...
globalvoices.org - How our CC license spawned a world class translation commu...globalvoices.org - How our CC license spawned a world class translation commu...
globalvoices.org - How our CC license spawned a world class translation commu...
 
Put A Map On It! Enhanced geolocation in WordPress with Geo Mashup
Put A Map On It! Enhanced geolocation in WordPress with Geo MashupPut A Map On It! Enhanced geolocation in WordPress with Geo Mashup
Put A Map On It! Enhanced geolocation in WordPress with Geo Mashup
 
WordCamp NYC - DRY CSS
WordCamp NYC - DRY CSSWordCamp NYC - DRY CSS
WordCamp NYC - DRY CSS
 
DRY CSS A don’t-repeat-yourself methodology for creating efficient, unified a...
DRY CSS A don’t-repeat-yourself methodology for creating efficient, unified a...DRY CSS A don’t-repeat-yourself methodology for creating efficient, unified a...
DRY CSS A don’t-repeat-yourself methodology for creating efficient, unified a...
 
Global Voices proves Creative Commons is Awesome • CC Salon Montreal
Global Voices proves Creative Commons is Awesome • CC Salon MontrealGlobal Voices proves Creative Commons is Awesome • CC Salon Montreal
Global Voices proves Creative Commons is Awesome • CC Salon Montreal
 
Widgetize Everything: Building smarter WordPress themes with Widgets and Temp...
Widgetize Everything: Building smarter WordPress themes with Widgets and Temp...Widgetize Everything: Building smarter WordPress themes with Widgets and Temp...
Widgetize Everything: Building smarter WordPress themes with Widgets and Temp...
 
NetBeans, IDEs and faster programming for WordPress - WordCamp NYC 2009
NetBeans, IDEs and faster programming for WordPress - WordCamp NYC 2009NetBeans, IDEs and faster programming for WordPress - WordCamp NYC 2009
NetBeans, IDEs and faster programming for WordPress - WordCamp NYC 2009
 
Caching and Optimization for WordPress
Caching and Optimization for WordPressCaching and Optimization for WordPress
Caching and Optimization for WordPress
 
WordPress Code and Setup Strategies and Advice, WordCamp Toronto '09
WordPress Code and Setup Strategies and Advice, WordCamp Toronto '09WordPress Code and Setup Strategies and Advice, WordCamp Toronto '09
WordPress Code and Setup Strategies and Advice, WordCamp Toronto '09
 
Global Voices Generic Presentation
Global Voices Generic PresentationGlobal Voices Generic Presentation
Global Voices Generic Presentation
 
Global Voices - Democratising the web with Wordpress and Love
Global Voices - Democratising the web with Wordpress and LoveGlobal Voices - Democratising the web with Wordpress and Love
Global Voices - Democratising the web with Wordpress and Love
 

Dernier

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
panagenda
 

Dernier (20)

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
Why Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire businessWhy Teams call analytics are critical to your entire business
Why Teams call analytics are critical to your entire business
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
Apidays New York 2024 - APIs in 2030: The Risk of Technological Sleepwalk by ...
 
[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf[BuildWithAI] Introduction to Gemini.pdf
[BuildWithAI] Introduction to Gemini.pdf
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 

Keep Your Code Organized! WordCamp Montreal 2013 Presentation slides

  • 1. KEEPYOUR CODE ORGANIZED! Templates, functions.php and custom plugins http://jeremyclarke.org • @jeremyclarke Download these slides: http://slideshare.net/jeremyclarke Creative Commons Share Alike http://creativecommons.org/licenses/by-sa/3.0/
  • 2. WHO IS JEREMY CLARKE? • Communications Studies at Concordia University. • HTML+CSS since 2003 • Montreal WordPress Organizer • Code & Design for GlobalVoices
  • 3. GUIDING PRINCIPLES • DRY: Don’t repeat yourself. • Build APIs and use them. • Code for the general case, use configuration for the specifics. • Assume every feature will be disabled some day.
  • 4. OUTLINE • Themes and template hierarchy • Functions.php is for theme programming • Custom plugins are for site programming • Build APIs for yourself • Other vital practices
  • 5. WHAT’S ATHEME? • A directory full of files. • Style.css (metadata+style) and editor- style.css (forTinyMCE style) • Templates for site sections and template parts for components. • functions.php for complex or site wide code.
  • 6. TEMPLATE HIERARCHY • index.php is default for all screens. • If a more specific template exists (search.php) it is used. • Very specific templates are possible to micro-manage sections. • Using fewer templates is a virtue.
  • 7. TEMPLATE HIERARCHY Full hypertext hierarchy: http://wphierarchy.com
  • 8. TEMPLATE DUPLICATION • archive.php > category.php + tag.php + date.php • category.php > category-2.php + category-3.php • Template specificity duplicates HTML/PHP and adds work and bugs later if you change things. (DRY!) • Avoid specific templates whenever possible. • Use conditionals ( is_*) or display functions to manage the differences instead.
  • 9. USING CONDITIONALS • Specific templates contain much redundant HTML: author.php category.php • is_*() conditionals remove the need for duplication! archive.php http://codex.wordpress.org/Conditional_Tags
  • 10. FUNCTIONS.PHP • Intended to store functions used in the theme. • Can contain any plugin code (PHP) you want loaded along with the theme. • De-activated along with its theme. • Updated and changes lost when theme is updated. • Child themes allow a second functions.php outside main one.
  • 11. FUNCTIONS.PHP USES • PHP functions that encapsulate HTML re-used in multiple templates (DRY!) • Use of core or plugin APIs to activate features the theme depends on (featured images, taxonomies). • Hooks to alter core or plugin output to suit the theme (excerpt length, unregister plugin widget). • Custom configuration for this particular site (esp. child theme functions.php).
  • 12. PARENT AND CHILDTHEMES • Child theme needs only a style.css file. Can include() parent CSS so that only overrides are needed. • Other templates imported from parent unless present in child theme. • Child theme’s functions.php loaded before and in addition to parent’s functions.php. • Updating parent won’t break changes in child theme files. http://codex.wordpress.org/Child_Themes
  • 13. CUSTOM PLUGINS • I.e. site-specific rather than generally-useful plugins. • Only need one file with special header format. • Persist regardless of active theme. • Can be disabled without switching theme. Example custom plugin that filters the excerpt length
  • 14. CUSTOM PLUGIN USES • Features needed by the site, regardless of active theme (widgets, shortcodes, CPT) • Features you might want to disable while keeping the same theme. • Any complex feature that would overwhelm functions.php • functions.php code if you use a 3rd party theme and can’t use a child theme.
  • 15. “MU-PLUGINS”:WTF • “mu” is backronym for “must-use”. • Any plugin in /wp-content/mu-plugins/ will always be loaded and can’t be disabled by users. • mu-plugin files are loaded before any other plugins. • Plugins cannot be inside a folder. Most plugins do not function well as mu-plugins. • Use for server-scope configuration or fixes needed for all themes & plugins. • Also to modify other plugins by running code first.
  • 16. LEARNTHE WORDPRESS API • Actions/filters already exist throughout WordPress. • “hook” in to run your code at a specific time (actions) or alter output of internal functions (filters). • Constants (WP_SITEURL) also used as a simple API for key configuration, works in wp-config.php • Learn the patterns used by WP and replicate them in your code. http://codex.wordpress.org/Plugin_API
  • 17. WRITEYOUR OWN API • Code theme features outside your templates with sensible default behavior (on/off by default). • Use action/filter hooks or constants to enable and configure the feature in functions.php • Faster to code because no user interface is needed. • Allows configuration to be stored as code in version control, rather than database. • Makes your plugins and themes much more re-usable.
  • 18. CONSTANT-BASED API Add check for constant in your theme/plugin code Define the constant in wp-config.php or functions.php to alter the default behavior.
  • 19. FILTER-BASED API Plugin determines default value, but filters it so theme can override if necessary. In functions.php filter the value for the needs of this particular site.
  • 20. ACTION-BASED API Add action hooks to key positions in your templates or plugin output. Use functions.php (child theme) or plugin to output site-specific content in that location.
  • 21. QUESTIONSTO ASKYOURSELF • Where could this code or feature be stored? • Which places are out of my control (3rd party themes +plugins) • What if I want to change themes? • What if I want to disable the feature? • Will the configuration be stored in database or version control?
  • 23. USEVERSION CONTROL (GIT) • Version control is not optional. • At minimum track your plugins and themes. http://git-scm.com/book
  • 24. OBJECT ORIENTATION • Learn to write “OO”/object-oriented PHP if you aren’t already. • Encapsulate features as objects. • Use wrapper functions that can be used in functions.php to activate object-based features for a theme.
  • 25. DOCUMENTYOUR CODE • Every function needs a PHPDoc definition, non- obvious PHP logic should have inline comments. • Writing comments forces you to organize. • Use an IDE (like NetBeans) that exposes documentation for text prediction. http://codex.wordpress.org/ Inline_Documentation
  • 26. CSS PREPROCESSORS • Sass gives CSS the programmability of PHP with equivalents of variables and functions. • Gives access to libraries of useful CSS like Compass, Foundation and others. • Very powerful but adds steps and complexity to your dev process. http://sass-lang.com/ See also: My DRY CSS philosophy for organizing normal CSS: http://simianuprising.com/2012/03/07/video-of-my-dry-css-talk/
  • 27. WIDGETIZE EVERYTHING • Never hard-code content in a theme. • All promo text or non-permanent features should be in widget areas (sidebars). • Allows users to alter content without editing theme. • Add widget areas all over site in case you need something there. • Register custom widgets to display complex content rather than using template tags. http://codex.wordpress.org/Widgets_API
  • 28. USE SHORTCODES • Avoid custom page templates by using shortcodes instead. • Easy to code especially as wrappers for existing display functions. http://codex.wordpress.org/Shortcode_API
  • 29. WP_PARSE_ARGS() • Allows one function argument to contain infinite values/ overrides. • Used throughout WP core to great effect. http://codex.wordpress.org/Function_Reference/wp_parse_args
  • 30. BEFORE / AFTER / ECHO • Another useful pattern from WP core. Make it part of all display functions. • ‘before’ and ‘after’ allow wrapper HTML that is hidden if there is no output. • ‘echo’ allows output to be returned instead of printed to screen (vital for shortcodes).
  • 31. USE ALLTHE APIS • Settings API: Quickly build standard WP option screens. Complicated but worthwhile. • Theme Customization API:Allow users to quickly preview setting changes to your theme. • Custom Metadata Manager (plugin): Register post editor metaboxes with a few lines of code. http://codex.wordpress.org/Settings_API https://codex.wordpress.org/Theme_Customization_API http://wordpress.org/plugins/custom-metadata/
  • 32. POP QUIZ: WHERE DOES IT GO? • Sidebar registration • Widget registration • Shortcode registration • Custom post type registration • Image slider gallery PHP/JS • Featured image size registration
  • 33. KEEPYOUR CODE ORGANIZED! Templates, functions.php and custom plugins http://jeremyclarke.org • @jeremyclarke Download these slides: http://slideshare.net/jeremyclarke Creative Commons Share Alike http://creativecommons.org/licenses/by-sa/3.0/