Easy Template Engine of CMS
Easy and flexible web page template consists of web parts which can be manipulated by GUI, and be edited by Html code.
The CMS template consists of following 3 type of parts.
The template for web page is the top part of web template. You can assign this template to the page content managed by CMS.
This template can contain the div layer parts and Html5 based components. You can reuse the components and effectively manage the design.
More about the CMS template, please take a look at Architecture of Template Engine.
The div layer parts is used to implement two column layout. And when you use the responsive web design, make the Style Sheet suitable for mobile.
The div layer parts can contains Html5 components and other div layer. When you implements 3 columns layout, nest this parts.
About the more detail about Div Layer Parts, please take a look at Container Template's Design in the CMS manual section.
Html5 Components are most primitive ones. It is the final parts of the templates, it is consists of following parts.
- Html code
- Server side program
- Images and other resources
The parts are Header, Footer, Bread List, Article, Relevant Topics, Navigation, and Social Bookmarks part in the picture above.
This part is programmable. In addition to customize the design, if you are programmer, you can create application part as plug in of this Content Management System.
You can arrange the layout of components by GUI based editor. It is very useful, but in order to make html code which is suitable to SEO, you have to edit codes a little.
You have to manage the Html code generated by template engine. In order to do that, you have to know how the Html code is generated by th engine.
Following Html code is the source of the template top part.
The $autoBody part is replaced into the code you arranged components by GUI editor.
This Html code contains header parts, therefore you can put meta tags for the template. For example, blog top and archive pages are noindex and nofollow, the codes are located in the templates of them.
They are also located in the $autoHeader section.
Some template have to implement pagination. if the top part contains a component which needs pagination, it automatically generate code for pagination.
The Html5 components which paginate have to enable "is_paging" flag, and implement server code to return the number of pages.
By this implementation, the template engine generate pages for the number it returns with the parameter it shows the page number.
And if you want to add robots meta tag whose values are "next" or "prev", add the tag to the basic Html of the template.
After you understand the template engine's overview, let's learn the more detail about Html5 components.
When you build a new site with CMS, the first task to change design is edit the design of Header and Footer. Then this knowledge is necessary.
It is very easy to customize the component. Please take a look at Html5 based customizable template components, next.