Template creation in progress, how do the public code (bash.html) and snippet directory (partial/) affect the page display?
In Anqi CMS, when we start to build or modify website templates, we come across some core files and directory structures, including public code filesbash.htmland code snippets directorypartial/plays a crucial role in the final display of the page.They are not just a simple pile of template files, but also the 'skeleton' and 'building blocks' that make up the structure and content display logic of a website, allowing our website to maintain consistency while having a high degree of flexibility and maintainability.
The foundation of the website: Public Code (bash.html)
Imagine building a house, we first construct a strong frame, including the foundation, load-bearing walls, and roof. In the world of Anqi CMS templates,bash.htmlIt plays the role of this 'master template' or 'basic framework'. It is the top-level layout file of your website, defining the common structure that all pages will share.
Generally,bash.htmlContains parts that appear on every page, such as:
- Website Header (Header): Including Logo, main navigation menu, search box, etc.
- Website Footer (Footer): Copyright information, filing number, links, contact information, etc.
- Overall layout framework: For example
<head>Partly imported CSS and JavaScript files, the overall container structure of the page, reserved positions for the sidebar area, and so on.
When you designbash.htmlWhen, in fact, it is setting a unified appearance and interaction foundation for the entire website. Other specific page templates (such as the home pageindex.html, article detail pagedetail.html, list pagelist.htmlIt is not built from zero, but through{% extends 'bash.html' %}tags to "inherit" this common skeleton.
Inheritancebash.htmlThe page will default to having all the content it defines. At the same time,bash.htmlwill be used{% block ... %}{% endblock %}An element to define an area that can be "filled" or "overwritten" by child pages, such as{% block content %}Used to place the main content of the page,{% block title %}Used to set the page title. This way, each child page only needs to focus on its unique "content", without needing to rewrite the common "frame" code.
Therefore,bash.htmlDirectly determines the website'sGlobal consistency. Any forbash.htmlThe modification, such as adjusting the navigation style or adding a global script, will immediately reflect on all pages inheriting it, greatly improving development efficiency and brand consistency.
Crafty building blocks: Code snippet directory (partial/)
If we saybash.htmlis the main framework of the website, thenpartial/The files in the directory are the 'building blocks' or 'code snippets' that make up the page details.This directory is used to store those codes that can be reused on multiple pages but are not part of the global 'skeleton' components.
typicalpartial/Files include:
- Sidebar (Sidebar)May contain popular articles, latest comments, ad spaces, etc.
- Breadcrumb navigation (Breadcrumb): Display the current page's position in the website hierarchy.
- Social sharing button: Allow users to share content to different social platforms.
- Common fields of the contact formIf multiple pages have similar forms, you can extract common fields.
- Single item in the article list.: To maintain style consistency, the display form of each article in the list can be defined as a snippet.
These code snippets are used through{% include 'partial/文件名.html' %}The tag is introduced into any page that needs it. For example, you can introduce it on the article detail page and the category list pagepartial/sidebar.htmlto display the same sidebar content
partial/The value of the table of contents lies in itsModular and reusable. When you need to modify the sidebar layout or functionality, just editpartial/sidebar.htmlThis file, all the pages that reference it will be updated synchronously, avoiding the trouble of repetitive modifications on multiple pages.
Even better, Anqi CMS allows you to pass through code snippets bywithThe tag passes specific data to it.For example, you can introduce a comment form snippet and tell it which article's comment it is.This makes these 'building blocks' both general and intelligent, able to display different content based on the context of different pages.
Collaborative work: integration of the whole and the details
bash.htmlandpartial/The catalog is an indispensable partner in the design of Anqi CMS templates, working together to shape the final page display effect of the website.
bash.htmlFirstly, the overall layout of the website and the common elements of all pages were set, laying a solid foundation for the website.- Based on this, each page template inherits
bash.htmland is built upon its{% block content %}Insert the unique content of this page in the area. - And this unique content of the page will often be used through
{% include ... %}tags, frompartial/Introduce various ingenious code snippets from the catalog, fill in details, enrich functions.
This hierarchical, modular design approach makes template creation orderly.We can accurately control from the macro page structure to the micro element details, ensuring that the website maintains high-quality presentation and low maintenance costs during rapid iteration.
By reasonable planningbash.htmlandpartial/Catalog, your secure CMS website can not only have a clear and consistent user experience, but also make future functional expansion and content updates easier and more convenient.
Frequently Asked Questions (FAQ)
1. Can I usebash.htmldirectly{% include ... %}Tag to introducepartial/the code snippet in it?Of course you can.In fact, this is a very common practice!partial/latest_news.html, then directly inbash.htmlsomeblockInternal or fixed area through{% include 'partial/latest_news.html' %}Introduced. In this way, this widget will appear on all inheritedbash.htmlpages.
2. If I modifiedbash.htmlorpartial/Why is the file in the directory not updated immediately on the website page?This is likely a caching issue.AnQi CMS in order to improve website performance, will cache template files.After you modify the template file, you may need to manually clear the system cache to see the latest effect.You can find the 'Update Cache' feature in the Anqi CMS backend, click to execute it.Sometimes, the browser's own cache may also cause delays, you can try to force refresh the page (Ctrl+F5 or Cmd+Shift+R) or clear the browser cache.
3. How topartial/Pass data to the code snippet in the directory to display the content of different pages?You can access{% include ... with key=value %}by such syntax to pass data to code snippets. For example, if you have apartial/comment_form.htmlto display the comment form, you can introduce it like this on the article detail page:{% include 'partial/comment_form.html' with article_id=archive.Id %}.comment_form.htmlInside, you can pass through{{ article_id }}To get and use the article ID passed in. This way, the code snippet can dynamically display content according to the context, which is very flexible.