วิธีทำเมนูเหมือน discuz.net

panguy

จากภาพ



โค้ด

แบบที่ 1   ใช้โค้ดตามนี้ แล้วนำไปแก้ไขเอง

1. <div id="dzf" class="cl">
   
2. <style type="text/css">
   
3. #dzf{padding:15px 0;line-height:160%}
   
4. #dzf p{width:321px;text-indent:70px;background:url(http://www.discuz.net/data/attachment/album/201005/14/0953351hcnq10n6w4zqnwh.png) no-repeat 10px 2px}
   
5. .dzfbl{border-left:1px solid #FFF}
   
6. .dzfbr{border-right:1px solid #DDD}
   
7. #dzf em{display:block;color:#D3DFDF}
   
8. #dzf .xg2{color:#666}
   
9. #dzf em a{color:#369}
   
10. </style>
    
11. <p class="z dzfbr">
    
12.         <a href="http://zz.comsenz.com/2010zz/" target="_blank" class="xw1">2010第五届中国互联网站长年会</a>
    
13.         <em class="xg2">自强·求变，跨界实践绿色增长</em>
    
14.         <em><a href="http://www.discuz.net/thread-1591466-1-1.html" target="_blank">火热报名</a> — <a href="http://www.discuz.net/thread-1621485-1-1.html" target="_blank">来宾访谈</a> — <a href="http://www.discuz.net/thread-1613786-1-1.html" target="_blank">来宾名单</a></em>
    
15. </p>
    
16. <p class="z dzfbr dzfbl" style="background-position:10px -85px">
    
17.         <a href="http://www.discuz.net/topic-X1.html" target="_blank" class="xw1">Discuz! X1 正式版发布</a>
    
18.         <em class="xg2">帮助网站实现一站式服务</em>
    
19.         <em><a href="http://www.comsenz.com/downloads/install/discuzX1#down_open" target="_blank">下载</a> — <a href="http://faq.comsenz.com/viewnews-944" target="_blank">安装教程</a> — <a href="http://www.discuz.net/thread-1630664-1-1.html" target="_blank">常见问题</a> — <a href="http://www.discuz.net/forum-213-1.html" target="_blank">版块讨论</a></em>
    
20. </p>
    
21. <p class="z dzfbl" style="text-indent:15px;background:none">
    
22.         <em><a href="http://www.comsenz.com/purchase" target="_blank">Comsenz 产品服务购买</a> — <a href="http://idc.comsenz.com/" target="_blank">官方主机</a> — <a href="http://www.phpchina.com/html/trainsubject.html?utm_source=phpchina&utm_medium=banner&utm_campaign=item" target="_blank">PHP培训</a></em>
    
23.         <em><a href="http://www.discuz.net/thread-1268232-1-1.html" target="_blank">招贤纳士</a> — <a href="http://www.5d6d.com" target="_blank">5d6d免费论坛</a> — <a href="http://nt.discuz.net/showtopic-80777.html" target="_blank">Discuz!NT3.1发布</a></em>
    
24.         <em><a href="http://www.discuz.net/thread-1664859-1-1.html" target="_blank">Yeswan-绑定域名插件</a> — <a href="http://www.discuz.net/thread-989303-1-1.html" target="_blank">Manyou诚邀开发者加盟</a></em>
    
25. </p>
    
26. </div>

คัดลอกไปที่คลิปบอร์ด

แบบที่ 2  ทำผ่านเว็บนี้ แล้ว gen code

1. http://www.mixfog.com/xad/

คัดลอกไปที่คลิปบอร์ด

             อธิบาย วิธีทำ  จากรูป
             1. คือ แทบเมนู ซ้าย กลาง ขวา
             2. คือ url ของ icon menu
             3. คือ ชื่อเมนูหลัก ตามด้วย ลิ้ง ตามด้วย สีเมนู ตามด้วย ตัวหนา/ตัวธรรมดา ตามด้วย ขึ้นบรรทัดใหม่
             4. คือ ชื่อเมนูย่อย ตามด้วย ลิ้ง ตามด้วย สีเมนู ตามด้วย ตัวหนา/ตัวธรรมดา ตามด้วย ขึ้นบรรทัดใหม่
             5. คือ เพิ่มลิ้งค์
        ปรับแต่งเสร็จก็กดปุ่ม สีน้ำเงิน ก็จะได้โค้ด มา

วิธีนำมา ติดหน้าเว็บ

     1. admincp >>> ส่วนเสริม >>> จัดการโฆษณา
     2. เลือก แบบ 全局 頁頭二級導航欄廣告
         
     3. ตั้งชื่อ >> เลือกพื้นที่แสดง >> โค้ด >> ใส่โค้ดที่ได้มา >> ตกลง
     4. อัพเดทแคช

ตัวอย่าง จากเว็บผม


ปล. สามารถเพิ่มเมนูได้เองนะครับ  ไม่ทราบว่า งง กันไหม สอบถามได้นะครับ

ที่มา/thank

1. http://www.discuz.net/thread-1671615-1-1.html
   
2. http://www.discuz.net/forum.php?mod=viewthread&tid=1681540&extra=page%3D1%26filter%3Dtypeid%26typeid%3D250
   
3. http://www.discuz.net/thread-1628226-1-1.html
   

คัดลอกไปที่คลิปบอร์ด

Onlyones

ดูเหมือนยุ่งยากแต่น่าลองเห่อๆๆ

theerawut

แล้วตามรูปนี้หล่ะครับ ทำยังไงเอ่ย

panguy

ตอบกลับ 3# theerawut

อันนี้ก็ไม่ทราบเหมือนกันครับ กำลังหาวิธีอยู่เหมือนกัน

weratad14

ทริปดีๆๆอีกเร้วววว
ขอบคุนคับบบบ

new2007

โอ๊วอยากรู้อยู่พอดี

ขอบคุณมากครับ

ขอเก็บอีกอัน อิอิ

dsiwarsza

ขอบคุณมากเลยครับผม

jaideejung007

ต้องมีพื้นฐานด้าน HTML และ CSS ก็โอเชแล้ว

แทงค์ครับพี่กาย

kwamkid

ลองใช้แล้วสวยดีครับ ขอบคูณครับผม

bomwhat

ขอบคุณครับ

ปรับอีกนิดโมอีกหน่อยสวยงามมากครับ