เพิ่มองค์ประกอบหน้า ตอนที่ 4 : เมนู "ป้ายกำกับ" "ฟีด" และ "HTML/จาวาสคริป"

สวัสดีครับ เพื่อนๆ มาต่อกันในตอนที่ 4 (สามารถติดตามตอนที่ผ่านมาจากลิ้งค์นี้ครับ) กับเมนูขององค์ประอบ 3 ตัวต่อมาคือ "ป้ายกำกับ" "ฟีด" และ "HTML/จาวาสคริป" ซึ่งบทความในตอนนี้ ตัว HTML เป็ษนพระเอกเลยครับ ยาวหน่อย ตามอ่านกันได้เลยนะครับ

เช่นเคยครับ เมื่อเราเลื่อนแถบข้างจะเห็นองค์ประกอบต่างๆ เพิ่มเคิม ปัจจุบันที่ผมเขียนบทความอยู่นี้ มีทั้งหมด 18 องค์ประกอบ หรือ gadget นั่นเอง ครับ งั้นมาดู 2 ตัวแรกต่อมาที่ผมแทบไม่ได้ใช้งานเลยครับ ยกเว้นตัวสุดท้ายที่ผมใช้ประโยชน์เป็นอย่างมาก

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

แต่สำหรับเพื่อนๆ ถ้าต้องการใช้ ก็ตามสะดวก เพราะว่าถ้ามี ก็มีข้อดีเช่นกันครับ เมื่อเพื่อนๆ กดเมนู จะมฝาที่หน้าจอดังภาพ มีให้เลือกว่า จะเรียงแถวยาวลงมา (ตามตัวอย่าง) ว่าเรียงตาม "ตัวอักษร" หรือ "ความถี่" คือ จำนวนที่มากลงไปหาน้อย สำหรับผมฬในระยะเริ่มแรกที่ใช้ องค์ประกอบนี้ ผมเลือกเรียงตามตัวอักษร เพราะใช้งานง่ายกว่าครับ

ผลที่ได้ที่ไปติดตามด้านข้างของบล็อก ก็จะมฝีลักษณะนี้ ก็อย่างที่ผมบอกคือ ถ้าบทความของผมมีเป็นร้อยบทความ แต่ละบทความก็มี คำสำคัญ 5-7 คำ ทีนี้ ป้ายกำกับที่แสดงคำสำคัญนี้ คงยาวเป็นหางว่าวแน่นอนครับ ดังนั้น องค์ประกอบนี้ ก็สุดแท้แล้วแต่เพื่อนๆ นะครับ

องค์ประกอบ "ฟีด" หรือ Feed เป็นองค์ประกอบที่ผมไม่เคยใช้เลย ผมแทบไม่มีความรู้เรื่อง Feed ดังนั้นในส่วนขององค์ประกอบนี้ ผมคงต้องขอโทษเพื่อนๆ ที่ไม่มีความรู้จริงๆ แต่เท่าที่พอจะเข้าใจก็คงเป็นในลักษณะที่ว่า เหมือนเราสนใจบทความของบล็อกไหน ก็เอามาติดตามครับ

เมื่อกดเมนู จะเห็นหน้าจอนี้ จากนั้นก็นำ URL ของฟีด ที่ต้องการติดตามมาวาง แล้วก็บันทึก อย่างไรก็ดี ถ้าเพื่อนๆ ท่านใดมีความรู้เรื่องนี้ สามารถแนะนำได้เลยนะครับ ที่พื้นที่ "แสดงความคิดเห็น" ท้ายบทความ จักขอบพระคุณยิ่งครับ

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

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

