SlideShare une entreprise Scribd logo
1  sur  27
Télécharger pour lire hors ligne
WordPress Themes
underlying, unifying design for a blog
My Background
●   Father
●   Husband
●   Developer
●   Ninja

● Creating themes & plugins for past five years
● Built hundreds of blogs
● Plugins: thousands of downloads worldwide
What is a theme?!
A WordPress Theme is a collection of files that
work together to produce a graphical interface
with an underlying, unifying design for a blog.

Huh? In English...
● Gives your blog its appearance
● What visitors see
● Graphics & Colors
● Typography
● Responsiveness & Awesomeness
"Simplicity is the ultimate
    sophistication."
...and sometimes not so awesome.
Not All Themes Are Created Equal


Free Themes         Premium Themes




        Freemium Themes
Free Themes
●   Cost: Free
●   Lack flexibility & customization
●   Less features
●   Plain appearance
●   Great for content delivery
●   Straight to the point
●   Unsupported or slow development
●   Often outdated
Premium Themes
●   Cost: Paid....but sometimes free!
●   More options & flexibility
●   Beautiful appearance
●   Custom layouts
●   Supported & maintained
●   Large communities
●   Customize to fit your needs & deep desires
Freemium Themes
● Cost: Free...with option to pay
● Same as Premium Theme

Option to pay?! what?!
Pay to remove footer links, ads, or acquire
enhanced features.
GPL Licensing & Open Source
● Open source means free, right?! Yes & No!

● Free as in freedom. Not free like those
  cheese samples you swipe at the grocery
  store.
● GPL is the freedom to receive & change the
  source code.
● All WordPress software should be covered
  under GPL or similar licensing. (themes &
  plugins)
Customizing Your Theme
● Never ever..ever edit the core files of

  WordPress...ever.

● Lose your changes during an update

● Bad practice

● Never had reason to do it..ever.
How to easily customize a theme
● Go Premium!
● Premium themes have user friendly options
● Look for a demo to check out its options
● Does it fit your needs?
For the Hardcore Customizing
● Be a ninja
● All WP themes should be GPL (look for this)
● Customizing Theme core files is bad practice
● Utilize the functions.php file
More Hardcore Customizing
The functions.php file
● /wp-content/themes/themename/functions.php
● Acts much like a plugin
● Change default behaviors of your theme or WordPress
● Use WP hooks, actions, and filters
● Turn on theme support for post thumbnails, menu, etc
● Several blocks of code to expand the functionality of the
   active theme.
Even More Hardcode Customizing
Child Theme
● Dependant on a parent theme (premium)
● Files in Child Theme override parent theme files
● functions.php in child can replace parent functions
● Unique headers in style.css to identify child & parent
● /wp-content/themes/childthemename/
Hardcore Customizing Continues
Want to add a subscription box to your theme's homepage?
●   Create a duplicate of the parent theme's index.php file
●   Place duplicate file in child theme directory
●   Customize duplicate index.php file in child theme
●   Active the child theme
●   The duplicate index.php will override the parent's index.
    php
Why go through the trouble?
GPL gives us the freedom to copy and improve
already written code. Awesome! But it's not
always a good idea.

● Child themes protect changes from the update monster.
● When the parent theme is updated, the child theme isn't.
● Our changes may not be compatible with the recent
  updates but at least you didn't lose all your work.

So remember, think twice before customizing core theme files,
create a child theme, and only you can prevent forest fires.
Responsiveness & Awesomeness
      "Big things come in small packages"
    Mobile devices have never been so popular

●   Fast web browsing
●   Powerful processors
●   High screen resolutions
●   Broad Demographics
●   On-the-go
Responsive Design
                       The Problem
● Mobile browsers zoom out to the width of the site
● Difficult to read, touch links. and navigate
        I know what awesomeness is, but what's
                   responsiveness?
● It's how your site reacts to the screen it's being display
   upon. Minimizes issues by adjusting to the screen
● Responsive design is very important with delivering the
   right content.
