The Deep Dish on Themes, Templates, Components
WANT TO SEE MORE LIKE THIS?
Sign up to receive an alert for our latest articles on design and stuff that makes you go "Hmmm?"
Here at Glantz, we’re firmly located in Chicago Deep Dish territory. In fact, you can use Gigio’s, Giordano’s and Lou Malnati’s to triangulate our office location. And we like that.
Building a website is a little more complicated than baking a pizza. But like pizza, many of our web projects can be distilled into their most basic ingredients. Our fundamental ingredients are: the WordPress source code theme files, templates, and components. You might think of each of these elements as separate ingredients that make up a whole, like the ingredients of a pizza. Here’s a deeper look at each of the elements we use to build our WordPress web projects and the unique pros and cons of each.
Pizza | WordPress | |
---|---|---|
Crust | WordPress source code | The base code for every WordPress website. Sites start with a fresh installation of WordPress and build upwards. |
Sauce and Cheese | Theme | The styles and images that are applied to your entire website to give it one consistent look and feel. |
Slices | Templates | Intentionally-designed, reusable pages on your site. These are primarily made of your crust and sauce, but are also customizable as needed. |
Toppings | Components | Standalone pieces of a web page that can be mixed and matched with other page content |
WordPress Source Code: Pizza Crust
The WordPress source code is the pizza crust we build sites on top of. It is the starting point for each of our web projects—the most basic blank canvas of a website.
WordPress Themes: Sauce and Cheese
A WordPress theme encompasses all the files that make up the look and feel of your website. We place this collection of files in the WordPress source code of your site, and they work together to produce the unifying design for a website. Elements that the theme controls could include: the font used throughout your site or the color of the footer and header across all pages.
Themes are the sauce added to the crust—an enhancement to the code that ensures your site has a consistent look and feel. A theme can modify the way the your site displays without modifying the underlying WordPress source code.
WordPress Theme Pros
Thousands of options: Themes are as easy to find as a frozen grocery store pizza. They can come with many extra bells and whistles, or as humble and inexpensive as Domino’s.
Easy to download: Themes can be added to your site directly from the WordPress dashboard, or from third-party sites like Envato Market.
Customizable and limitless: Seasoned developers like the ones here at Glantz can build a custom theme from the ground up. Custom-built themes can be completely bespoke to your design and needs.
WordPress Theme Cons
Limited editing power: Themes offer a major advantage in that there is no need to learn to code to change the look of your site. However, this can also severely limit the power you have to edit the details of your site.
Plugins compatibility: Many plugins are available that work seamlessly with off-the-shelf themes. Unfortunately, there’s no guarantee that any purchased theme will play nicely with your desired plugins.
Longevity: Themes stay fresh a little longer than Papa John’s leftovers. However, they require constant updating to fix bugs and security issues. Many off-the-shelf themes do not get updated after about a year. A seasoned development team can adjust and update your theme to keep it secure and compatible with the latest version of WordPress.
WordPress Theme Templates: Pizza by the Slice
How often when you order a pizza does everyone agree on the toppings?
Templates are like individual, customizable slices of a pizza. It is just one file in your site’s theme folder. A template represents a reusable and customizable page on your website that incprorates your theme styling. Once built and customized, your template file can be used and re-used to create as many pages you need.
A common example of a WordPress theme template is a blog page. The theme developer creates one blog page template that lays out a title, a header image, and some paragraphs of text. When added to the theme folder, each of the blogs you write will be rendered as new pages on your website, matching in style and differing in content. You can have as many pages and/or templates as you want, adding in each one as needed, like ordering pizza by the slice.
WordPress Theme Templates Pros
Customization: Templates can be customized to meet the needs of a specific page on your site, such as a blog template or employee profile page.
Reusable: Once created, templates can be easily reused throughout your site without any extra work to set up the layout or styling.
Consistency: Templates offer an easy way to keep your site’s design consistent. You can add as much content as desired, while ensuring that your website looks coherent across the board.
WordPress Theme Templates Cons
Development time: Though each template is easy to reuse once built, they require extra development time to set up initially. Themes purchased from a third-party site may not come with the templates you need.
Longevity: Similar to themes themselves, theme templates are not guaranteed to work with all plugins. They require a developer looking out for bugs and compatibility issues in the long-term.
WordPress Components: Toppings
A component is a piece of a single page of a website. Components are highly customizable, modular parts of your site, and can be as big as a side menu bar, or as small as a single button.
A component is like a single pepperoni. You can place it all over your site, on a single page, or put ten pepperonis on one page and none on another. Because they are built to be modular and reusable, you can place and remove them with relative ease. For this reason, developing websites with components is very much the future of development. WordPress itself is moving toward a more component-based design framework.
WordPress Components Pros
Reusable: Like with templates, components can be reused and recycled with the WordPress block system. Unlike templates, they can be even further re-combined in different areas of your website and even repeated on the same page.
Properties: Components can be coded to have certain attributes that change with user input. For example, a button component can be built with property that controls the background color. The developer builds the button once. Then, the WordPress user can use it with a different value for the background color each time.
Time: Instead of building a component and styling it on each page of a site, developers can simply code a component once and then reference it as needed.
WordPress Components Cons
Consistency: Creating a lot of different components on your site can muddy your design. That opens up the possibility of losing design consistency and confusing your site’s visitors.
New technology: Depending on how old your theme is, it may not be possible or add extra development time to add new components to your site.
Cost: Creating reusable components takes more time. While these are the ultimate in user-friendly development, this approach is an investment.
Conclusion
We are not just pizza people here at Glantz—we are a WordPress shop. WordPress is not just an excellent platform to use when building a website. The theme system allows us to build a wide range of highly customizable and user-friendly web projects. Once you’ve got the vocabulary down, using the platform becomes both easy and rewarding. And like we said—we’re pizza people here at Glantz, and we’re always hungry for our next big project.