The homepage, as the first impression of your site that users encounter, is of great importance.It carries multiple functions such as brand image, core information display, and user guidance.For those who are using or planning to use AnQiCMS to build websites, understanding which file controls the display of this key page is the first step in personalized customization and content optimization.
The AutoCMS is committed to providing an efficient and customizable content management solution, naturally also providing you with great freedom to control this core page.Then, where is the key file that determines the appearance of your website's front page hidden?
The 'command center' of the home page:index.htmlorindex/index.html
In the template system of Anqi CMS, the default display template file of your website's homepage is usuallyindex.htmlorindex/index.htmlThese two files both bear the responsibility of defining the layout and content of the website homepage. Which one to use depends on the file organization mode adopted by the template you choose.
All template files are stored in the installation directory of the AnQi CMS./templateFolder.Under this root directory, each independent template will have its own dedicated folder./template/default/This is the directory.
In the exclusive directory of this template, you will find two main forms of homepage file organization:
- Flattened file organization mode:In this mode, the home page file will be directly located in the template root directory, that is
/template/您的模板目录/index.html. This approach is concise and clear, and the home page content is directly defined by this single file. - Folder organization mode:Another common way is, the homepage content is organized in a folder named
indexin a subfolder named/template/您的模板目录/index/index.htmlThis pattern may appear in large or more complex templates, which is helpful for better management and division of templates for different page types.
No matter which organization method is used, these template files are used.htmlAs a file extension. At the same time, the static resources such as images, CSS style sheets, and JavaScript scripts used on the page will be stored uniformly./public/static/The content under the directory, and reference in HTML through template tags.
Why is it so important to understand this file?
Understanding and being able to modify this homepage template file freely means that you can:
- Create a unique brand image:The homepage is the face of the brand, by modifying the template files, you can adjust the layout, color scheme, and font to ensure that the website's visual style is highly consistent with the brand's tone.
- Optimize user experience and conversion path:According to user behavior data, you can adjust the presentation order of home page content, highlight core products or services, set clear navigation and Call-to-Action, guiding users to make purchases, consultations, and other operations.
- Customize layout for search engines:Anqi CMS is SEO-friendly, and the homepage is an important basis for search engines to capture and judge the theme of the website. By directly editing
index.htmlYou can reasonably arrange keywords, optimize the page structure, and enhance the visibility of the homepage in search engines. - Improve website flexibility:Whether it is to carry out short-term promotional activities or to carry out website redesign, you can directly modify the home page template, quickly respond to operational needs, and do not need to delve into the backend code.
How to manually modify the homepage template file?
Manually modify the homepage template file, it is actually simpler than you imagine. First, you need to connect to the server through the FTP/SFTP client, find the specific path mentioned above underindex.htmlorindex/index.htmlThe file. If your security CMS backend has enabled the online template editing feature, you can directly find and edit it in the "Template Design" module of the backend, which is more convenient.
The Anqi CMS uses syntax similar to the Django template engine, making the writing of template files both intuitive and powerful.This means you can use various built-in template tags to dynamically populate content, not just static HTML.
- You can use
{% system with name="SiteName" %}Tag to retrieve the website name configured in the background global settings. - Use
{% archiveList archives with type="list" limit="5" %}To display the latest articles or product list. - Pass
{% navList navs %}To dynamically generate the website's navigation menu.
An English translation might look like this: A simple home page template snippet might look like this:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>{% tdk with name="Title" siteName=true %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
<link rel="stylesheet" href="{% system with name="TemplateUrl" %}/css/style.css">
</head>
<body>
<header>
<img src="{% system with name="SiteLogo" %}" alt="{% system with name="SiteName" %}">
<nav>
<ul>
{% navList navs %}
{% for item in navs %}
<li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
{% endfor %}
{% endnavList %}
</ul>
</nav>
</header>
<main>
<h1>欢迎来到 {% system with name="SiteName" %}</h1>
<section>
<h2>最新动态</h2>
<ul>
{% archiveList latestArticles with type="list" moduleId="1" limit="5" %}
{% for item in latestArticles %}
<li><a href="{{ item.Link }}">{{ item.Title }}</a> - <span>{{ stampToDate(item.CreatedTime, "2006-01-02") }}</span></li>
{% endfor %}
{% empty %}
<li>暂无最新文章。</li>
{% endarchiveList %}
</ul>
</section>
<!-- 更多内容模块 -->
</main>
<footer>
<p>{% system with name="SiteCopyright" %}</p>
<p><a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">{% system with name="SiteIcp" %}</a></p>
</footer>
</body>
</html>
Masteredindex.htmlorindex/index.htmlThis core file, once mastered, gives you the 'face' of the Anqi CMS website, allowing you to flexibly adjust and optimize your website's homepage according to actual needs, bringing users a **excellent** visit experience.
Common Questions (FAQ)
问：If I want to change the overall template of the website, what should I do?
答：English CMS supports multiple template switching functionality.You can find the 'Template Design' or a similar module in the admin interface.Here, the system will list all installed templates, and you can select and enable the template you want.config.json文件，其中"status": 1It usually indicates that the template is in use. Switching through the backend interface is the safest and recommended method.
Question: I found that there are bothindex.htmlin my template directory.index/index.htmlWhat system will be used first?
Answer: According to the template design agreement of Anqi CMS, the system will prioritize searching for and using the folder organization mode when loading the homepage.index/index.htmlFile. If the file does not exist, it will then attempt to find and use the template root directory.index.htmlAs the home page template. To avoid confusion and ensure that the template works as expected, it is recommended that you choose