Why Responsive is Important
●   Mobile friendly
●   Mobile advertising
●   Mobile traffic
●   Professionalism
●   User friendliness
●   Increased conversations
●   Current location (off topic but still cool)
Imagine you own a restaurant.
●   You run ads in a popular iPhone app.
●   Your food looks delicious.
●   Person clicks on your ad.
●   They want to quickly see your menu and your prices.
●   But your website isn't responsive. uh oh...
Instead they see a blurry slideshow
and tiny links. That might be beautiful
on your desktop but it's customer
repellent on a mobile phone. Which
of course is not cool.
This time your theme is responsive....
Person clicks on your ad. They want to quickly see your
menu and your prices. Your theme has beautifully
responded to the smaller screen on their
phone. Instead of the slideshow & tiny
links, they see big Beautiful buttons they
can easily touch.
Let me show you the way...
● This time your theme is responsive....
● Person clicks on your ad.
● They want to quickly see your menu and your prices.
● Your theme has beautifully responded to the smaller
  screen on their phone.
● Instead of the slideshow & tiny links, they see big
  beautiful buttons they can easily touch.
●
They browse your menu, check your hours without any
hassle from their phone. 10 minutes later they are dining in
your restaurant and complimenting your mobile website.
Resources
WordPress Themes
http://codex.wordpress.org/Using_Themes
http://codex.wordpress.org/Child_Themes
http://codex.wordpress.org/Functions_File_Explained
http://wordpress.org/extend/themes/


Responsive Web Design
http://en.wikipedia.org/wiki/Responsive_web_design
http://msdn.microsoft.com/en-us/magazine/hh653584.aspx
http://www.w3.org/TR/css3-mediaqueries/
by Clifton Hatfield
http://cliftonhatfield.com
http://facebook.com/cliftonhatfied.page
http://empoweredblogs.com

Contenu connexe

En vedette

Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUp
Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUpThemes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUp
Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUpDaytonWP
 
What's New in 3.5 - DaytonWP December 2012 MeetUp
What's New in 3.5 - DaytonWP December 2012 MeetUpWhat's New in 3.5 - DaytonWP December 2012 MeetUp
What's New in 3.5 - DaytonWP December 2012 MeetUpDaytonWP
 
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUp
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUpWordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUp
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUpDaytonWP
 
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUp
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUpRound Table: Content-Content-Content - DaytonWP February 2013 MeetUp
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUpDaytonWP
 
WordPress SEO by Yoast - DaytonWP November 2013 MeetUp
WordPress SEO by Yoast - DaytonWP November 2013 MeetUpWordPress SEO by Yoast - DaytonWP November 2013 MeetUp
WordPress SEO by Yoast - DaytonWP November 2013 MeetUpDaytonWP
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerLuminary Labs
 

En vedette (6)

Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUp
Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUpThemes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUp
Themes: What they Are - How To Use 'Em - DaytonWP November 2012 MeetUp
 
What's New in 3.5 - DaytonWP December 2012 MeetUp
What's New in 3.5 - DaytonWP December 2012 MeetUpWhat's New in 3.5 - DaytonWP December 2012 MeetUp
What's New in 3.5 - DaytonWP December 2012 MeetUp
 
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUp
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUpWordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUp
WordPress Security: Get it or Lose It - DaytonWP January 2013 MeetUp
 
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUp
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUpRound Table: Content-Content-Content - DaytonWP February 2013 MeetUp
Round Table: Content-Content-Content - DaytonWP February 2013 MeetUp
 
WordPress SEO by Yoast - DaytonWP November 2013 MeetUp
WordPress SEO by Yoast - DaytonWP November 2013 MeetUpWordPress SEO by Yoast - DaytonWP November 2013 MeetUp
WordPress SEO by Yoast - DaytonWP November 2013 MeetUp
 
Hype vs. Reality: The AI Explainer
Hype vs. Reality: The AI ExplainerHype vs. Reality: The AI Explainer
Hype vs. Reality: The AI Explainer
 

Similaire à WordPress Themes: underlying, unifying design for a blog

Developing Custom WordPress Themes for Clients
Developing Custom WordPress Themes for ClientsDeveloping Custom WordPress Themes for Clients
Developing Custom WordPress Themes for ClientsSteven Slack
 
Accessibility with Joomla [on a budget]
Accessibility with Joomla [on a budget]Accessibility with Joomla [on a budget]
Accessibility with Joomla [on a budget]Aimee Maree Forsstrom
 
Minimal responsive blog theme
Minimal responsive blog themeMinimal responsive blog theme
Minimal responsive blog themeJenifer Angle
 
Web Design for Literary Theorists I: Introduction to HTML
Web Design for Literary Theorists I: Introduction to HTMLWeb Design for Literary Theorists I: Introduction to HTML
Web Design for Literary Theorists I: Introduction to HTMLPatrick Mooney
 
