สร้าง drop down เมนูใน blogspot

Written By Aucharaporn Theemcle on วันอาทิตย์ที่ 27 มิถุนายน พ.ศ. 2553 | 08:44

บางบล็อกที่เมนูด้านข้างของบล็อกมี gadget ให้เพิ่มจนยาวเหยียดดูแล้วก็ไม่งามตา วันนี้มี drop down เมนูมานำเสนอค่ะ ทำให้เรามีลิงค์ครบทุกที่ ที่อยากจะเพิ่มแต่ไม่กินเนื้อที่ด้านข้างของบล็อก สวย ๆ เก๋ ๆ ไปอีกแบบ วิธีการสร้าง drop down เมนูก็ไม่ยากทำโดยการเพิ่ม gadget html ลงไปเท่านั้น เอาหล่ะตามมาเลยดีกว่า

วิธีการสร้าง drop down เมนู

1. ให้เพื่อน ๆ login ไปที่ blogger ค่ะ ไปที่ การตั้งค่า>การออกแบบ>องค์ประกอบของหน้า การตั้งค่าบล็อก
2. หลังจากนั้นคลิีกเลือก เพิ่ม gadget ในบริเวณที่เพื่อน ๆ ต้องการเพิ่ม drop down โดยเพิ่มเป็น gadget html/javascript
add_gadget_blogspot
3. copy code ด้านล่างนี้
<form><select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_blank')"
size=1 name=menu>
<option>- Your Menu Title -</option>
<!-- Change the following links to your own -->
<option value="ที่อยู่ url บล็อกของเพื่อนๆ">=ชื่อlink</option>
<option value="http://URL of link2">Link 2</option>
<option value="http://URL of link3">Link 3</option>
<option value="http://URL of link4">Link 4</option>
<option value="http://URL of link5">Link 5</option>
<option value=”http://introduction-blogger.blogspot.com”>ชวนเพื่อนเขียนบล็อก</option>
</select></form>
โดยเปลี่ยนบริเวณที่เป็นตัวอักษรสีแดง
Your menu title = ให้ใส่เป็นเมนูของ drop down เมนูของเพื่อน ๆ
ที่อยู่ url บล้อกหรือlink ที่ต้องการสร้าง drop down เมนู จะสร้างกี่ลิงค์ก็แล้วแต่ ส่วนลิงค์ท้ายสุดนั่น แฮ่ ๆ แอบแปะลิงค์ชวนเพื่อนเขียนบล็อกเข้าไปด้วย  ลบออกก็ได้จ๊ะ หรือใครจะคงไว้ก็ขอกราบขอบพระคุณอย่างสูง
_blank นั่นคือต้องการให้เปิดลิงค์ในหน้าใหม่เป็น new windows  หากต้องการเปิดในหน้าต่างเดิมเปลี่ยนจาก _blank เป็น _self ค่ะ
 gadgethtml/javascript
3. หลังจากแก้ไข code วางแล้วให้บันทึกผล
4. หลังจากนั้นมาดูการแสดงผลของบล็อกโดยไปที่ ดูบล็อก
drop_down_menu_blogspot
เป็นไงคะปรับแต่งได้ถูกใจกันหรือยัง วันนี้ขอให้สนุกกับการปรับแต่งบล็อกนะคะ  bye จ๊ะ
ขอบคุณข้อมูลจาก blogknowhow



8 comments:

โกศล กล่าวว่า...

สวัสดีครับ

บล็อกนี้เนื้อหาดี ให้ความรู้แก่ผู้เริ่มต้นได้ดี ขอสนับสนุนให้กำลังใจในการสร้างสรรค์ต่อไปครับ

meesubandmeesuk กล่าวว่า...

ขอบคุณ คุณโกศลที่แวะมาทักทายนะคะ

smallidea กล่าวว่า...

ขอบคุณสำหรับคำแนะนำดีดี เป็นกำลังใจจ้า

MeesubandMeesuk กล่าวว่า...

ขอบคุณค่ะ คุณ smallidea ความรู้ถ้าไม่แบ่งปันจะไม่มีคนต่อยอดค่ะ

นารุโตะ online กล่าวว่า...

ขอบคุณมากครับได้ความรู้เพิ่มอีกแล้ว

เด๋วเก็บโค้ด ชวนเพื่อนเขียนบล๊อคไว้

ช่วยกันๆ

MeesubandMeesuk กล่าวว่า...

ตามสบายค่ะ คุณ นารุโตะ online

Woodythailand กล่าวว่า...

ขอบคุณมากครับเป็นประโยชน์ และติดตามบล๊อกนี้เสมอเลยครับ เวลาเขียนบล๊อก
เป็นกำลังใจให้นะครับ...อย่าทิ้งเราไปไหนด้วย อิอิ ขอบคุณครับ. :-)

Aucharaporn Theemcle กล่าวว่า...

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

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