WordPress Theme Mechanics
-
Upload
kirk-biglione -
Category
Design
-
view
275 -
download
2
description
Transcript of WordPress Theme Mechanics
![Page 1: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/1.jpg)
WordPress Theme MechanicsBecause sometimes you need to look under the hood
![Page 2: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/2.jpg)
Common Challenges
• Change fonts and typography? (font size, font color, font face, line spacing).
• Change the background color on a page.
• Customize the theme header (or footer).
• Modify the site layout - change column widths, margins, padding.
![Page 3: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/3.jpg)
In Today’s Webinar
• How WordPress works (conceptually).
• Understanding the WordPress template system.
• Customizing your theme the CSS way.
• How to make a child theme.
• Almost no PHP.
![Page 4: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/4.jpg)
My Assumptions
• You know a little about WordPress
• Adding posts and pages
• Installing and activating plugins and themes
• You have some very basic knowledge of common web terminology
• Primarily HTML & CSS
![Page 5: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/5.jpg)
How WordPress Works
![Page 6: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/6.jpg)
![Page 7: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/7.jpg)
![Page 8: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/8.jpg)
![Page 9: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/9.jpg)
![Page 10: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/10.jpg)
What are the limits ofWordPress Themes??
![Page 11: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/11.jpg)
What are the limits of HTML and CSS?
With just a little bit of JavaScript?
![Page 12: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/12.jpg)
![Page 13: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/13.jpg)
Anything is possible*
* when you know the secrets
of the WP theme system
(and HTML and CSS)
![Page 14: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/14.jpg)
Theme Secrets Revealed
![Page 15: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/15.jpg)
Inside the Theme Folder
![Page 16: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/16.jpg)
![Page 17: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/17.jpg)
Decoding the Template System
![Page 18: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/18.jpg)
Home | About | Contact Us
Site NameSite tagline
Privacy Policy * Terms of Service * Copyright
Post TitlePost Date * Post Author
Dynamically aggregate resource-leveling architectures vis-a-vis cutting-edge systems. Enthusiastically drive parallel value rather than team building growth strategies. Interactively pursue functional meta-services rather than frictionless technology. Authoritatively strategize proactive vortals via cross-media web-readiness. Assertively communicate flexible benefits via magnetic deliverables.
Synergistically customize team driven leadership for frictionless vortals. Interactively leverage other's process-centric collaboration and idea-sharing for excellent channels. Proactively unleash premium leadership skills before market-driven information. Seamlessly brand equity invested networks via front-end e-business. Seamlessly maintain economically sound schemas with 24/7 opportunities.
Holisticly provide access to worldwide ideas without intuitive content. Dynamically myocardinate front-end benefits with clicks-and-mortar models. Conveniently pontificate professional technology and extensive systems. Energistically brand flexible customer service rather than prospective alignments. Collaboratively supply transparent ROI whereas scalable e-commerce.
Proactively myocardinate fully tested meta-services without adaptive e-commerce. Efficiently leverage other's enabled total linkage with global channels.
Filed Under: Category Name
Templates are patterns
for your website
![Page 19: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/19.jpg)
Every type of page has a template
![Page 20: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/20.jpg)
Header
Footer
Sidebar
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Home PageLists posts from newest to oldest, blog style(aka index.php, home.php, front-page.php)
![Page 21: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/21.jpg)
Header
Footer
Sidebar
Post Title
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
September 1, 2013 * By Author Name
File Under: CategoryTag, Tag, Tag, Tag
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Leave a Comment:
PostDisplays a single post and comments
(aka single.php)
![Page 22: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/22.jpg)
Header
Footer
Sidebar
Page Title
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
September 1, 2013 * By Author Name
File Under: CategoryTag, Tag, Tag, Tag
Normal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Leave a Comment:
PageDisplays a single page
(aka page.php*)
* if page.php doesn’t exist, WordPress uses single.php for pages
![Page 23: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/23.jpg)
Header
Footer
Sidebar
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Post TitleNormal Paragraph, Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Donec ullamcorper nulla non metus auctor fringilla. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum. Vestibulum id ligula porta felis euismod.
Archive: Category, Tag, Date, or Author
Archives(aka archive.php, category.php,
tag.php, author.php)
![Page 24: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/24.jpg)
Getting More Specific
category.php → category-baking.php
page.php → page-about.php
single.php → single-products.php
![Page 25: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/25.jpg)
Templates for Page Parts
![Page 26: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/26.jpg)
Page Content
Header
Footer
Sidebar
Header(aka header.php)
![Page 27: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/27.jpg)
Page Content
Header
Footer
Sidebar
Footer(aka footer.php)
![Page 28: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/28.jpg)
Page Content
Header
Footer
Sidebar
Sidebar(aka sidebar.php)
![Page 29: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/29.jpg)
Content(aka content.php, content-audio.php, etc.)
Page Content
Header
Footer
Sidebar
![Page 30: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/30.jpg)
Template Master GuideThe Template Hierarchy Diagram (don’t let the name scare you)
![Page 31: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/31.jpg)
h"p://codex.wordpress.org/Template_Hierarchy
![Page 33: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/33.jpg)
What about those other files & folders?
![Page 34: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/34.jpg)
functions.php
• Used to enable theme features (menus, widget areas, featured images, etc.).
• Can be used to do anything a plugin can do.
![Page 35: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/35.jpg)
style.css
• The most important file in your theme.
• Controls all design elements:
• All type settings (style, size, color, line spacing, margins, etc.).
• Positioning of layout, sidebars, header, footer, and everything else.
• Anything you think of as “design” is probably controlled by CSS
![Page 36: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/36.jpg)
![Page 37: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/37.jpg)
The same WordPress site without CSS...
![Page 38: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/38.jpg)
![Page 39: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/39.jpg)
Customizing Your Theme
![Page 40: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/40.jpg)
Theme CustomizerThe “No Code” Way to Customize
![Page 41: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/41.jpg)
![Page 42: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/42.jpg)
![Page 43: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/43.jpg)
![Page 44: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/44.jpg)
![Page 45: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/45.jpg)
But what about bigger changes?
![Page 46: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/46.jpg)
CSSIt’s code, but at least it’s not PHP
![Page 47: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/47.jpg)
![Page 48: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/48.jpg)
![Page 49: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/49.jpg)
h1.site-‐;tle {color: #040393;font-‐size: 2em;font-‐style: italic;
}
![Page 50: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/50.jpg)
.site-‐main {background-‐color: #011033;
}
![Page 51: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/51.jpg)
div#navbar { background: #990000;}.nav-‐menu li a { color: #fff;}
![Page 52: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/52.jpg)
.site-‐header .home-‐link { min-‐height: 150px;}
![Page 53: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/53.jpg)
How do I know what CSS classes to use?
![Page 54: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/54.jpg)
![Page 55: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/55.jpg)
![Page 57: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/57.jpg)
![Page 58: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/58.jpg)
Before you change any CSS or
a theme template
![Page 59: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/59.jpg)
Start With a Child Theme
• A child theme protects your customizations.
• Child theme templates and styles override the parent theme.
![Page 67: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/67.jpg)
![Page 68: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/68.jpg)
![Page 69: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/69.jpg)
![Page 70: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/70.jpg)
PHPI said *almost* no PHP
![Page 71: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/71.jpg)
When You Need to “Know” PHP
• To change some common content element on a page (“Leave a comment”)
• To add or remove content elements on a page (title, date, category, etc.)
• Add a WordPress feature (menu, widget area, featured image, etc.)
![Page 72: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/72.jpg)
Inside a Template File
• PHP
• HTML
• Sometimes JavaScript
• CSS is in a stylesheet not the templates
![Page 73: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/73.jpg)
![Page 74: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/74.jpg)
Ready to Dig Deeper Into WordPress Themes?
![Page 75: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/75.jpg)
Theme Mechanics Workshop
• Five weekly sessions on WordPress themes (60 minutes each).
• In-depth coverage of WordPress theme topics.
• Learn how to customize your themes.
• Q&A with each session.
• Replays available in workshop member portal.
• Session content will be shaped by your feedback and needs.
![Page 76: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/76.jpg)
Workshop Topics• Setting up a WordPress theme lab on your PC or Mac.
• Working with the WordPress loop.
• Customizing theme templates: add common features like menus, widget areas, custom headers and footers, WP customization features (with child themes, of course).
• Creating custom page templates.
• Framework and starter themes. What they are and when to use them.
• Debugging. Fixing stuff when it breaks.
![Page 77: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/77.jpg)
Prerequisites
• You should be familiar working with WordPress.
• You should know a bit about HTML and CSS.
• PHP knowledge is not essential, but you should expect to learn some along the way.
![Page 78: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/78.jpg)
More Information at:http://workshop.wpapprentice.com
![Page 79: WordPress Theme Mechanics](https://reader034.fdocuments.in/reader034/viewer/2022052307/557e7f4ad8b42acf658b46ef/html5/thumbnails/79.jpg)
Code Editor Features
• Color code highlighting
• Line numbering
• Code completion
• Unicode support