Beyond responsive design - UI for the modern web application - Pete Smith - C...
Beyond responsive design - UI for the modern web application - Pete Smith - C...Beyond responsive design - UI for the modern web application - Pete Smith - C...
Beyond responsive design - UI for the modern web application - Pete Smith - C...Codemotion
 
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
 
Introduction to Wordpress
Introduction to WordpressIntroduction to Wordpress
Introduction to WordpressSandy Ratliff
 
Going Global - WordPress Multilingual
Going Global - WordPress MultilingualGoing Global - WordPress Multilingual
Going Global - WordPress MultilingualAmit Kvint
 
Building A Tasty Backend
Building A Tasty BackendBuilding A Tasty Backend
Building A Tasty BackendJennifer Tehan
 
We’re Going Mobile! Great! Wait… What Does That Mean?
We’re Going Mobile! Great! Wait… What Does That Mean?We’re Going Mobile! Great! Wait… What Does That Mean?
We’re Going Mobile! Great! Wait… What Does That Mean?STC-Philadelphia Metro Chapter
 
Getting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadGetting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadThinkful
 
Small Business Websites - Little Tips that Will Make a BIG Difference!
Small Business Websites - Little Tips that Will Make a BIG Difference!Small Business Websites - Little Tips that Will Make a BIG Difference!
Small Business Websites - Little Tips that Will Make a BIG Difference!Wellspring Digital
 
Evaluating & selecting themes
Evaluating & selecting themesEvaluating & selecting themes
Evaluating & selecting themesBecky Davis
 
WordPress: After The Install
WordPress: After The InstallWordPress: After The Install
WordPress: After The InstallWordPress NYC
 
Onetone theme review
Onetone theme reviewOnetone theme review
Onetone theme reviewDebbie Koury
 

Similaire à WordPress Themes: underlying, unifying design for a blog (20)

WordPress 101
WordPress 101 WordPress 101
WordPress 101
 
Developing Custom WordPress Themes for Clients
Developing Custom WordPress Themes for ClientsDeveloping Custom WordPress Themes for Clients
Developing Custom WordPress Themes for Clients
 
Accessibility with Joomla [on a budget]
Accessibility with Joomla [on a budget]Accessibility with Joomla [on a budget]
Accessibility with Joomla [on a budget]
 
Going Global WordPress Multilingual
Going Global WordPress MultilingualGoing Global WordPress Multilingual
Going Global WordPress Multilingual
 
Minimal responsive blog theme
Minimal responsive blog themeMinimal responsive blog theme
Minimal responsive blog theme
 
Web Design for Literary Theorists I: Introduction to HTML
Web Design for Literary Theorists I: Introduction to HTMLWeb Design for Literary Theorists I: Introduction to HTML
Web Design for Literary Theorists I: Introduction to HTML
 
Beyond responsive design - UI for the modern web application - Pete Smith - C...
Beyond responsive design - UI for the modern web application - Pete Smith - C...Beyond responsive design - UI for the modern web application - Pete Smith - C...
Beyond responsive design - UI for the modern web application - Pete Smith - C...
 
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
 
Introduction to Wordpress
Introduction to WordpressIntroduction to Wordpress
Introduction to Wordpress
 
Going Global - WordPress Multilingual
Going Global - WordPress MultilingualGoing Global - WordPress Multilingual
Going Global - WordPress Multilingual
 
Building A Tasty Backend
Building A Tasty BackendBuilding A Tasty Backend
Building A Tasty Backend
 
Wordcampraleigh
WordcampraleighWordcampraleigh
Wordcampraleigh
 
We’re Going Mobile! Great! Wait… What Does That Mean?
We’re Going Mobile! Great! Wait… What Does That Mean?We’re Going Mobile! Great! Wait… What Does That Mean?
We’re Going Mobile! Great! Wait… What Does That Mean?
 
Wordpress Setup Guide
Wordpress Setup GuideWordpress Setup Guide
Wordpress Setup Guide
 
Getting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) uploadGetting started with dev tools (05 09-17, santa monica) upload
Getting started with dev tools (05 09-17, santa monica) upload
 
Customizing WordPress Themes
Customizing WordPress ThemesCustomizing WordPress Themes
Customizing WordPress Themes
 
Small Business Websites - Little Tips that Will Make a BIG Difference!
Small Business Websites - Little Tips that Will Make a BIG Difference!Small Business Websites - Little Tips that Will Make a BIG Difference!
Small Business Websites - Little Tips that Will Make a BIG Difference!
 