ตัวอย่างนี้ ผมขอเอาตัวอย่างการใช้งานองค์ประกอบ "HTML/จาวาสคริป" มาจากบล็อกของผมเรื่อง ความพิการที่ชื่อ Preeda Station (http://preedastation.blogspot.com/) มาให้ดูกันครับ

ผมตัดภาพให้ดูใกล้ๆ จะเห็นทั้งหมด 4 ตัวอย่างในภาพนี้นะครับ คือ

1. การเสริช์ค้นหาของ Google
2. กรอบพื้นที่สีน้ำเงินเล็กๆ เป็นสถิตินับจำนวนคนเข้าชมบล็อก
3. นาฬิกาแบบดิจิตอล
4. สถิติแบบแสดงเป็นธงชาติ (ซึ่งผมนำมาตกแต่งทีหลัง คือหลังจากข้อ 2 ครับ)

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

ส่วนในข้อ 4 นั้น ผมต้องใส่หัวข้อ คือ แจ้งว่า ผมเริ่มใช้สถิติแสดงผู้เยี่ยมชมที่มาจากต่างประเทศ เป็นธงชาติ เมื่อสถิติรวมต่างๆ ของสถิติเดิม (สีน้ำเงิน หรือข้อ 2) นั้น เป็นตัวงเลขเท่าไหร่แล้ว ผู้อ่านจะได้เข้าใจ เพราะเห็นสถิติรวมต่างกัน

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

ทั้ง 4 ตัวอย่างบนภาพนี้ ก็เป็นตัวอย่างของการใช้ องค์ประกอบ "HTML/จาวาสคริป" นะครับ ซึ่งผมวางอยู่ท้ายบทความครับ

นี่ก็เป็นอีกตัวอย่างหนึ่งที่ ทางผมทำขึ้นมาเอง จะเป็นภาพที่มีตัวอักษรเปลี่ยนแปลง คล้ายแบนเนอร์ ทางโปรแกรมเมอร์ทำให้ครับ เป็นไฟล์ภาพ จากนั้นผมก็เอามาวางในโค้ด HTML ซึ่งเป็นโค้ดลักษณะ กดที่ภาพก็ให้ไปสู่หน้าเว็บไซต์ที่ต้องการได้เลยทันที เดี๋ยวผมะยกตัวอย่างสุดท้ายเลยนะครับ

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

ผมลองกดลิ้งค์ให้ดูนะครับ (คือกดที่สัญลักษณ์ ประแจ ไขว้กับ ไขควง) เพื่อนๆ จะเห็น HTML โค้ด ที่ "เมื่อกดที่ภาพแล้วจะไปยังอีกหน้าเว็บไซต์ที่ลิ้งค์ไว้" ครับ ถ้าเพื่อนๆ อยากทราบโค้ด ก็ลองขยายภาพแล้วดูไปพลางๆ ก๋อน แล้วในบทต่อๆ ไป ผมจะนำมาขยายความให้เห็นถึงประโยชน์ที่มากกว่านี้ครับ ยังมีลูกเล่นอะไรน่าสนใจอีกมากมายครับ

แต่ก่อนจะจบบทความนี้ เบื้องต้นจะแจ้งให้ทราบว่า ความรู้เรื่อง HTML โค้ดที่กดภาพแล้วไปที่หน้าเว็บอื่นได้นั้น ผมเล่นตอนที่ยังไมฝ่มีความรู้ ซึ่งถ้าง่ายๆ แค่นี้ ก็มีอยู่แล้วใน องค์ประกอบ "รูปภาพ" ครับ ดังนั้นในเบื้องต้น ถ้าเพื่อนๆ พึ่งเริ่มศึกษา ก็ไม่ต้องไปซีเรีนสอะไรนะครับ อ่านไปเรื่อยๆ ก็จะเข้าใจเอง ที่สำคัยต้อง

หมั่นเล่น หมั่นศึกษา วันละนิด วันละหน่อย เหมือนผมก็ได้ครับ ถึงจะไม่ค่อยรู้เรื่อง ก็คลำทางไป เดี๋ยวก็เป็นเองครับ จากนี้ไป องค์ประกอบต่างๆ ที่เหลือนั้น สำคัญๆ ทั้งนั้นนะครับ ติดตามอ่านต่อไปนะครับ

ขอบคุณครับ

ปรีดา ลิ้มนนทกุล
(ผู้ทุพพลภาพมืออาชีพ)