Dedecms: how to use and create a mobile phone Template

Source: Internet
Author: User
The latest dedecms system has added many designs for mobile phones. after the update, the default template contains the mobile phone template. Therefore, we can design dual templates for the website, pc templates and mobile wap templates for computer websites. The following describes how to use and create dedecms Zhimeng mobile phone templates. For more information, see. The latest version of dedecms system added a lot of design for mobile phones, Zhimeng # php/php-tp-renewal.html "target =" _ blank "> after the update, the default template contains the phone template, therefore, we can design dual templates for Zhimeng website, pc templates for computer websites, and wap templates for mobile phones. The following describes how to use and create dedecms Zhimeng mobile phone templates. For more information, see.

When creating a template, we often refer to the tag used in the default template of Zhimeng. Therefore, let's analyze how to use the mobile phone template in the default template of Zhimeng.

Note: This tutorial is suitable for webmasters with experience in developing dream templates. if you are a newbie, you are advised to familiarize yourself with the development of dream templates.

1. mobile phone Template naming rules

In the new Dream default template, in addition to the original template, there are some additional mobile phone templates. the main mobile phone templates are as follows:

Index_m.htm homepage Template

Index_default_m.htm channel page template

List_default_m.htm list page template

List_default_sg_m.htm list page template

Article_article_m.htm content page template

Article_default_m.htm content page default template

Search_m.htm search page template

Head_m.htm top template

Footer_m.htm bottom template

Dedecms Template: www.php1.cn/xiazai/code/dedecms

Familiar with webmasters who are familiar with website templates of Zhimeng computer, and can understand the usage and production of these mobile phone templates at a glance. There are some differences between these mobile phone templates and pc templates in terms of creation and calling. The following describes the specific differences.

2. differences between mobile phone templates and pc templates

(1) the name of the mobile phone Template is different.

As you can see from the above mobile phone template name, the difference between the mobile phone template and the pc template is that after the pc template, the "_ m" character sheet pc page template is list_article.htm, and the corresponding mobile phone webpage template is list_article_m.htm.

In addition, when creating a pc template, there should be a pc template, and a corresponding mobile phone template should be created, named as above, so that the corresponding page can be normally displayed when the computer and mobile phone access.

(2) the resources called by the mobile phone template are in different locations.

When creating a pc template, the called css, js, and images are all in the template folder. for example, the default template contains css, js, and images. The css, js, images, and other resources called by the mobile phone template are all under the/m/assets folder of the website root directory.

Of course, we can set the resource calling location in the mobile phone template to the template folder. However, I have analyzed the advantages of calling the default mobile phone Template resources in this way. we separate the mobile phone Template resources from the pc template resources, so that when we create another pc template, to add an existing mobile phone template to this new pc template, you only need to copy the mobile phone template file to the new pc template, no need to change the css, js, or other resources on the mobile phone. Simply put, it is convenient to manage mobile phone resources.

Therefore, we recommend that you store the mobile phone Template resources in the corresponding folder of the root directory as the default template.

(3) m folder in the root directory of the website

The root directory of the new Dream contains the m folder, which is the mobile phone access folder. the mobile phone Template resources are in the m folder. In addition, the m folder contains index. php, list. php, and view. php. when we access the mobile site, we actually access these three files and dynamically access the mobile site.

So if you want to use your computer to check your mobile phone station, you can access: http: // your domain name/m to view the mobile phone website.

(4) settings in the pc Template

When we use a mobile phone to access a website, it will automatically jump to the mobile phone template, which requires adding js code to the pc template to jump. InAdd code.

* Add the following code to the homepage template:

The code is as follows:

 

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: info-contact@alibabacloud.com 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.