Evaluating & selecting themes
Evaluating & selecting themesEvaluating & selecting themes
Evaluating & selecting themes
 
WordPress: After The Install
WordPress: After The InstallWordPress: After The Install
WordPress: After The Install
 
Onetone theme review
Onetone theme reviewOnetone theme review
Onetone theme review
 

Dernier

UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024mikailaoh
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comjakyjhon00
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxHasan S
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024Alan Dix
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Amil baba
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxb2kshani34
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...khushisharma298853
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillCre8iveskill
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTThink 360 Studio
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before ConstructionResDraft
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfsaidbilgen
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtTeeFusion
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfHctorFranciscoSnchez1
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazineRivanEleraki
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Ted Drake
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsBlock Party
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLkenzukiri
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxSamKuruvilla5
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Ed Orozco
 

Dernier (19)

UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024UX Conference on UX Research Trends in 2024
UX Conference on UX Research Trends in 2024
 
Create Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.comCreate Funeral Invites Online @ feedvu.com
Create Funeral Invites Online @ feedvu.com
 
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptxWCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
WCM Branding Agency | 210519 - Portfolio Review (F&B) -s.pptx
 
The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024The future of UX design support tools - talk Paris March 2024
The future of UX design support tools - talk Paris March 2024
 
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
Best-NO1 Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakis...
 
Production of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptxProduction of Erythromycin microbiology.pptx
Production of Erythromycin microbiology.pptx
 
Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...Khushi sharma undergraduate portfolio...
Khushi sharma undergraduate portfolio...
 
High-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkillHigh-Quality Faux Embroidery Services | Cre8iveSkill
High-Quality Faux Embroidery Services | Cre8iveSkill
 
How to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPTHow to use Ai for UX UI Design | ChatGPT
How to use Ai for UX UI Design | ChatGPT
 
Construction Documents Checklist before Construction
Construction Documents Checklist before ConstructionConstruction Documents Checklist before Construction
Construction Documents Checklist before Construction
 
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdfBuilding+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
Building+your+Data+Project+on+AWS+-+Luke+Anderson.pdf
 
Mike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy ShirtMike Tyson Sign The Contract Big Boy Shirt
Mike Tyson Sign The Contract Big Boy Shirt
 
LRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdfLRFD Bridge Design Specifications-AASHTO (2014).pdf
LRFD Bridge Design Specifications-AASHTO (2014).pdf
 
Embroidery design from embroidery magazine
Embroidery design from embroidery magazineEmbroidery design from embroidery magazine
Embroidery design from embroidery magazine
 
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
Introduce Trauma-Informed Design to Your Organization - CSUN ATC 2024
 
Designing for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teamsDesigning for privacy: 3 essential UX habits for product teams
Designing for privacy: 3 essential UX habits for product teams
 
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOLMath Group 3 Presentation OLOLOLOLILOOLLOLOL
Math Group 3 Presentation OLOLOLOLILOOLLOLOL
 
Cold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptxCold War Tensions Increase - 1945-1952.pptx
Cold War Tensions Increase - 1945-1952.pptx
 
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...Design mental models for managing large-scale dbt projects. March 21, 2024 in...
Design mental models for managing large-scale dbt projects. March 21, 2024 in...
 

