วิธีสร้าง CSS Menu บน Blogger ด้วยโปรแกรมสำเร็จรูป


CSSmenu

บทความนี้ผมขอแนะนำวิธีสร้างเมนูโดยใช้โปรแกรมสำเร็จรูป ที่ชื่อว่า CSS Tab Designer 2 โปรแกรมนี้อยู่ในช่วงพัฒนาทางผู้ผลิตจึงให้เราสามารถใช้งานได้แบบฟรี ๆ

เกี่ยวกับโปรแกรมนั้นผมจะไม่ขอกล่าวถึง และขอเลือกกล่าวถึงวิธีการใช้งาน และประโยชน์ที่ได้จากการใช้สำหรับ Blogger เท่านั้น ซึ่งถ้าหากใครต้องการสร้างเมนูสวยๆ ให้กับบล็อกของตนเองก็ขอเชิญติดตามอ่านต่อกันได้เลยครับ

การสอนของผมจะแบ่งเป็น 2 ตอน คือ
ตอนที่ 1 การสร้างเมนู
ตอนที่ 2 การนำเมนูที่สร้างมาใส่ในบล็อกของเรา


ตอนที่ 1

1. เริ่มต้นใช้งาน CSS Tab Designer 2 ให้สมาชิกไปดาวน์โหลด โปรแกรม ดาวน์โหลด CSS Tab Designer 2 >> http://www.mediafire.com/?al1ylzth0zz

2. ลงโปรแกรมให้เสร็จเรียบร้อย โดยใช้วิธี NNF (Next Next… Finish ลูกเดียว)

3. เมื่อลงโปรแกรมเสร็จสิ้น และเปิดโปรแกรมขึ้นมาทุกคนจะพบกับหน้าต่างนี้


CSS tab menu1
ให้คลิกที่ข้อความ Fill with sample เช่นเดียวกับรูปด้านบน เพื่อให้มีการแสดงตัวอย่างเมนูที่เราเลือก

4. จากนั้นให้คลิกเลือกเมนูที่ตนเองถูกใจ (มีทั้งแนวตั้งและแนวนอน) เช่น ในที่นี้ผมเลือก
    Tab Menu E ตัวอย่างก็จะปรากฎขึ้นมาดังนี้


CSS tab menu2

5. ให้ทุกคนมองทางซ้ายมือ แล้วจะเห็นข้อความ 1 ชุด

cssTABMENU3

ซึ่งก็คือข้อความที่ปรากฎบนเมนูนั่นเอง เราสามารถปรับแก้ได้ตามใจชอบครับ (ถ้าไม่แก้ในขั้นนี้ก็ยังสามารถแก้ภายหลังได้ครับ) สำหรับการแก้ไขนั้นทำได้ดังนี้ครับ


เครื่องมือ
ใช้งาน
ภาพประกอบ

cssTABMENU2
 

ใช้สำหรับเพิ่มเมนูคราวละหลายๆ เมนู



cssTABMENU4

ใช้เมื่อต้องการเพิ่มเมนู ซึ่งถ้าเรากด 1 ครั้งก็จะเพิ่มได้ 1 เมนู

2010-01-02_095415

cssTABMENU5

ใช้เมื่อต้องการลบเมนูที่ไม่ต้องการ


cssTABMENU6


ใช้เมื่อต้องการสลับที่ระหว่างเมนู


cssTABMENU7



ใช้เมื่อต้องการแก้ไขเมนูที่มีอยู่แล้ว

cssTABMENU8


6. เมื่อเลือกเมนูและปรับแต่งได้ถูกใจแล้วต่อไปก็เป็นการสร้างโค้ด  ซึ่งในการนำโค้ดไปใช้กับ blogger นั้น   เราต้องการ 2 ส่วน คือ CSS และ HTML

6.1 สร้าง HTML และ รูปภาพ ที่จะต้องใช้ในการสร้างเมนู ทำโดยคลิกที่ Generate HTML & Image

cssTABMENU


6.2 เลือกบันทึกไฟล์และตั้งชื่อในที่ๆ หาเจอได้ง่ายที่สุด ซึ่งถ้าคลิก Generate แล้ว จะได้ไฟล์ดังรูป

