SlideShare una empresa de Scribd logo
1 de 59
Descargar para leer sin conexión
Developing Custom
Themes for Clients
Steven Slack
freelance Web Developer @ S2 Web

@slacktronic
s2webpress.com
1mundoreal.org

Rio de Janeiro - 2007
#1 rule in creating custom themes for clients:

Caring!
What is custom?
Tailor made
A custom theme is built specifically
to meet the needs of your client’s
business or project.
Planning

icon by Björn Andersson, from The Noun Project
Purpose & Goals
Content
Determining context
Site Architecture
Determine hierarchy of site navigation and structure
Site Architecture
Determine hierarchy of site navigation and structure

custom post types, taxonomies, featured images,
custom fields, sliders, widget areas, theme
options, etc...
Plan out the features
Do you really need to build a
custom theme?
You may need a custom theme if:
●
●
●
●
●
●

●
●

You need to present different types of content in a unique way
You need to present a plugins presentation in a certain way
To Create a Unique look to the WP theme
To take advantage of templates, template tags, and the WordPress Loop
to generate different website results and looks.
To provide alternative templates for specific site features, such as category
pages and search result pages.
To quickly switch between two site layouts, or to take advantage of a
Theme or style switcher to allow site owners to change the look of your
site.
To provide “some” theme options for custom presentation
To take advantage of custom fields and meta data.
Determining Cost
●

How much does it cost? “It depends”

●

Try it out - Scope out a project as best you can, track your hours
to determine cost for future projects

●

“One size fits all” doesn’t apply - different types of themes are
going to have different prices

●

Stay on track - avoid scope creep and put language about
changes and modifications in the contract.
Time to make something!!
Designing the site
● Work off of site architecture / wireframe
● Design Preference - Browser? Photoshop?
● This is only one portion of the design process not a finished product
Development
There are several ways to begin developing custom themes:

1. Child Themes
2. Theme Frameworks
3. Starter themes
Child Themes
“A WordPress child theme is a theme that inherits the
functionality of another theme, called the parent theme.” - Codex
●
●
●

Inherits parent theme functionality
Good for simple theme modifications - add theme support, custom
backgrounds, changing colors, etc…
keep customization separate from parent theme core functionality

●

allow parent themes to be updated without destroying your modifications

●

take advantage of effort and testing put into parent theme

●

save on development time; no need to recreate the wheel

●

are a great way to get started to learn about theme development
Child Theme Considerations
Parent theme may contain tons of features which you do not need
Theme Frameworks
“A ‘drop-in’ code library that is used to facilitate
development of a Theme” - Codex
●

Developers can leverage a framework’s built-in code, options,
plug-ins, and themes from which to develop.

●

Eliminates the need to re-invent the wheel for each project.

●

Decrease time spent developing a theme
A few popular frameworks:
●

Builder

by iThemes

●

Canvas

by WooThemes

●

Genesis

by StudioPress

●

Hybrid Core

by Justin Tadlock

●

Thesis

by DIYThemes

Review of 10 popular frameworks - torquemag.io/review-10-frameworks
Theme Framework Considerations:
●
●
●
●
●

Adds a layer of complexity to WordPress
More to manage, more to update, and a sometimes a bulkier
admin.
Plugin compatibility
Some frameworks charge for support and updates
Unused features and options
Starter Themes
Base themes with all the essential files and
functions required for a WordPress theme but with
minimal to no styles.
A few places to start:
●

Underscores

- underscores.me

●

Roots

- roots.io

●

Bones

- themble.com/bones
Starter theme considerations
Choosing a starter theme to work with is up to your preference and depends on
the way you like to work.
Example: Roots is built with Twitter Bootstrap and uses LESS. Bones is based
on the HTML5 Boilerplate and is ready for LESS or SASS development.
Using a starter theme gives you control over what features you want to add.
The world is at your fingertips.
You will need some time and skills to build a custom theme with a starter theme
Building the custom theme
Theme Options
● Keep them to a minimum, if possible
● Theme options should affect display
not functionality.
● Use the theme customizer
● Use WordPress Options API
Presentation and Functionality
Generally, when we refer to functionality in
WordPress we are speaking of plugins while themes
handle the presentation.
Functions
Avoid the temptation to put A LOT of
functionality in your functions.php file
Create a library with specific functions
Functionality
E-Commerce
Advanced Search
Slider
Directory

