...... วิธีวาง Lay Out เพื่อจัดระเบียบเรื่องที่เขียนในบล็อก Posted by ปิรันญ่า , ผู้อ่าน : 425 , 20:33:41 น. หมวดหมู่ : Blogger เกลอกัน พิมพ์หน้านี้
Table 1: Header
Table 2 Left: Greeting
Table5: Story A Header
Table 4 :Story A
Table 2 Right: Logo, etc.
Table 7: Story B Header
Table 6: Story B
Table 3
Footer
การสร้างตารางในบล็อกเพื่อใช้เป็นLay Out สำหรับวางตำแหน่งเรื่องและส่วนประกอบต่างๆเช่น หัวข้อ เพลง วีดิโอคลิป หรือกรอบสำหรับเน้นข้อความ สามารถทำเป็น Template ไว้ก่อนได้ค่ะ เมื่อต้องการใช้ก็เพียงนำ Code ของ Template ที่เราต้องการใช้นั้นมาใส่ใน Blog ใน Html mode
จากตัวอย่าง Lay Out ข้างบนนี้ ใช้ชุดคำสั่งนี้ค่ะ
วิธีนำ Code ไปใช้
ลองทำตามนะคะ
1. Log in เข้า oknation เพื่อ เขียนบล็อกของคุณ
2. ไปที่แถบ Post เลือก 'สร้างเรื่อง
3. คลิกปุ่ม เพื่อเข้าสู่ html mode ค่ะ
4. copy Code ชุดที่ให้นี้ไปใส่ได้เลยค่ะ
5. คลิกปุ่ม เพื่อออกจาก html mode ค่ะ
6. เขียนข้อความลงในแต่ละตาราง ตามที่คุณต้องการ
7. หากต้องการปรับสีพื้นตาราง ให้ศึกษาจากวิธีในเรื่อง ดูวิธีสร้างตาราง และการปรับแต่งสีสัน ความกว้าง ความหนาของขอบและระยะ...... จับบล็อกเข้าตารางซะ [วิธีจัดการเจ้าตัวยุ่งให้ดูดีค่ะ]
หากจะลองสร้าง Lay out เองก็ให้คิดโครงร่างที่ต้องการ ว่าจะให้เรื่องแสดงออกมาอย่างไรเสียก่อนค่ะ แล้วลองสร้างตารางตามตำแหน่งที่ต้องการ (แต่ต้องคำนวณความกว้างให้ดีดีค่ะ)
ความสูงของตาราง สามารถปรับได้หลังใส่เนื้อหาแล้ว เพราะความยาวตารางจะขยายตามความยาวของเรื่อง
ความกว้างของตาราง ต้องตั้งค่าตารางไม่ให้เกินพื้นที่แสดงผลที่เรากำหนดไว้ใน css template นะคะ ไม่งั้นจะตกขอบบล็อกด้านขวามือค่ะ ที่ต้องรู้คือ เมื่อกำหนดความกว้างของตารางไหนไว้เท่าใดก็ต้องพยายามใส่รูป หรือคลิปที่มีขนาดไม่เกินความกว้างที่จะใส่ได้ เพราะความกว้างของตารางจะขยายตามไป ทำให้เกิดอาการตกขอบทางด้านขวาของบล็อกได้เช่นกันค่ะ
กรอบตาราง ถ้าจะไม่ให้เห็นก็ให้ตั้งค่า cell spacing เป็น 0 ได้
ระยะห่างของกรอบตารางกับเนื้อหา เช่นตัวอักษร ภาพ คลิป ฯลฯในเรื่อง ต้องการเว้นระยะเท่าใดให้ตั้งค่าที่ cell padding ค่ะ
ความหนาของตาราง ไม่ต้องการให้เห็นขอบนอกตาราง (ไม่ต้องมีความหนา) ก็ตั้งค่า Border thickness ให้เป็น 0 ค่ะ
สีพื้นของตาราง สามารถกำหนดเป็นสี หรือเป็นภาพก็ได้ ดูรหัสสีได้ที่เรื่อง...... Color Chart (hex code)
สงสัยอะไร เชิญถามได้ที่ความคิดเห็นนะคะ
ไม่มีความคิดเห็น:
แสดงความคิดเห็น