CSS tab menu7

6.3 ในขั้นนี้ให้นำรูปที่ได้ไปฝากไฟล์กับ free Host ที่รับฝากรูป ถ้านึกไม่ออก แนะนำที่นี่ หรือ ใช้วิธีนี้
      ส่วนไฟล์ .html นั้นไม่จำเป็นต้องใช้

6.4 ต่อไปให้คลิกที่แถบ code ที่ด้านล่างของหน้าต่างโปรแกรม (ดูรูป)

CSS tab menu4

เมื่อคลิกแถบดังกล่าวแล้วแล้วเราก็จะเห็นทั้ง CSS และ HTML ซึ่งปนกันอยู่


6.5 ให้เลือกคัดลอก CSS โค้ด เฉพาะส่วนที่เริ่มต้นจาก ชื่อของเมนู เช่น ในที่นี้ผมเลือก Tab Menu E ผมจึงจะคัดลอก CSS ตั้งแต่ชื่อเมนู จนถึงโค้ด


-->
</style>


ดูรูปประกอบ

cssTABMENU


ซึ่งจะได้โค้ดตัวอย่างดังนี้


/*- Menu Tabs E--------------------------- */
    #tabsE {
      float:left;
      width:100%;
      background:#000;
      font-size:93%;
      line-height:normal;
      }
    #tabsE ul {
        margin:0;
        padding:10px 10px 0 50px;
        list-style:none;
      }
    #tabsE li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsE a {
      float:left;
      background:url("tableftE.gif") no-repeat left top;
      margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabsE a span {
      float:left;
      display:block;
      background:url("tabrightE.gif") no-repeat right top;
      padding:5px 15px 4px 6px;
      color:#FFF;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsE a span {float:none;}
    /* End IE5-Mac hack */
    #tabsE a:hover span {
      color:#FFF;
      }
    #tabsE a:hover {
      background-position:0% -42px;
      }
    #tabsE a:hover span {
      background-position:100% -42px;
      }
        #tabsE #current a {
                background-position:0% -42px;
        }
        #tabsE #current a span {
                background-position:100% -42px;
        }


โค้ดที่ได้ถือว่ายังไม่สมบูรณ์ จนกว่าจะเติม URL ของรูปภาพ (โค้ดสีแดง) ที่ได้ทำการฝากไว้ในข้อ 6.3 ก่อนหน้านี้แล้ว

6.6 ต่อไปเราจะเลือกคัดลอก HTML โค้ด โดยวิธีเลือกให้คัดลอกโค้ดที่ถัดจาก

<h2>…………….แต่ละเมนูจะต่างกัน……………………</h2>

จนกระทั่งถึงโค้ด(ดูรูปประกอบ)

</body>


cssTABMENU1


ซึ่งในตัวอย่างนี้ผมก็จะได้โค้ดเป็น


<div id="tabsE">
                                <ul>
                                        <!-- CSS Tabs -->
<li id="current" ><a href="ใส่ URL"><span>Home</span></a></li>
<li><a href="ใส่ URL"><span>Products</span></a></li>
<li><a href="ใส่ URL"><span>Services</span></a></li>
<li><a href="ใส่ URL"><span>Support</span></a></li>
<li><a href="ใส่ URL"><span>Order</span></a></li>
<li><a href="ใส่ URL"><span>News</span></a></li>
<li><a href="ใส่ URL"><span>About</span></a></li>
                                </ul>
</div>



เมื่อจบขั้นนี้ถือว่าเราได้สร้างโค้ด CSS และ HTML ของเมนูเรียบร้อยแล้ว






ตอนที่ 2

ต่อไปเป็นการนำโค้ดมาใช้กับ blogger

7. ไปที่แผงควบคุม >> รูปแบบ  >> แก้ไข HTML  >> ไม่ต้องขยายแม่แบบเครื่องมือ  >> ค้นหาโค้ด ]]></b:skin> แล้ววาง CSS ที่เตรียมไว้ ก่อนหน้าโค้ดดังกล่าว

CSS tab menu8

8. ต่อไปเป็นการนำ HTML ที่เตรียมไวในขั้น 6.6 วางลงใน template โดยตำแหน่งของการวางนั้นขึ้นอยู่กับเมนูที่เราสร้าง