Events Calendar
Shortcodes
Portfolio
Front-end Registration
Required Plugins?
How about suggested plugins?
TGM Plugin Activation
The best way to require and recommend plugins for
WordPress themes (and other plugins)
tgmpluginactivation.com
Put extra functions into a plugin.
Data Portability
Organization & Maintenance
Portable Plugin
Easier to debug
Separation of concerns
Wrap plugin functions in conditionals in the theme
<?php // if Advanced Custom Fields function exists and the
field is not empty display the field
if ( function_exists( 'get_field' ) ) {
if( get_field( 'some_custom_field' )
the_field( 'some_custom_field' );
}
}

) {

?>

If the plugin is disabled you will avoid receiving error messages or a blank screen.
Take your
shortcodes
with you

sh

od
ortc

es
What does the business owner get?
A well organized WordPress
environment will have a cost benefit to
the client, business, or individual
A more stable environment will save you time on
debugging, fixing problems or moving data,
hence saving your client money.
Best Practices
Follow WordPress Coding Standards
make.wordpress.org/core/handbook/coding-standards
Debug!
●

Set WP_debug to true in your wp_config.php file.

●

Use developer plugins - wordpress.org/plugins/developer

/**
* For developers: WordPress debugging mode.
*
* Change this to true to enable the display of notices during development.
* It is strongly recommended that plugin and theme developers use WP_DEBUG
* in their development environments.
*/
define('WP_DEBUG', true );
Use the theme check plugin
Performance
●
●
●
●

minimize http requests
minify scripts and styles
reduce image sizes
use sprites in your theme images
Reviewing the theme with
the client
“Can we make this area a scroll area?”
“I want this to be a dropdown box.”
“When you click on this button I want it to go to the contact page.”
“I don’t really understand what all this Lorem Ipsum is?”
“That wasn’t in the mockup.”
“That looked different in the mockup.”
“These aren’t my photos!”
“What are we looking at here? I don’t understand.”
Present the theme to the
client with their content
● Load the clients content into WordPress. Hire
someone if necessary
● Present client site on your test server (staging site)
● If they already have a WP site - export their data
and import it into your development environment
● Disable search engine visibility in Settings =>
Reading
Fine tune the theme
Deploy!
-Take the custom theme
live
● Use an under construction plugin while
prepping the site.
● Upload theme and plugins
● Upload data if needed.
● Configure theme and plugin settings
● Double check everything
Training, Support,
and the Future
Training Resources
●
●
●

Video Tutorials
PDF Guide
WP Beginner

- WP101.com
- WP Easy Guide ( easywpguide.com )
- Beginners guide to WordPress ( wpbeginner.com )
Support ?
● Managed Support - managewp.com
● Case by case bug / improvements
● Managed WordPress maintainence fantasktic.com, wpmaintainer.com,
maintainn.com
Thanks !!
Thoughts? Insights? Questions?

Más contenido relacionado

La actualidad más candente

WordPress Edmonton - Visual Composer
WordPress Edmonton - Visual ComposerWordPress Edmonton - Visual Composer
WordPress Edmonton - Visual ComposerKihya McComb
 
Building DotNetNuke Modules
Building DotNetNuke ModulesBuilding DotNetNuke Modules
Building DotNetNuke ModulesEngage Software
 
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy DewMake SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy DewCathy Dew
 
DNN Web & Module Development Services by Brainvire
DNN Web & Module Development Services by BrainvireDNN Web & Module Development Services by Brainvire
DNN Web & Module Development Services by BrainvireDnnExtension
 
Create Engaging Branded SharePoint Portals and Plan for Content
Create Engaging Branded SharePoint Portals and Plan for ContentCreate Engaging Branded SharePoint Portals and Plan for Content
Create Engaging Branded SharePoint Portals and Plan for ContentCathy Dew
 
Building a Car Sales website with Form2Content
Building a Car Sales website with Form2ContentBuilding a Car Sales website with Form2Content
Building a Car Sales website with Form2ContentRené Kreijveld
 
Spsat nyc19 190621150118
Spsat nyc19 190621150118Spsat nyc19 190621150118
Spsat nyc19 190621150118Peter_1020
 
WordPress - fixing sites with problems
WordPress - fixing sites with problemsWordPress - fixing sites with problems
WordPress - fixing sites with problemsVictoria Pickering
 
Wordpress builder
Wordpress builderWordpress builder
Wordpress builderDimas Bagus
 
What is Drupal? And Why is it Useful? Webinar
What is Drupal? And Why is it Useful? WebinarWhat is Drupal? And Why is it Useful? Webinar
What is Drupal? And Why is it Useful? WebinarSuzanne Dergacheva
 
Introduction to Django CMS
Introduction to Django CMS Introduction to Django CMS
Introduction to Django CMS Pim Van Heuven
 
Component Driven Design and Development
Component Driven Design and DevelopmentComponent Driven Design and Development
Component Driven Design and DevelopmentCristina Chumillas
 
Designing for the Office 365 Experience
Designing for the Office 365 ExperienceDesigning for the Office 365 Experience
Designing for the Office 365 ExperienceCathy Dew
 
Web designing course
Web designing courseWeb designing course
Web designing coursemandeep Singh
 
The Wonderful World of Drupal 8 Multilingual
The Wonderful World of Drupal 8 MultilingualThe Wonderful World of Drupal 8 Multilingual
The Wonderful World of Drupal 8 MultilingualSuzanne Dergacheva
 
SPSVB 1 7-2012 - getting started with share point branding
SPSVB 1 7-2012 - getting started with share point brandingSPSVB 1 7-2012 - getting started with share point branding
SPSVB 1 7-2012 - getting started with share point brandingThomas Daly
 

La actualidad más candente (20)

WordPress Edmonton - Visual Composer
WordPress Edmonton - Visual ComposerWordPress Edmonton - Visual Composer
WordPress Edmonton - Visual Composer
 
DNN Basics
DNN BasicsDNN Basics
DNN Basics
 
Building DotNetNuke Modules
Building DotNetNuke ModulesBuilding DotNetNuke Modules
Building DotNetNuke Modules
 
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy DewMake SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew
Make SharePoint Look Not Like SharePoint - SPSNashville - Cathy Dew
 
Dnn for beginners
Dnn for beginnersDnn for beginners
Dnn for beginners
 
DNN Web & Module Development Services by Brainvire
DNN Web & Module Development Services by BrainvireDNN Web & Module Development Services by Brainvire
DNN Web & Module Development Services by Brainvire
 
Create Engaging Branded SharePoint Portals and Plan for Content
Create Engaging Branded SharePoint Portals and Plan for ContentCreate Engaging Branded SharePoint Portals and Plan for Content
Create Engaging Branded SharePoint Portals and Plan for Content
 
Building a Car Sales website with Form2Content
Building a Car Sales website with Form2ContentBuilding a Car Sales website with Form2Content
Building a Car Sales website with Form2Content
 
Spsat nyc19 190621150118
Spsat nyc19 190621150118Spsat nyc19 190621150118
Spsat nyc19 190621150118
 
Web Designing
Web Designing Web Designing
Web Designing
 
WordPress - fixing sites with problems
WordPress - fixing sites with problemsWordPress - fixing sites with problems
WordPress - fixing sites with problems
 
Wordpress builder
Wordpress builderWordpress builder
Wordpress builder
 
What is Drupal? And Why is it Useful? Webinar
What is Drupal? And Why is it Useful? WebinarWhat is Drupal? And Why is it Useful? Webinar
What is Drupal? And Why is it Useful? Webinar
 
Introduction to Django CMS
Introduction to Django CMS Introduction to Django CMS
Introduction to Django CMS
 
Component Driven Design and Development
Component Driven Design and DevelopmentComponent Driven Design and Development
Component Driven Design and Development
 
Designing for the Office 365 Experience
Designing for the Office 365 ExperienceDesigning for the Office 365 Experience
Designing for the Office 365 Experience
 
Web designing course
Web designing courseWeb designing course
Web designing course
 
The Wonderful World of Drupal 8 Multilingual
The Wonderful World of Drupal 8 MultilingualThe Wonderful World of Drupal 8 Multilingual
The Wonderful World of Drupal 8 Multilingual
 
Xhtml validation
Xhtml validationXhtml validation
Xhtml validation
 
SPSVB 1 7-2012 - getting started with share point branding
SPSVB 1 7-2012 - getting started with share point brandingSPSVB 1 7-2012 - getting started with share point branding
SPSVB 1 7-2012 - getting started with share point branding
 

Similar a Developing Custom WordPress Themes for Clients

Theme customisation for beginners
Theme customisation for beginnersTheme customisation for beginners
Theme customisation for beginnersGareth J Barnard
 
What Developers Need Designers to Know about WordPress
What Developers Need Designers to Know about WordPressWhat Developers Need Designers to Know about WordPress
What Developers Need Designers to Know about WordPressEast Bay WordPress Meetup
 
Implementing a Symfony Based CMS in a Publishing Company
Implementing a Symfony Based CMS in a Publishing CompanyImplementing a Symfony Based CMS in a Publishing Company
Implementing a Symfony Based CMS in a Publishing CompanyMarcos Labad
 
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...Brian O'Gorman
 
Introduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedIntroduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedImran Sayed
 
Beginning WordPress Workshop
Beginning WordPress WorkshopBeginning WordPress Workshop
Beginning WordPress WorkshopThe Toolbox, Inc.
 
SharePoint 2013 Branding
SharePoint 2013 BrandingSharePoint 2013 Branding
SharePoint 2013 BrandingKashif Imran
 
WordPress: After The Install
WordPress: After The InstallWordPress: After The Install
WordPress: After The InstallWordPress NYC
 
Share point 2013 Building Websites
Share point 2013 Building WebsitesShare point 2013 Building Websites
Share point 2013 Building WebsitesSuhas R Satish
 
Drupal 7 Search Engine Optimisation
Drupal 7 Search Engine OptimisationDrupal 7 Search Engine Optimisation
Drupal 7 Search Engine OptimisationPeter Macinkovic
 
Joomla templates2011
Joomla templates2011Joomla templates2011
Joomla templates2011Linda Coonen
 
Creating a Documentation Portal
Creating a Documentation PortalCreating a Documentation Portal
Creating a Documentation PortalSteve Anderson
 
Atlanta Drupal User Group (ADUG)
Atlanta Drupal User Group (ADUG) Atlanta Drupal User Group (ADUG)
Atlanta Drupal User Group (ADUG) Mediacurrent
 
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentWordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentEvan Mullins
 
Speedrun: Build a Website with Panels, Media, and More in 45 Minutes
Speedrun: Build a Website with Panels, Media, and More in 45 MinutesSpeedrun: Build a Website with Panels, Media, and More in 45 Minutes
Speedrun: Build a Website with Panels, Media, and More in 45 MinutesAcquia
 
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts How to build a Project Hub with Hubsites and Sitedesign and Sitescripts
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts Knut Relbe-Moe [MVP, MCT]
 
Branding office 365 with front end tooling
Branding office 365 with front end toolingBranding office 365 with front end tooling
Branding office 365 with front end toolingThomas Daly
 
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017La Drupalera
 

Similar a Developing Custom WordPress Themes for Clients (20)

Theme customisation for beginners
Theme customisation for beginnersTheme customisation for beginners
Theme customisation for beginners
 
What Developers Need Designers to Know about WordPress
What Developers Need Designers to Know about WordPressWhat Developers Need Designers to Know about WordPress
What Developers Need Designers to Know about WordPress
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress Themes
 
Implementing a Symfony Based CMS in a Publishing Company
Implementing a Symfony Based CMS in a Publishing CompanyImplementing a Symfony Based CMS in a Publishing Company
Implementing a Symfony Based CMS in a Publishing Company
 
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...
SHOW202: How to customize Lotus Quickr Templates Using HTML, Javascript and C...
 
Introduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran SayedIntroduction to Gutenberg- Imran Sayed
Introduction to Gutenberg- Imran Sayed
 
Beginning WordPress Workshop
Beginning WordPress WorkshopBeginning WordPress Workshop
Beginning WordPress Workshop
 
SharePoint 2013 Branding
SharePoint 2013 BrandingSharePoint 2013 Branding
SharePoint 2013 Branding
 
WordPress: After The Install
WordPress: After The InstallWordPress: After The Install
WordPress: After The Install
 
Share point 2013 Building Websites
Share point 2013 Building WebsitesShare point 2013 Building Websites
Share point 2013 Building Websites
 
Drupal 7 Search Engine Optimisation
Drupal 7 Search Engine OptimisationDrupal 7 Search Engine Optimisation
Drupal 7 Search Engine Optimisation
 
Joomla templates2011
Joomla templates2011Joomla templates2011
Joomla templates2011
 
Forensic Theming - DrupalCon London
Forensic Theming - DrupalCon LondonForensic Theming - DrupalCon London
Forensic Theming - DrupalCon London
 
Creating a Documentation Portal
Creating a Documentation PortalCreating a Documentation Portal
Creating a Documentation Portal
 
Atlanta Drupal User Group (ADUG)
Atlanta Drupal User Group (ADUG) Atlanta Drupal User Group (ADUG)
Atlanta Drupal User Group (ADUG)
 
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to DevelopmentWordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
WordCamp Greenville 2018 - Beware the Dark Side, or an Intro to Development
 
Speedrun: Build a Website with Panels, Media, and More in 45 Minutes
Speedrun: Build a Website with Panels, Media, and More in 45 MinutesSpeedrun: Build a Website with Panels, Media, and More in 45 Minutes
Speedrun: Build a Website with Panels, Media, and More in 45 Minutes
 
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts How to build a Project Hub with Hubsites and Sitedesign and Sitescripts
How to build a Project Hub with Hubsites and Sitedesign and Sitescripts
 
Branding office 365 with front end tooling
Branding office 365 with front end toolingBranding office 365 with front end tooling
Branding office 365 with front end tooling
 
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017
Efficiently theming a multi-site Drupal 8 portal - Drupal Dev Days Seville 2017
 

Último

Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationRadu Cotescu
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘RTylerCroy
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptxHampshireHUG
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CVKhem
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slidevu2urc
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUK Journal
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessPixlogix Infotech
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationMichael W. Hawkins
 

Último (20)

Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law DevelopmentsTrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
TrustArc Webinar - Stay Ahead of US State Data Privacy Law Developments
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Histor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slideHistor y of HAM Radio presentation slide
Histor y of HAM Radio presentation slide
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdfUnderstanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day PresentationGenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
 

Developing Custom WordPress Themes for Clients

  • 2. Steven Slack freelance Web Developer @ S2 Web @slacktronic s2webpress.com
  • 4. #1 rule in creating custom themes for clients: Caring!
  • 6. Tailor made A custom theme is built specifically to meet the needs of your client’s business or project.
  • 7. Planning icon by Björn Andersson, from The Noun Project
  • 10. Site Architecture Determine hierarchy of site navigation and structure
  • 11. Site Architecture Determine hierarchy of site navigation and structure custom post types, taxonomies, featured images, custom fields, sliders, widget areas, theme options, etc...
  • 12. Plan out the features
  • 13. Do you really need to build a custom theme?
  • 14. You may need a custom theme if: ● ● ● ● ● ● ● ● You need to present different types of content in a unique way You need to present a plugins presentation in a certain way To Create a Unique look to the WP theme To take advantage of templates, template tags, and the WordPress Loop to generate different website results and looks. To provide alternative templates for specific site features, such as category pages and search result pages. To quickly switch between two site layouts, or to take advantage of a Theme or style switcher to allow site owners to change the look of your site. To provide “some” theme options for custom presentation To take advantage of custom fields and meta data.
  • 16. ● How much does it cost? “It depends” ● Try it out - Scope out a project as best you can, track your hours to determine cost for future projects ● “One size fits all” doesn’t apply - different types of themes are going to have different prices ● Stay on track - avoid scope creep and put language about changes and modifications in the contract.
  • 17. Time to make something!!
  • 18. Designing the site ● Work off of site architecture / wireframe ● Design Preference - Browser? Photoshop? ● This is only one portion of the design process not a finished product
  • 19. Development There are several ways to begin developing custom themes: 1. Child Themes 2. Theme Frameworks 3. Starter themes
  • 20. Child Themes “A WordPress child theme is a theme that inherits the functionality of another theme, called the parent theme.” - Codex ● ● ● Inherits parent theme functionality Good for simple theme modifications - add theme support, custom backgrounds, changing colors, etc… keep customization separate from parent theme core functionality ● allow parent themes to be updated without destroying your modifications ● take advantage of effort and testing put into parent theme ● save on development time; no need to recreate the wheel ● are a great way to get started to learn about theme development
  • 21. Child Theme Considerations Parent theme may contain tons of features which you do not need
  • 22. Theme Frameworks “A ‘drop-in’ code library that is used to facilitate development of a Theme” - Codex ● Developers can leverage a framework’s built-in code, options, plug-ins, and themes from which to develop. ● Eliminates the need to re-invent the wheel for each project. ● Decrease time spent developing a theme
  • 23. A few popular frameworks: ● Builder by iThemes ● Canvas by WooThemes ● Genesis by StudioPress ● Hybrid Core by Justin Tadlock ● Thesis by DIYThemes Review of 10 popular frameworks - torquemag.io/review-10-frameworks
  • 24. Theme Framework Considerations: ● ● ● ● ● Adds a layer of complexity to WordPress More to manage, more to update, and a sometimes a bulkier admin. Plugin compatibility Some frameworks charge for support and updates Unused features and options
  • 25. Starter Themes Base themes with all the essential files and functions required for a WordPress theme but with minimal to no styles.
  • 26. A few places to start: ● Underscores - underscores.me ● Roots - roots.io ● Bones - themble.com/bones
  • 27. Starter theme considerations Choosing a starter theme to work with is up to your preference and depends on the way you like to work. Example: Roots is built with Twitter Bootstrap and uses LESS. Bones is based on the HTML5 Boilerplate and is ready for LESS or SASS development. Using a starter theme gives you control over what features you want to add. The world is at your fingertips. You will need some time and skills to build a custom theme with a starter theme
  • 29. Theme Options ● Keep them to a minimum, if possible ● Theme options should affect display not functionality. ● Use the theme customizer ● Use WordPress Options API
  • 30. Presentation and Functionality Generally, when we refer to functionality in WordPress we are speaking of plugins while themes handle the presentation.
  • 31. Functions Avoid the temptation to put A LOT of functionality in your functions.php file Create a library with specific functions
  • 33. Required Plugins? How about suggested plugins? TGM Plugin Activation The best way to require and recommend plugins for WordPress themes (and other plugins) tgmpluginactivation.com
  • 34. Put extra functions into a plugin.
  • 36. Organization & Maintenance Portable Plugin Easier to debug Separation of concerns
  • 37. Wrap plugin functions in conditionals in the theme <?php // if Advanced Custom Fields function exists and the field is not empty display the field if ( function_exists( 'get_field' ) ) { if( get_field( 'some_custom_field' ) the_field( 'some_custom_field' ); } } ) { ?> If the plugin is disabled you will avoid receiving error messages or a blank screen.
  • 39. What does the business owner get?
  • 40. A well organized WordPress environment will have a cost benefit to the client, business, or individual
  • 41. A more stable environment will save you time on debugging, fixing problems or moving data, hence saving your client money.
  • 43. Follow WordPress Coding Standards make.wordpress.org/core/handbook/coding-standards
  • 44. Debug! ● Set WP_debug to true in your wp_config.php file. ● Use developer plugins - wordpress.org/plugins/developer /** * For developers: WordPress debugging mode. * * Change this to true to enable the display of notices during development. * It is strongly recommended that plugin and theme developers use WP_DEBUG * in their development environments. */ define('WP_DEBUG', true );
  • 45. Use the theme check plugin
  • 46.
  • 47.
  • 48. Performance ● ● ● ● minimize http requests minify scripts and styles reduce image sizes use sprites in your theme images
  • 49. Reviewing the theme with the client
  • 50. “Can we make this area a scroll area?” “I want this to be a dropdown box.” “When you click on this button I want it to go to the contact page.” “I don’t really understand what all this Lorem Ipsum is?” “That wasn’t in the mockup.” “That looked different in the mockup.” “These aren’t my photos!” “What are we looking at here? I don’t understand.”
  • 51. Present the theme to the client with their content ● Load the clients content into WordPress. Hire someone if necessary ● Present client site on your test server (staging site) ● If they already have a WP site - export their data and import it into your development environment ● Disable search engine visibility in Settings => Reading
  • 52. Fine tune the theme
  • 54. ● Use an under construction plugin while prepping the site. ● Upload theme and plugins ● Upload data if needed. ● Configure theme and plugin settings ● Double check everything
  • 56. Training Resources ● ● ● Video Tutorials PDF Guide WP Beginner - WP101.com - WP Easy Guide ( easywpguide.com ) - Beginners guide to WordPress ( wpbeginner.com )
  • 58. ● Managed Support - managewp.com ● Case by case bug / improvements ● Managed WordPress maintainence fantasktic.com, wpmaintainer.com, maintainn.com