How does the WordPress theme framework work?

Source: Internet
Author: User
: This article describes how the WordPress theme framework works. if you are interested in the PHP Tutorial, refer to it. The topic framework is incredibly powerful! For non-technical WordPress users, the theme framework makes it possible to build a website that is unique and looks like running a customized theme. for WordPress developers, they can help you quickly build a custom website while using the DRY (do not copy yourself) principle.

If you have been using a third-party framework for a period of time and find that the code is bloated and lacks flexibility and is frustrated, or you just want to have full control over your own code, building your own theme framework is undoubtedly the best choice!

In this series of tutorials, you will learn how to create your own WordPress theme framework to create a website for yourself or your customers, or share it with other users. You will learn through the following stages, including creating a parent topic with the framework Foundation, adding additional features, and hooks (also called hooks. At the same time, you will also learn how to use these skills in your sub-themes and plug-ins, and know how to share your code publicly to the public.

But before you start, you need to know how the theme framework works and what makes them different from a standard parent topic.

I spent some time developing two theme frameworks for two types of customer websites. Over time, I constantly strengthened and improved some of their applications. I have also developed theme frameworks in cooperation with third parties. In my experience, a theme framework should have the following main features:

  • Generally, it consists of a parent topic, which is designed to be used together with a child topic. In some cases, the parent topic is also used independently, but in other cases, A parent topic must be connected to a subtopic before it can be used. the WordPress code defines it as a "basic/entry-level topic" and a "Code Library ".
  • Generally, it includes some hooks and functions that can be used by quilt themes and plug-ins. Your theme framework is the foundation of the entire ecosystem. It also includes some plug-ins connected to the framework.
  • If it is used by unprogrammed users, it will include the topic option page, which allows users to customize themes according to their own needs. The design, layout, functions, and content can be diversified and mixed. In some cases, some features can be provided through the theme customizer.
  • It may include multiple gadgets, so non-technical users can add content or code through the WordPress gadgets (including the gadgets you specifically wrote for the framework by adding plug-ins.
  • It may also include script library functions, such as jQuery slider or Lightbox effects. Depending on your needs, you may need to merge these together in the theme framework or provide some plug-ins that are connected to the framework.
  • It is usually extensible and can be used with hooks to allow you to extend its functions through sub-themes and related plug-ins.

The first and second points above are the most fundamental-if there is no parent topic, you will not have a topic framework. A parent topic that does not have those hooks and functions is only a basic parent topic, not a real topic framework.

The above is about the theme framework, but how does it actually work? Let's take a look at the elements of a theme framework:

  • Parent topic and child topic to be selected
  • Action and filter hooks
  • Function
  • Topic options
  • Gadgets
  • Script
  • Scalability

AD: Web Studio

Parent and child themes

The main component of a topic framework is the parent topic. it can be designed in two ways:

  • As an initial topic, you can customize it through the topic options interface or theme customizer. Examples include Atahualpa and Thematic. These two examples can be used as independent themes without sub-themes.
  • Because a website must be added with a subtopic, the topic framework cannot be effectively used for websites without this subtopic. Such examples include Hybrid Core and Genesis. These will include some basic code, which you will usually find in a topic with a series of hooks and functions. these hooks and functions can be exploited through subtopics, you can also use related plug-ins. All of these constitute APIs (application interfaces) for the topic framework ).

Since one of the key features of the topic framework is the DRY principle, as long as possible, your parent topic will use template components and include Files ?, This means that you can access the same code in multiple locations of your topic. This also makes it easier to rewrite the code in the subtopic, because you only need to replace a template component or create an inclusion file.

For the moment, I will not explain the concepts of parent and child themes here, because there will be related introductions in the "child theme tutorial. Although many theme frameworks have a series of sub-themes that support your own, if you want to have other sub-themes that are more suitable for you, you can only develop them on your own.

If you are developing your own subject framework, I suggest you create at least one "initial" subtopic to avoid repeated participation in the development of each project: you may decide to create multiple sub-topics for different types of projects as the basis, such as some sub-topic blogs and non-blog websites.

Action hook and filter hook

When you add custom code or change the behavior of a topic, a topic framework includes a series of hooks associated with sub-themes and plug-ins:

  • Action hooks will appear in multiple places in the code, so that you can add the relevant code to your template file through the functions written in the topic framework, the subject framework can be covered by sub-themes. My own Theme Framework uses a large number of action hooks, which are provided in all template files, so that users can freely play in content such as gadgets and contact information, call the action button and site-specific code anytime and anywhere as needed.
  • Filter hooks can be used to change the behavior of sub-themes or specific plug-ins, such as custom loops and static content modification. Any static text (or code called from outside your website) should be wrapped in a filter so that it can change according to the needs of sub-themes.

It is worthwhile to spend some time in the early stages to consider what hooks you want to include, because you will know what needs to be included through a hook, what can be directly written into your template file. You will learn about this in the next tutorial.


Your topic framework may also contain a series of functions. Some of them will be linked to the action hooks and filter hooks you have defined, while others are functions such as template tags, and subtopics can use these functions.

If you have used any user-defined functions on some customer websites, you can also add them to your topic framework. In addition, you do not need to activate all functions: you only need to use the add_action () function on your sub-website to activate functions related to the parent topic.

Topic options

The theme option interface is useful for any complex theme, especially for non-technical users. Some of the main theme frameworks will contain multiple theme option interfaces in their own management area. The options include the switch function, modify layout, add content, and change design elements, such as color, background image, font and title image.

You can choose to use the theme customizer to complete many of your options. the advantage is that you can allow your users to see their changes while customizing the theme. For the Edupress topic framework, I took this approach, and the school website was developed by me and Mark Wilkinson.

Gadgets area

Whether or not you need to add a series of gadgets depends on the audience of your Theme Framework: If you are only yourself or a small team of developers, you may not need to add any gadgets on the standard sidebar or footer.

However, if your theme framework is intended for non-technical users, you can register multiple gadgets in different regions of the theme framework to give it more flexibility. You can also register a widget area in the website header, standard sidebar, and footer before and after the content, and below the footer.

The theme framework used by my customer website contains four gadgets in the footer: The theme checks which are filled and adds CSS classes accordingly, therefore, the filled widget area occupies the appropriate width of the page.

Your widget area may be directly written into your template file, or you may decide to add it to the relevant location of your website through action hooks (just like me. This means that they can be overwritten in sub-topics, whether it is an optional gadgets area or custom code.


If a given script is likely to be used by websites built on your own theme framework, or if your users are non-technical, you want to provide more options, then you can include some specific scripts in your framework, such as a slider or Lightbox special effect script. This eliminates the need to install additional plug-ins. However, if these scripts are not necessary, the code will become bloated, which is also a disadvantage.

Similarly, this will depend on your audience and expected needs: if it is just the framework you use to work on, I suggest using these scripts to develop (or identify) these plug-ins, you can use it whenever necessary.

If you really include these scripts, they are included in the enable and disable options on the topic options interface.


If your framework is very useful to a series of websites, you may want it to be scalable in the future. The parent topic that forms the core of the framework is equivalent to the heart of this ecosystem. you and your topic users will further develop and add more options and functions for their websites. This will include:

  • Subtopic or initial topic-these lists may change over time, especially if you publish your topic to the public.
  • Plug-ins designed for your framework are often activated through framework-specific hooks.

It may also include some useful documents for other developers who want to use your framework: the most important theme framework is equipped with a large number of documents, developers can customize websites they have built on the framework or create sub-themes or plug-ins for other users.


The theme framework is a powerful tool in the WordPress developer Arsenal. As we can see, it is important not only for thousands of owners (non-technical) who use it to create custom WordPress websites, but for any other developer, it is also a rare tool, whether these developers want to create a variety of websites for themselves or for their customers.

Theme frameworks generally have the following features: scalability and flexibility, and it makes it easy for you or your users to use sub-themes, and access related functions and hooks provided by your framework to customize websites.

We already know how the main framework works. in the next series of courses, you will understand what your framework needs to do and who it needs to work, this will help you decide the most appropriate development path of your theme framework.

Copyright disclaimer: Reprinted with the source URL

The above introduces how the WordPress theme framework works, including some content, and hopes to help those who are interested in PHP tutorials.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.