8.1 ถ้าเลือกเมนูแนวนอน :ให้ค้นหาโค้ด

<div id='container'>
หรือ
<div id='content-wrapper'>
หรือ
<div id='main-wrapper'>

ซึ่งขึ้นอยู่กับแต่ละ Template


แล้ววาง HTML โค้ด  ลงก่อนหน้าโค้ดดังกล่าว

8.2 หรือถ้าเลือกเมนูแนวตั้ง เราก็อาจจะวางไว้ที่ side bar ซึ่งสามารถทำได้โดยการวาง HTML โค้ดในข้อที่ 6.6 ลงถัดจากโค้ด

<div id='sidebar-wrapper'>

เมื่อวางโค้ดดังกล่าวแล้วให้ทำการ แสดงตัวอย่าง ว่ารูปแบบเมนู และตำแหน่งเป็นที่น่าพอใจหรือไม่ ถ้าหากพึงพอใจแล้วก็บันทึกแม่แบบ ถือเป็นการจบขั้นตอนครับ

หมายเหตุ หากใน Template ของคุณมีเมนู อยู่แล้ว ควรจะทำการลบเมนูเก่าทิ้งไปให้หมดเสียก่อน  ก่อนที่จะติดตั้งเมนูชนิดใหม่ลงไป

สำหรับบทความต่อไป ผมจะนำเสนอการสร้าง CSS เมนูแบบ Online แล้วนำมาติดตั้งบน blogger อย่าลืมติดตามอ่านกันนะครับ  สำหรับบทความนี้ถ้าขาดตกบกพร่องยังไงก็สามารถสอบถามเพิ่มเติมกันได้เลยครับ 

