โครงการ Workable "พิการแต่ทำงานได้" ฝึกอบรมฝึกงานคนพิการตามมาตรา 35

เพิ่มองค์ประกอบหน้า ตอนที่ 5 : เมนู "ข้อความ"

สวัสดีครับเพื่อนๆ จากตอน เพิ่มองค์ประกอบหน้า ตอนที่ 4 : เมนู "ป้ายกำกับ" "ฟีด" และ "HTML/จาวาสคริป" ผมคิดว่ามันยาวมากเกินไป ดังนั้นตอนที่ 5 นี้ ผมขออธิบายเฉพาะองค์ประกอบ "ข้อความ" เพียงอย่างเดียว เพราะถือว่ายาวเหมือนกัน ผมจะดูความเหมาะสมของการเขียนเนื้อหาในแต่ละตอนนะครับ ไม่อยากให้ยาวเกินไปครับ

เช่นเคยนะครับ ผมนำหน้าของการเพิ่มองค์ประกอบรวม มาให้ดูนะครับ


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


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

  • ตัวที่ 1 : ตัวอักษร b หนา ที่ถ้ากด ข้อความต่างๆ ของเราก็จะหนา ทำให้เด่น อ่านง่าย เนื่องจากการตกแต่งบล็อก ด้วยการใช้องค์ประกอบ "ข้อความ" ของ Blogger ไม่สามารถเพิ่มขนาดของตัวอักษรได้ ทำให้หนาได้อย่างเดียว
  • ตัวที่ 2 : ตัว i เอียง ถ้ากด ข้อความต่างๆ ก็จะเอียง เช่นนี้ ปรีดาเป็นคนพิการรุนแรง เป็นต้นครับ
  • ตัวที่ 3 : เป็นการเปลี่ยนสีของตัวอักษร ถ้ากดที่สัญลักษณ์ "ตัว T มีแถบสี" ก็จะเห็นตารางสี กดเลือกสี ตัวอักษณที่เป็นข้อความนั้นๆ ก็จะเปลี่ยนสีตามเราแก้ไข ลืมบอกไปว่า ก่อนเปลี่ยนสี ต้องลากเม้าท์ให้ครอบคลุมข้อความ หรือตัวอักษณที่ต้องกาวรจะแก้สีก่อนนะครับ
  • ตัวที่ 4 : เป็นกาวรเชื่อมโยงลิ้งค์ วิธีใช้งานคือ ถ้าเราต้องการให้ตัวอักษรใดหรือข้อความใด เมื่อผู้อ่านกดปุ๊บ ไปยังอีกหน้าเว็บไซต์ เป็นต้น ก่อนกดก็ลากเม้าท์พื้นที่ ที่ต้องการจะเชื่อมโยงลิ้งค์ที่ตัวอักษร หรือข้อความก่อน จากนั้นกดที่สัญลักษณ์ จะขึ้นหน้าต่างเล็กๆ ให้ใส่ URL ที่ต้องการจะเชื่อมโยง แล้วก็กด "บันทึก" ก็จะเห็นว่าใต้ข้อความนั้นมี "ขีดเส้นใต้" ถือว่าเสร็จในส่วนนี้แล้วครับ
  • ตัวที่ 5 และ 6 ผมยังไม่เคยใช้ครับ ถ้าใช้แล้วจะรีบมาเขียนบทความเพิ่มนะครับ
ลองมาดูตัวอย่างของกาวรใช้งานองค์ประกอบ "ข้อคาม" กันนะครับ ผมนำตัวอย่างจากเว็บบล็อกเรื่องความพิการของผม http://preedastation.blogspot.com/ มาเป็นตัวอย่างนะครับ


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

ตัวอย่าง " Siam PWD Blog พื้นที่สำหรับการแบ่งปันประสบการณ์ชีวิตของผู้พิการรุนแรง ที่มีแนวคิด อยากเผยแพร่บทความให้เกิดประโยชน์แก่ทุกฝ่าย และชักชวนให้เพื่อนผู้พิการท่านอื่นได้เริ่มเขียนบทความกันบ้างครับ" เป็นตัวอย่างการเชื่อมโยงลิ้งค์ และมีตัวหนาด้วยที่ข้อความ "Siam PWD Blog" มีหัวข้อเป็น "SIAM PWD BLOG ประสบการณ์ของผู้พิการรุนแรง"


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


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


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

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

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


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

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

13 ความคิดเห็น:

  1. ผมกำลังจะถามวิธีทำเรื่องนี้กับคุณต๋อยอยู่พอดี พอมาอ่านตอนนี้เลยกระจ่าง เป็นไอเดียที่สุดยอดเลยครับ

    ตอบลบ
  2. ไม่ระบุชื่อ14 กรกฎาคม 2553 02:05

    ขอบคุณมากเรย อ่านมาหลายบทความแล้ว รู้สึกว่าคุณจะเขียนผิด(สะกดผิด)เยอะเรยอ่ะ พอคำที่คุณเขียนผิด มันเรยทำให้อ่านไม่เข้าใจนะค่ะ

    ตอบลบ
    คำตอบ
    1. ต้องขอโทษครับ พิมพ์สด ยังไม่มีเวลาตรวจทานครับ

      ลบ
  3. ขอบคุณครับที่ช่วยแนะนำให้ สำหรับบทความนี้ มี 1 จุด คือคำว่า "สงักนิด" ซึ่งจริงๆ ต้องเป็น "สักนิด"

    สาเหตุสำคัญคือ
    1. ผมเป็นคนพิการรุนแรง ทำให้นิ้วงอ เวลาพิมพ์ "ส" นิ้วก้อยที่งอ จะไปโดน "ง" เข้ามาด้วย
    2. ปกติเวลาผมพิมพ์บทความ ผมมีเวลาไม่มาก จึงไม่ได้มีการตรวจคำผิด เพราะผมพิมพ์สดในบล็อกเลย ถ้ามีเวลาจึงจะมาอ่านทีหลังครับ

    ถ้ามีพิมพ์ผิดที่บทความไหน ก็แจ้งผมแบบนี้ ช่วยกัน ช่วยกัน ครับ

    ขอบคุณครับ
    ปรีดา

    ตอบลบ
  4. งายสุดๆ ไปดูที่นี่เลยครับ http://tip.maxlayout.com/2010/02/blogger_11.html

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

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

    ตอบลบ
    คำตอบ
    1. สวัสดีครับคุณเอกชัย ลองส่งหน้าเว็บบล็อกที่ทำมาให้ดูหน่อยนะครับ และที่ถามมาก็สามารถทำได้นะครับ

      ลบ
    2. หน้าเว็บบล็อก หมายถึงหน้านี้ใช่ไหมครับ http://nfeph.blogspot.com/
      ผมเพิ่งเริ่มทำได้ 3 วันเอง ยังไม่มีหน้าหลักเลย

      ลบ
    3. ลักษณะการทำลิงก์จากองค์ประกอบ "ข้อความ" ดูตัวอย่างจากบล็อกของผมอันนี้ก็ได้ครับ http://preedaroom.blogspot.com/ ทำไม่ยากครับ ลองใช้ดูครับ

      ลบ
    4. ความคิดเห็นนี้ถูกผู้เขียนลบ

      ลบ
    5. ขอบคุณครับ ( ผมพอเข้าใจแล้ว เดิมผมเข้าใจผิดคิดว่า ข้อความ คืออันเดียวกับ บทความบล็อก )

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

    ตอบลบ

คลิปวีดีโอการใช้งาน Blogger

บทความที่ได้รับความนิยม 10 อันดับแรก