DedeCMS tutorial 5. add horizontal navigation to the top. This section uses the DedeCMS default style as an example. If your site is not using the default template, you must modify it flexibly.
1. In the default DedeCMS style, there is a paragraph on the left of the top "zhimeng CMS-easily build the site from now on! ", Many friends want to change this line to a horizontal logon box, just like the top of dedecms8.com.
Figure DedeCMS tutorial 5-1
2. Open the public template file templets/default/head.htm in the header and find the following Chinese characters:
Figure DedeCMS tutorial 5-2
Replace the Chinese character with the following code:
<Div id = "_ userlogin">
<Form name = "userlogin" action = "{dede: global. pai_memberurl/}/index_do.php" method = "POST">
<Input type = "hidden" name = "dopost" value = "login"/>
<Span> User name: </span>
<Input type = "text" name = "userid" size = "10" class = "ipt-txt"/>
<Span> password: </span>
<Input type = "password" name = "pwd" size = "10" class = "ipt-txt"/>
{Dede: php}
If (preg_match ("#2 #", $ safe_gdopen )){
Echo'
<Span> Verification Code: </span>
<Input type = "text" name = "vdcode" size = "8" class = "ipt-txt"/>
';}
{/Dede: php}
<Button type = "submit" class = "btn-1"> login </button>
<A href = "{dede: global. cmd_memberurl/}/index_do.php? Fmdo = user & dopost = regnew "> register an account </a> <a href =" {dede: global. Alibaba _memberurl/}/resetpassword. php "> forgot password? </A>
</Form>
</Div>
<Script language = "javascript" type = "text/javascript"> CheckLogin (); </script>
After modification:
Figure DedeCMS tutorial 5-3
In fact, this code is not enough. The following code is required to help achieve the effect:
| <Script language = "javascript" type = "text/javascript" src = "{dede: global. cfg_cmsurl/}/include/dedeajax2.js "> </script> <script language =" javascript "type =" text/javascript "> <! -- Function CheckLogin () {var taget_obj = document. getElementById ('_ userlogin'); myajax = new DedeAjax (taget_obj, false, false, ''); myajax. sendGet2 ("{dede: global. pai_cmspath/}/member/ajax_loginsta.php "); DedeXHTTP = null ;}--> </script> |
So why didn't I add this code here? This is because the code is included in the "index.htm" template file of the primary page. If no one exists or is deleted by the operator, please refer to index.htm before.
3. Open the member/ajax_loginsta.php file and find the following code,
Figure DedeCMS tutorial 5-4
The code in the red box indicates that user information is returned after logon is successful. Most of the time, the navigation on the top is not too wide to display the data. It is unnecessary for all the information to be returned. You can reduce the number of items and beautify the div, to provide a beautiful experience. Here, make the following adjustments:
Figure DedeCMS tutorial 5-5
Download the attachment: www.dedecms8.com/dedecms/dedecms-ad/41032_2.html
After the update is generated, you can see the following results:
Figure DedeCMS tutorial 5-6
OK, so that a horizontal logon box on the top is created. For more information, see [zhimeng]. Thank you for your cooperation. Welcome to join DedeCMS8-QQ group: 63671447 exchange learning.