The Art of Building AnQi CMS TemplatesextendsWithincludeCore Differences and Application Practices of Tags

In today's efficient iterative website development, the flexible use of template engines is the key to improving efficiency and ensuring project maintainability.As a senior website operations expert, I am well aware that AnQiCMS provides an excellent solution for content management with its powerful performance in Go language and template syntax in Django style.extendsandincludeTwo main tags are the core for building efficient and reusable page structures. However, many beginners often confuse their functions and application scenarios.

Today, let's delve deep into AnQiCMSextendsWithincludeThe main distinction of tags, combined with practical application scenarios, helps you better understand and utilize them to manage page relationships, and build a website that is both aesthetically pleasing and easy to maintain.

Page skeleton definer: extendstags

Imagine that you are building a website, which includes multiple pages such as the homepage, article detail page, product list page, and more.These pages often share the same header navigation, footer copyright information, and sidebar layout elements.If each page were to rewrite this common code, it would not only be inefficient, but any subsequent modifications would have a domino effect.

This is,extendsTags are like the 'architect' of your website, allowing you to define a universal 'master' or 'skeleton' template (usually named)base.htmlIt contains all the common HTML structure and layout for all pages. In this template, you can useblockLabel to reserve an area that can be filled or overlaid. For example, you can define ablock titlefor the page title, ablock contentfor the main content of the page.

when you create specific sub-page templates (such asindex.htmlorarticle.htmlwhen, just add the filefirst lineUse{% extends 'base.html' %}to inherit all the structure of the master template. After that, you can rewrite the definitions in the master template in the child template.blockTo fill in or modify the content of the corresponding area. This way, the sub-template can focus on its own unique content without concerning about the repeated code in the common part.

Core idea: extendsA "inheritance

Content Assembly Master:includetags

Withextends differs in the overall layout,includeTags are more like the 'module assembler' of a website.It is used to insert a small, reusable code snippet (partial) into any template that requires it.These fragments can be part of a navigation menu, a user login form, breadcrumb navigation, social media share buttons, or even complex ad placement code.

For example, you may have apartial/sidebar.html file, which defines the content of the website sidebar. Inbase.html or any other template that requires a sidebar, you simply need to use{% include 'partial/sidebar.html' %}[en]The content can be introduced accordingly.

includeThe power of tags lies in their flexibility.It can be called at any position in the template and will inherit all variables of the current template by default.with[en]Parameters pass specific variables to the included template, or useonlyThe keyword restriction only passes the specified variables to avoid unnecessary context pollution. Moreover, if you are not sure whether the template file to be included exists, you can useif_existsUse modifiers to avoid program errors and ensure the smooth operation of the website.

Core idea: includeThe implementation of the "tag" is a "combinationIt is mainly used to reuse small, independent UI components or content modules.

Core differences and application scenarios: when to useextendsand when to chooseinclude?

UnderstoodextendsandincludeEach mechanism and their differences will become clear naturally:

  1. Relationship type:

    • extendsEstablishes aparent-child inheritance relationship. A child template can only inherit one parent template and must be declared at the beginning of the file.
    • includeEstablishes aContent combination relationshipAn template can include any number of other template fragments and can be included at any position.

  2. Scope of application:

    • extendsFocus onOverall page layout and structure, defining the page's skeleton.
    • includeFocus onreusing fragments of local content，filling specific modules in the skeleton.

  3. Content transmission and control:

    • extendsDefaultly pass the complete context to the sub-template, and the sub-template rewrites through it.blockFill in the content.
    • includeDefault also passes the complete context, but it can bewithoronlyPrecisely control the variables passed to the included template.

  4. Mandatory and flexible:

    • extendsIt must be the first tag of the template file, which means that a file is either a parent template or inherits from a parent template, determining the overall form of the page.
    • includeIt can be used at any position in the template, as it simply inserts the file content into the current position without affecting the overall structure.

Consideration of practical application scenarios:

  • Chooseextends:When you need to define a unified visual style and layout for the entire website or a specific area of the website (such as the admin management page, blog front page), for example, a page that includes a fixed header, navigation, sidebar, and footer. You can create abase.htmlThen all specific pagesextendsit.
  • Chooseinclude:When you have some small, reusable UI components, such as a card for displaying article author information, a pagination component, a comment form, or a module for displaying the user login status in the top navigation bar.These modules can be reused in different pages, even in different positions on the same page, without changing the overall layout of the page.

These two tags provided by AnQiCMS perfectly combine the design patterns of inheritance and composition, allowing template development to ensure the consistency of the overall structure while being able to flexibly split and reuse local code.Understanding their differences and usage will greatly enhance your efficiency and quality in building websites on AnQiCMS.

Common Questions (FAQ)

1. Can I be in aextendssub-template that inheritsincludefrom another template fragment?

Of course, this is a very common usage. You can use it in any part of the sub-template that has been overridden.blockinside, or in other non-blockoverlaid areas, freely.includeInsert the content snippet you need using tags. For example, in an inheritedbase.htmlofarticle.htmltemplate, you can{% block content %}withinincludeAnpartial/article_meta.htmlto display the author and publication date information of the article.

2. OneincludeThe template file itself can be furtherextendsanother template?

Technically speaking, it is not recommended to do so as it may cause logical confusion and difficulties in maintenance.extendsThe label must be the first label in the template file, which defines the inheritance relationship of the current file. If you try to place it in a file that is usually as a content fragment,includein the file.extends，then this file beingincludeatextendsdeclarations will not be parsed correctly, or may cause unexpected behavior, because they have been included in a larger context. Usually, theincludeThe template snippet should be a relatively independent, self-contained HTML block.

3. If Iincludea non-existing template file, what will happen? Is there a way to avoid errors?

AnQiCMS is handlingincludetags. If the specified template file cannot be found, by default, it will report an error. However, you can useif_existsUse a modifier to elegantly handle this situation. For example: `{% include “partial/”}