WordPress Themes: underlying, unifying design for a blog

  • 2. My Background ● Father ● Husband ● Developer ● Ninja ● Creating themes & plugins for past five years ● Built hundreds of blogs ● Plugins: thousands of downloads worldwide
  • 3. What is a theme?! A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying, unifying design for a blog. Huh? In English... ● Gives your blog its appearance ● What visitors see ● Graphics & Colors ● Typography ● Responsiveness & Awesomeness
  • 4. "Simplicity is the ultimate sophistication." ...and sometimes not so awesome.
  • 5. Not All Themes Are Created Equal Free Themes Premium Themes Freemium Themes
  • 6. Free Themes ● Cost: Free ● Lack flexibility & customization ● Less features ● Plain appearance ● Great for content delivery ● Straight to the point ● Unsupported or slow development ● Often outdated
  • 7. Premium Themes ● Cost: Paid....but sometimes free! ● More options & flexibility ● Beautiful appearance ● Custom layouts ● Supported & maintained ● Large communities ● Customize to fit your needs & deep desires
  • 8. Freemium Themes ● Cost: Free...with option to pay ● Same as Premium Theme Option to pay?! what?! Pay to remove footer links, ads, or acquire enhanced features.
  • 9. GPL Licensing & Open Source ● Open source means free, right?! Yes & No! ● Free as in freedom. Not free like those cheese samples you swipe at the grocery store. ● GPL is the freedom to receive & change the source code. ● All WordPress software should be covered under GPL or similar licensing. (themes & plugins)
  • 10. Customizing Your Theme ● Never ever..ever edit the core files of WordPress...ever. ● Lose your changes during an update ● Bad practice ● Never had reason to do it..ever.
  • 11. How to easily customize a theme ● Go Premium! ● Premium themes have user friendly options ● Look for a demo to check out its options ● Does it fit your needs?
  • 12. For the Hardcore Customizing ● Be a ninja ● All WP themes should be GPL (look for this) ● Customizing Theme core files is bad practice ● Utilize the functions.php file
  • 13. More Hardcore Customizing The functions.php file ● /wp-content/themes/themename/functions.php ● Acts much like a plugin ● Change default behaviors of your theme or WordPress ● Use WP hooks, actions, and filters ● Turn on theme support for post thumbnails, menu, etc ● Several blocks of code to expand the functionality of the active theme.
  • 14. Even More Hardcode Customizing Child Theme ● Dependant on a parent theme (premium) ● Files in Child Theme override parent theme files ● functions.php in child can replace parent functions ● Unique headers in style.css to identify child & parent ● /wp-content/themes/childthemename/
  • 15. Hardcore Customizing Continues Want to add a subscription box to your theme's homepage? ● Create a duplicate of the parent theme's index.php file ● Place duplicate file in child theme directory ● Customize duplicate index.php file in child theme ● Active the child theme ● The duplicate index.php will override the parent's index. php
  • 16. Why go through the trouble? GPL gives us the freedom to copy and improve already written code. Awesome! But it's not always a good idea. ● Child themes protect changes from the update monster. ● When the parent theme is updated, the child theme isn't. ● Our changes may not be compatible with the recent updates but at least you didn't lose all your work. So remember, think twice before customizing core theme files, create a child theme, and only you can prevent forest fires.
  • 17. Responsiveness & Awesomeness "Big things come in small packages" Mobile devices have never been so popular ● Fast web browsing ● Powerful processors ● High screen resolutions ● Broad Demographics ● On-the-go
  • 18. Responsive Design The Problem ● Mobile browsers zoom out to the width of the site ● Difficult to read, touch links. and navigate I know what awesomeness is, but what's responsiveness? ● It's how your site reacts to the screen it's being display upon. Minimizes issues by adjusting to the screen ● Responsive design is very important with delivering the right content.
  • 19. Why Responsive is Important ● Mobile friendly ● Mobile advertising ● Mobile traffic ● Professionalism ● User friendliness ● Increased conversations ● Current location (off topic but still cool)
  • 20. Imagine you own a restaurant.
  • 21. You run ads in a popular iPhone app. ● Your food looks delicious. ● Person clicks on your ad. ● They want to quickly see your menu and your prices. ● But your website isn't responsive. uh oh...
  • 22. Instead they see a blurry slideshow and tiny links. That might be beautiful on your desktop but it's customer repellent on a mobile phone. Which of course is not cool.
  • 23. This time your theme is responsive.... Person clicks on your ad. They want to quickly see your menu and your prices. Your theme has beautifully responded to the smaller screen on their phone. Instead of the slideshow & tiny links, they see big Beautiful buttons they can easily touch.
  • 24. Let me show you the way... ● This time your theme is responsive.... ● Person clicks on your ad. ● They want to quickly see your menu and your prices. ● Your theme has beautifully responded to the smaller screen on their phone. ● Instead of the slideshow & tiny links, they see big beautiful buttons they can easily touch. ●
  • 25. They browse your menu, check your hours without any hassle from their phone. 10 minutes later they are dining in your restaurant and complimenting your mobile website.
  • 26. Resources WordPress Themes http://codex.wordpress.org/Using_Themes http://codex.wordpress.org/Child_Themes http://codex.wordpress.org/Functions_File_Explained http://wordpress.org/extend/themes/ Responsive Web Design http://en.wikipedia.org/wiki/Responsive_web_design http://msdn.microsoft.com/en-us/magazine/hh653584.aspx http://www.w3.org/TR/css3-mediaqueries/