ตอนนี้มีความคิดเห็น : 64 ความคิดเห็น
หากคุณมีปัญหาหรือข้อสงสัยใดๆ สามารถสอบถามได้จากกล่อง comment ด้านล่างนี้ได้เลยครับ

  1. Nice Blog

  1. เยี่ยมเลยครับ
    Thank you เลย.

  1. ขอบคุนมากเรยน๊าค่ะ
    สำหรับบทความนี่
    ...

  1. เจ๋งครับ

  1. เซฟรูปไม่ได้อ่ะครับ

  1. ขอบคุณครับ... แต่ก็งงๆอยู่ มือใหม่ครับ ...(ไม่มีพื้นฐาน แต่อยากทำ)

  1. ขอบคุณ คุณ yamemo มากครับที่แวะมาเยี่ยมชม ติดขัดเรื่องใดสอบถามได้ครับ

  1. แล้วจะไปแก้ไขชื่อเมนูภายหลังได้งัยครับ
    http://art-in-faith.blogspot.com/

  1. @ Tommaso Phakk : แก้โค้ดสีแดงในขั้นตอน 6.6 ครับ

  1. เอาไฟล์mp3ลงยังไงครับ คือผมมีเพลงของตัวเองจะไว้บนเวปตัวเองอะ

  1. @ คุณ joelam : ที่ถามไม่เกี่ยวกับบทความนี้เลยนะครับ ลองดูในหมวดนี้ครับ
    http://www.hackublog.com/2010/05/easy-install-yahoo-mediaplayer-on.html.
    http://www.hackublog.com/2010/01/mp3.html

  1. ผมไม่เข้า ใจ ตรง Copy โค็ด แล้วไป ไว้ ไหน อะ ครับ งงๆ อยู่

  1. @ ViPerGTA : ถ้าทำให้โค้ดสมบูรณ์ตามตอนที่ 1 แล้ว อาจจะคัดลอกเก็บไว้ที่ notepad ในคอมพิวเตอร์ก่อนก็ได้ครับ จากนั้นก้เอามาวางในตำแหน่งที่แนะนำไว้ตามข้อ 8 ครับ

    นั่นคือ CSS หรือโค้ดในข้อ 6.5 ให้วางเอาไว้ก่อนหน้าโค้ด ]]></b:skin>

    และโค้ดในข้อ 6.6 ให้วางเอาไว้ในตำแหน่ง ก่อนหน้าโค้ด

    <div id='container'>

    หรือ
    <div id='main-outer'>

    หรือ
    <div id='content'>
    หรือ
    <div id='main-wrapper'>

    อย่างใดอย่างหนึ่งที่พบในแม่แบบครับ (โค้ดแต่ละแม่แบบไม่เหมือนกันแต่จะคล้าย ๆ ที่พูดให้ฟังนี่แหละครับ )
    ถ้าหาโค้ดไม่เจอก็มาถามอีกครั้งนะครับ

    วางโค้ดเสร็จแล้วก็บันทึกและดูผลลัพธ์ครับ

  1. ได้ ละครับ ขอบคุณ มาก ครับ



    แต่พอกด เข้าไป แล้ว มันไม่มี อะไร อ่า ครับ




    จะเข้าไปแก้ไขยังไง หรอครับ พอลง บล๊อค แล้ว

  1. รูปแบบ บล๊อค บางอัน มันไม่ เจอ โค๊ด div id อะครับ ทำยังไงหรอครับ

  1. โดยพื้นฐานภาษา HTML ในBlogger จะต้องมีการกำหนด <div id="ชื่อไอดี"> นะครับ กรณีที่ไม่เจอนี่ไม่ทราบรายละเอียดเป็นอย่างไรครับ? รายละเอียดที่ถามยังไม่ชัดเจนครับ ยังให้คำตอบไม่ได้ครับ

    ถ้าหมายถึงบล็อก http://vipergta.blogspot.com/ เท่าที่ดูตอนนี้คุณทำได้แล้วครับ

  1. รบกวนถามอีกนะครับว่า มันไม่มีโค้ด หาแล้ว มีแต่ =newhearder ไม่มี =sidebar-wrapper จะวาง html ไว้ตรงไหนครับ

  1. @ amzstation : ถ้าเป็นแม่แบบรุ่นใหม่ให้วางก่อนหน้าโค้ด
    <div class='main-outer'>

    หรือวางใน HTML Gadget ก็ได้ครับ

  1. ขอบคุณมากครับได้แล้วครับ จะรบกวนถามอีกนิดนะครับว่า ผมต้องสร้าง บล๊อกใหม่ หรือ หน้าใหม่ขึ้นมารองรับด้วยใช่ไหมครับ โดยให้เป็นไปตามหัวข้อที่เรากำหนด ผมเข้าใจถูกใช่ไหมครับ(ผมจะขายของครับ เช่น ถ้าเราสินค้า 20 ยี่ห้อ เราก็ต้องสร้าง 20 บล๊อก หรือ 20 หน้าในบล๊อก แยกตามยี่ห้อใช่ไหมครับ แล้วก็ระบุ url ให้ส่งไปตาม หน้าหรือบล๊อกของสินค้าที่เราสร้างขึ้น)

    ปล.เออ.. เปลี่ยนสีตัวหนังสือในเมนูยังไงครับ

  1. @ amzstation :
    1 เข้าใจถูกแล้วครับ แต่ที่ถามไม่เกี่ยวกับที่ถามไว้นี่ครับ ผมงงเล็กน้อย
    2 เปลี่ยนสีตัวหนังสือในเมนูก็ใช้ CSS กำหนดสีอักษร เช่น
    #menu a{color:#ffffff;}

  1. เป็นคำถามต่อเนื่อง ครับ ^ ^ ขอบคุณครับ ผมคงต้องถามอีกเยอะครับ เพราะผมว่าที่นี้คคือคำตอบของคนเริ่มต้นทำบล๊อกอย่างผม เป็นบล๊อกที่ดีมีประโยชน์มากๆ(โดยเฉพาะผมที่ไม่รุ้อะไรสักอย่าง _*_ ) ว่าแต่น่าจะเขียนเป็นหนังสือออกมานะครับ จะได้ไปซื้อ

    ปล.ถ้าผมมีคำถามแต่ไม่รุ้จะโพสถามตรงไหนที่มานตรงกับหัวข้อ ต้องทำยังไงครับจะได้โพสไม่มั่ว ผมมีคำถามอีกนิดหน่อยครับ

  1. @ amzstation : ถามที่นี่ก็ได้ครับ http://www.facebook.com/hackblog

  1. ขอโทษด้วยนะครับ ต้องมาถามที่นี้ เพราะผมหาบทความใน face book ไม่เจอครับ
    ผมจะถามว่า แทปเมนู Home บน page gadget เมือคลิกแล้วจะมาหน้าที่มีโพสเราทุกโพส เรียงไปด้านล่าง จะแก้ยังไงให้มันมีแค่บทความแรกครับ

  1. @ amzstation : ตั้งค่าแสดงบทความในหน้าแรกแค่บทความเดียวครับ
    ปล.การถามที่ Facebook ถามได้เลยครับไม่ต้องหาบทความ

  1. สุดยอดดดด เป็นข้อมูลที่ละเอียดและมีประโยชน์มากเลยค่ะ *0*

  1. ไม่เข้าใจในหัวข้อ 6.5 อ่ะค่ะ
    ว่าพอคัดลอกโค้ดแล้วจะต้องนำไปวางไว้ตรงไหนเหรอคะ พอเสร็จโค้ด CSS แล้ว ก็วางโค้ดในเว็บฝากรูปต่อกัน แล้วจึงวางโค้ด HTML ใช่มั้ยคะ

    ไม่แน่ใจว่าเข้าใจถูกรึเปล่ายังไงช่วยตอบหน่อยนะคะ -*-

  1. @ BlackPearL : ในขั้นที่ 6.5 ให้คัดลอกไปวางไว้ใน Notepad หรือ wordpad ในคอมของคุณก่อนครับ

  1. เยี่ยมที่สุดเลย ถึงอ่านแล้วตัวผมจะมึนๆ แต่ก็พยายามศึกษาตามที่ สอนให้ครับ

  1. สร้างเมนูได้แล้ว ใส่ลิ้งแล้ว ทำไมยังกดเมนูไม่ได้อะคะ

  1. @ YingZiin : แก้ไขโค้ดในขั้นที่ 6.5 ให้ถูกต้องครับ ถ้ามั่นใจว่าแก้ถูกแล้วลองโพสโค้ดให้ดูนิดนึงจะได้หรือเปล่าครับ

  1. รบกวนด้วยนะคะ ขอบคุณมากๆค่ะ


    *- Menu Tabs H--------------------------- */

    #tabsH {
    float:left;
    width:100%;
    background:#000;
    font-size:93%;
    line-height:normal;
    }
    #tabsH ul {
    margin:0;
    padding:10px 10px 0 50px;
    list-style:none;
    }
    #tabsH li {
    display:inline;
    margin:0;
    padding:0;
    }
    #tabsH a {
    float:left;
    background:url("http://lh4.ggpht.com/_Zg9v1a0zT9E/TJR63EKLNEI/AAAAAAAAAsU/17Y_hskeY0Q/tableftH.gif") no-repeat left top;
    margin:0;
    padding:0 0 0 4px;
    text-decoration:none;
    }
    #tabsH a span {
    float:left;
    display:block;
    background:url("http://lh6.ggpht.com/_Zg9v1a0zT9E/TJR63FlZWjI/AAAAAAAAAsY/_Daww9MThlk/tabrightH.gif") no-repeat right top;
    padding:5px 15px 4px 6px;
    color:#FFF;
    }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsH a span {float:none;}
    /* End IE5-Mac hack */
    #tabsH a:hover span {
    color:#FFF;
    }
    #tabsH a:hover {
    background-position:0% -42px;
    }
    #tabsH a:hover span {
    background-position:100% -42px;
    }

    #tabsH #current a {
    background-position:0% -42px;
    }
    #tabsH #current a span {
    background-position:100% -42px;
    }
    ]]>
    ====================================================

    <div id='tabsH'>
    <ul>
    <!-- CSS Tabs -->
    <li id='current'><a href='http://yingziin.blogspot.com/2010/09/welcome-to-my-blog-oo.html'><span>Home</span></a></li>
    <li><a href='http://yingziin.blogspot.com/search/label/iGadget'><span>iGadget</span></a></li>
    <li><a href='http://yingziin.blogspot.com/search/label/Me%20Health'><span>iHealth</span></a></li>
    <li><a href='http://yingziin.blogspot.com/search/label/my%20mind%20mood'><span>iLife</span></a></li>
    <li><a href='http://yingziin.blogspot.com/search/label/iBeauty'><span>iBeauty/Fashion</span></a></li>
    <li><a href='About.html'><span>About me</span></a></li>

    </ul>
    </div>
    <div class='main-outer'>

  1. รบกวนด้วยนะคะ ลองกดจากใน CSS ก็ลิ้งค์ไปอยู่นะคะ แต่ทำไมใน blog ไม่ได้ค่ะ

    http://yingziin.blogspot.com/

    /*- Menu Tabs H--------------------------- */

    #tabsH {
    float:left;
    width:100%;
    background:#000;
    font-size:93%;
    line-height:normal;
    }
    #tabsH ul {
    margin:0;
    padding:10px 10px 0 50px;
    list-style:none;
    }
    #tabsH li {
    display:inline;
    margin:0;
    padding:0;
    }
    #tabsH a {
    float:left;
    background:url("http://4.bp.blogspot.com/_Zg9v1a0zT9E/TJTHnTDXMBI/AAAAAAAAAsc/DqhNWbZ0jTg/s1600/tableftH.gif") no-repeat left top;
    margin:0;
    padding:0 0 0 4px;
    text-decoration:none;
    }
    #tabsH a span {
    float:left;
    display:block;
    background:url("http://1.bp.blogspot.com/_Zg9v1a0zT9E/TJTHoqtSqNI/AAAAAAAAAsg/CdMR3R0wgDg/s1600/tabrightH.gif") no-repeat right top;
    padding:5px 15px 4px 6px;
    color:#FFF;
    }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsH a span {float:none;}
    /* End IE5-Mac hack */
    #tabsH a:hover span {
    color:#FFF;
    }
    #tabsH a:hover {
    background-position:0% -42px;
    }
    #tabsH a:hover span {
    background-position:100% -42px;
    }

    #tabsH #current a {
    background-position:0% -42px;
    }
    #tabsH #current a span {
    background-position:100% -42px;
    }

  1. โพส โค้ดไปแล้วนะคะ เมื่อกี้ยังเห็นอยุ่เลย ตอนนี้หายไปไหนแล้วหงะ
    ตอนที่ลองกดในโปรแกรม CSS ก็ลิ้งไปอยู่นะคะ

    รบกวนด้วยนะคะ ขอบคุณมากค่ะ

  1. สวัสดีค่ะ คุณ Hackublog หญิงจะมาบอกว่า ทำได้แล้วนะคะ เอาโค้ด HTML ไปใส่ที่ HTML GADGET แทนค่ะ แล้วก็ลบโค้ด HTML ใน แก้ไข HTML ออกค่ะ ตอนนี้ลิ้งค์ได้แล้วค่ะ ขอบคุณนะคะ

  1. มีแต่ทำเมนูภาษาอังกฤษเหรอ ครับ
    ผมพิมพ์ไทยลงไปแล้วเป็นภาษาต่างดาว อะครับ

  1. ขอบคุณมาก ๆ ๆๆ ๆๆๆๆ นะคะ ทำได้แล้ว ดีใจจริง ๆ ค่ะ

  1. อยากทำฟร์อมสั่งสินค้าแบบให้ลึงค์ไปยังเมลล์ของเรา ความรู้ไม่ถึงอยากรบกวนช่วยหน่อยคับ

  1. @ ThaiPX2012 : ศึกษาจากบทความนี้ครับ

    http://www.hackublog.com/2010/07/google-docs-showcase-create-oder-form.html

  1. ผมใส่ CSS Tab Designer2 เข้าไป 2 อัน คือ แบบแนวนอนและแนวตั้ง
    ตอนใส่อันเดียวไม่มีปัญหาอะไร แต่พอใส่โค้ด #Menu....เข้าไปอีกอัน
    ทำให้ภาพในส่วนหัวของ Widget ไม่แสดงคับ อยากทราบว่าต้องแก้ไขเช่นไรคับ
    หรือว่าสามารถใส่ CSS Tab Designer2 ได้แค่อันเดียวคับ

  1. ผมรู้แล้วคับ การที่เอาโค้ดปรับแต่ง Widget กับโค้ด CSS Tab Designer2 ไว้ติดกันจะทำให้
    รูปภาพที่เราปรับแต่ง Widget ไม่แสดง เพราะผมลองย้ายไปอยู่ห่างกัน จึงทำให้ภาพที่ปรับแต่ง Widget แสดงคับ

  1. ขอสอบถามเกี่ยวกับ CSS Tab Designer หน่อยคับคือว่าปุ่ม (Generate HTML & images) มันโชว์เฉพาะ
    (Generate HTML)ไม่มี &images คับพอกด Generate HTML มันก็มาแต่ไฟล์ HTML ลงโปรแกรมตอนแรกเห็นอยู่คับ
    แต่ไม่รู้ไปทำอะไรกับมันถึงหายไปลงใหม่หลายรอบก็ยังเหมือนเดิมคับพี่ช่วยแนะนำหน่อยคับ ผมงงมากเลยคับลองหาตั้งค่าดูก็หาไม่เจอ ขอบพระคุณล่วงหน้านะคับ

  1. @kmusic-box : ลงอีกรอบนะครับ แล้วคราวนี้ใช้โปรแกรม youuninstaller หรือ revouninstaller ถอนรากถอนโคนออกให้หมดเลยครับ จากนั้นก็ลงอีกรอบ วิธีนี้แก้ปัญหาง่ายที่สุดและน่าจะใช้ได้นะครับ

  1. หาโค๊ดตามข้อ8ไม่เจอค่ะ

  1. @~✖lด็กสOeดาว✖~ : ถ้าเป็นแม่แบบรุ่นใหม่ให้ติดตั้ง Gadget หน้าเว็บครับ

    แต่ถ้าเป็นแม่แบบที่ดาวน์โหลดมาใช้ก็ปรับแต่งโโยแนวทางตามบทความนี้ครับ

  1. ผมลองแล้วคับแต่ยังไม่ได้เหมือนเดิมคับ ตัดสินใจลงวินโดว์ใหม่เลยก็ยังไม่หายอีกงงไปใหญเลยคับ ผมกลับไปโหลดใหม่ตามลิงค์http://www.mediafire.com/?al1ylzth0zz ที่พี่แนะนำคับไฟล์ได้มา 1.35MB install แล้วเป็นเหมือนเดิมไปลองตามหาโหลดจากเว็บอื่นๆก็เป็นเหมือนกันจนไปเจอลิงค์นี้ http://www.highdots.com/products/css-tab-designer ไฟล์ได้มา 1.45MB install ไปแล้วใช้ได้เลยคับมันเกี่ยวอะไรกับไฟล์หรือเปล่าคับแล้วทำไมเมื่อก่อนผมโหลดตามลิงค์ที่พี่แนะนำทำไมถึงใช้ได้คับ ? ปัญหาอย่างงี้มันเป็นเพราะอะไรคับผมใช้ windown7 ขอคำแนะนำสักหน่อยคับผม.

  1. ความคิดเห็นนี้ถูกผู้เขียนลบ
  1. ขอบคุณมากครับ

  1. <div id='container'>
    หรือ
    <div id='content-wrapper'>
    หรือ
    <div id='main-wrapper'>
    ผมหาโค๊ดตัวนี้ไม่เจอคับ หาหลายรอบและคับ

  1. ที่ถามทำได้และคับ พอดีอ่านบทความที่คุยกัน จนเข้าใจและทำได้และคับ แต้งคับ จะมารบกวนใหม่ เพราะว่าพึงเริ่มเขียน คงรบกวนอีกเยอะเลยคับ

  1. ทำตามขั้นตอนแล้วแต่ปรากฏว่าตัวแท็บเมนูยาวเกินหน้าเดิมของแม่แบบแก้ไขยังไงค่ะ ขอบคุณล่วงหน้าสำหรับคำตอบด้วยค่ะ

  1. ลองแก้ดูไปแบบมั่วๆในแก้ไข HTML ตรง% ความกว้างของTab แต่อยากจะเลื่อนตำแหน่งtab มาอยู่ประมาณกลางๆ blog และเลื่อน side bar เข้ามาทางซ้ายอีกนิดให้เหมือนก่อนวางtab ต้องแก้ยังไงบ้างค่ะ รบกวนชี้แนะด้วยค่ะ http://afrosgirl.blogspot.com/

  1. ผมทำเมนูเป็นแนวนอนผมหาข้อความเหล่านี้ไ่้ม่เจอเลยครับ
    <div id='container'>
    หรือ
    <div id='content-wrapper'>
    หรือ
    <div id='main-wrapper'>

  1. มีธีมสำหรับเว็บหนังไหมครับแบบ www.thaimovie3g.com บางหรือเปล่า

  1. ยากมากๆๆๆ

  1. รูปที่ฝากไว้ใน upic.me เหมื่อของอาจารย์ มี2ภาพ ได้URL ทั้ง2ภาพแล้วจะเติมลงใน CSS และ HTML ที่ทำสีแดงไว้อย่างไร ทั้ง 2 ภาพในที่เดียว หรือ เลือกภาพใดภาพหนึ่ง อีกอย่างที่ทำสีแดงไว้เติมเหมือนกันหมด ผมเข้าใจถูกหรือไม่

  1. พี่ค่ะหนูกำลังทำ อันนี้อยู่อ่ะค่ะ http://ladysocietyinthai.blogspot.com/ เพิ่งจะเริ่มทำ กำลัง งงเมนูย่อยอยู่ เช่น เมนู "เทคนิคความงาม" จะมีเมนูย่อย เช่น แต่งหน้า
    แล้วถ้าใน "แต่งหน้า" มันประกอบไปด้วยโพสต่างเกี่ยวกับเรื่องแต่งหน้า เราจะเอาโพสเหล่านั้น มาไว้ใน หัวข้อแต่งหน้าได้ยังไงอ่ะค่ะ
    ประเด็นที่จะถามคือ
    1.มันต้องใช้โค๊ดแบบไหน
    2.เอาโพสมารวมไว้ในหัวข้อแต่งหน้ายังไง

  1. แล้วถ้ามีพวกโค้ด jQuery ด้วยจะต้องทำยังไงครับ

    พอดีผมอยากจะได้แบบประมาณเมนูนี้นะครับ
    http://line25.com/tutorials/how-to-create-a-cool-animated-menu-with-jquery

  1. มันต่างจาก เพิ่ม page ยังไงคะ เพราะ ตอนนี้ สร้างเพจใหม่ แต่ เพจ จะมีแค่หน้าเดียว T^T

  1. เอ่อคือว่า งงตอนที่6.3มากค่ะ แล้วทำยังไงไฟล์ถึงจะสมบูรณ์ค่ะ

  1. เอ่อแล้วคือว่าเอาโค้ด6.6ไปวางแล้วแต่มันไม่ขึ้นอ่ะค่ะ ทำไงดี

  1. แล้วลบแถบเมนูเก่ายังไงค่ะ

  1. Pengen yang lebih seru ...
    Ayo kunjungi www.asianbet77.com
    Buktikan sendiri ..

    Real Play = Real Money

    - Bonus Promo Red Card pertandingan manapun .
    - Bonus Mixparlay .
    - Bonus Tangkasnet setiap hari .
    - New Produk Sabung Ayam ( minimal bet sangat ringan ) .
    - Referal 5 + 1 % ( seumur hidup ) .
    - Cash Back up to 10 % .
    - Bonus Royalty Rewards setiap bulan .

    untuk Informasi lebih jelasnya silahkan hubungi CS kami :
    - YM : op1_asianbet77@yahoo.com
    - EMAIL : asianbet77@yahoo.com
    - WHATSAPP : +63 905 213 7234
    - WECHAT : asianbet_77
    - SMS CENTER : +63 905 209 8162
    - PIN BB : 2B4BB06A / 28339A41

    Salam Admin ,
    http://asianbet77.com/

  1. ก็ดีนะ งงเต็ก มือหัดเต็ก

  1. ถ้าใช้เทมเพลทสำเร็จรูปจะเปลี่ยนแถบข้อความแบบข้างต้นได้ไหมคะ

แสดงความคิดเห็น

ถ้าต้องการโพส HTML ให้แปลงโค้ดที่เครื่องมือด้านล่างนี้ก่อนครับ

สร้างบล็อก Facebook SEO บล็อก Linkwheel iMacros Link Wheel