Austin WordPress for Business Central (The Anatomy of a WordPress Theme)
Presenter: Corey Ellis
July 8 · 7:00 PM The Posh Co-Working Lounge
This session was video-taped and will be available (eventually) on WordPress.TV
The theme of your site at minimum controls how your site looks and many times may offer a multitude of the functionality. The basics of understanding how WordPress themes work is understanding patterns in the 3-5 core files that are required for a theme. Today’s session with walk you through a cursory overview of each of these files so you understand how they all work together to create a WordPress theme. This will be your first step toward learning how to edit or even create themes in the future.
WordPress Theme Anatomy (from Corey’s great outline)
Basic Overview
Header
Footer 1
Basic Overview Links 4 links
Theme Development « see WordPress Codex
Stepping Into Templates « see WordPress Codex
Template Hierarchy « see WordPress Codex
WordPress theme – The Anatomy, an Infographic – Yoast
SEE codex.wordpress.org
index.php is the one file where a theme would work – though it would get really large and unwieldy
3 thing required
1) index.php
2) style.css – only thing required is Theme Name / tags help you find the theme
3) Functions – don’t need – but place to act different functionalities – like in Twenty Eleven, it’s a php file
How does it get from these 3 files to something that actually works?
WP Page Structure
Header
Content
Footer
Another good view – lays out the hierarchy
what template the wp will get info from
Single
Page
most important two files
Spend time on 1st four links in Yoast blog post – puts together the anatomy of a theme file
Q: What does unicode mean?
A: NB – when internet started there were 26 characters; then as it became more involved, character set increased, then with asian language requirements – need 2 full bit set – so utf8 or unicode (requiring a diff database setting)
in header.php
meta name content”width=device-width – if this tag isn’t there, it’s not a responsive theme
Q: if everything is put in the index, does it matter what order it’s in
A: yes
3 elements matters
controls,communicate with theme files – this does not show up to the front end user
</head>
<body tag
is what is seen
so head has to become before body
wp_head
or
wp_footer
is where the functionality is
where it is important
CE puts important things in footer
machines has to stop in header to keep reading
if doing slider, JavaScript put in footer, because css loads faster
wp_head has to be before closing head
and
wp_footer has to be before closing body tag </body>
plugins are built for change – so you can override
e.g., so updates won’t get overwritten
what is a hook – way calls are made – actions and hooks
wp has different functionalities
there’s a hook for that – (part of the architecture)
90% of what you do is header or footer
the 10% will be ‘filter’ for the content – manipulate how it’s laid out
Body Class –
in header.php
adds classes to body depending on what page you’re viewing
you can add open body to set up different classes in each section (make sure you close in same section) – so that you could do it in header, one in body, etc.
– might slow cycle down – though nick said just adding more characters so it won’t slow down that much
navigation typically in head file
role ‘navigation’
wp_nav_menu – look in codex file
2 important functions
register_nav_menu (2 params – location and description)
[functions load 1st and it will control, if no functions, will look for index.php]
and then…
(sorry, missed the last part of the meeting)
BTW – We can use help scribing meeting minutes!