Sponsored Ads

การพัฒนาเว็บไซท์

รวมบทความและหนังสืออธิบายเกี่ยวกับการพัฒนาเว็บไซท์ โดยนำเสนอวิธีใช้งานโปรแกรมต่างๆ ที่เกี่ยวข้องกับการสร้างโฮมเพจ เช่น การใช้งาน Dreamweaver ใช้งาน Joomla รวมเรื่องน่ารู้เกี่ยวกับการสร้างเว็บไซต์ ฯลฯ

 



ส่วนประกอบของเทมเพลทจะมี 2 ส่วนคือ Locked Region เป็นเนื้อหาที่เปลี่ยนแปลงแก้ไขไม่ได้ และ Editable Region ส่วนที่สามารถแก้ไขได้
1. แบนเนอร์ด้านบน ลิงค์ และสงวนลิขสิทธิ์...ส่วนนี้จะเรียกว่า Locked Region ทุกหน้าจะ เหมือนกัน จะแก้ไขไม่ได้ต้องเปิดไฟล์แม่แบบขึ้นมาแก้ไขเท่านั้น
2. ตำแหน่งภายใน Heading และ Details เป็นจุดที่จะมีการแก้ไขเนื้อหา ซึ่งจะวางเนื้อหาตรงนี้ใน แต่ละหน้า เนื้อหาที่ไม่เหมือนกันนี้เรียกว่า Editable Region

 

วิธีสร้างเทมเพลทใน Dreamweaver CS3


1. คลิกเมนู File>>New...
2. คลิกเลือก Blank Template
3. คลิกเลือก PHP ในที่นี้เราต้องการสร้างเว็บเพจแบบ PHP
4. คลิกปุ่ม Create

 

5. คลิกและพิมพ์ Title เป็นชื่อไตเติ้ลของเว็บเพจ ป่าสักรีสอร์ท
6. คลิกเมนู Modify>>Page Properties
7. คลิกเลือก Page font - Microsoft Sans Sefif ขนาด 12
8. คลิกปุ่ม OK
9. แทรกตารางด้วยคำสั่ง Insert>>Table โดยกำหนดขนาด Rows = 5, Columns=1
10. คลิกในตารางแล้วพิมพ์ข้อความลงไปอย่างเดียวก่อน อย่าเพิ่งนำภาพเข้ามาวาง ในส่วนลิงค์ก็ สร้างการเชื่อมโยงให้เรียบร้อย
11. บันทึกงานเก็บไว้ก่อน โดยคลิก File>>Save

12. ช่อง Save As คลิกและพิมพ์ชื่อไฟล์ เช่น mypage01
13. คลิกปุ่ม Save
14. สร้างแถบดำที่ หัวข้อ....
15. คลิก Insert>>Template Object>>Editable Region
16. ช่อง Name คลิกและพิมพ์ Heading
17. คลิกปุ่ม OK

18. สร้างแถบดำ รายละเอียด
19. คลิก Insert>>Template Objects>>Editable Region เช่นกัน
20. ช่อง Name คลิกและพิมพ์ Details เสร็จแล้วคลิกปุ่ม OK

21. คลิกแถวบนสุด แล้วแทรกภาพเข้ามาด้วยคำสั่ง Insert>>Image
22. คลิกเลือกไฟล์ภาพแล้วคลิกปุ่ม OK
23. จัดตำแหน่งภาพไว้ตรงกลาง
24. บันทึกงานอีกครั้ง โดยคลิก File>>Save
25. คลิกปุ่ม Close เพื่อปิดไฟล์

ดูไฟล์แม่แบบที่ได้
1. คลิก + หน้า Template โฟลเดอร์นี้ก็จะถูกสร้างอัตโนมัติ เมื่อมีการสร้างไฟล์เทมเพลท ในการ นำไปใช้งานก็ต้องเอาโฟลเดอร์ไปใช้งานด้วย
2. จะพบไฟล์ mytemp01.dwt.php

เรียกใช้งานเทมเพลทใน Dreamweaver CS3


1. คลิกเลือกไซท์ของเราก่อน เช่น Site-pasakresort
2. คลิก File>>New...
3. คลิก Page from Template
4. คลิกชื่อแม่แบบของเราเช่น mypage01
5. คลิกปุ่ม Create

 

6. สร้างแถบดำที่ หัวข้อของบทความ แล้วพิมพ์ข้อความทับลงไป
7. พิมพ์หัวข้อลงไปดังตัวอย่าง
8. รายละเอียดก็ปฏิบัติคล้ายๆ กัน
9. ส่วนอื่นๆ จะเป็น Lock Region แก้ไขไม่ได้ พิมพ์ข้อความลงไปไม่ได้

10. เสร็จแล้ว คลิก File>>Save บันทึกงานเก็บไว้
11. ตั้งชื่อไฟล์ไม่ให้ซ้ำกับแบบฝึกหัดก่อนหน้านี้ เช่น aboutus2.php แต่จะให้ดีควรที่จะสร้าง โฟลเดอร์แยกเก็บไฟล์แบบ Template แยกต่างหาก คล้ายๆ กับการสร้างเฟรม
12. คลิกปุ่ม Save

13. ทดสอบการทำงานโดยกด F12 ที่แป้นพิมพ์
14. ผลงานที่ได้
15. จัดการสร้างไฟล์อื่นๆ ที่เหลือด้วยวิธีการคล้ายกัน แต่ตั้งชื่อไฟล์เป็น album2.php ... เพื่อ ไม่ให้ซ้ำกับไฟล์ก่อนๆ หน้านี้

จัดการ Editable Region ของ Templage ใน Dreamweaver CS3


การเปลี่ยนชื่อ Template
1. ในพาเนล Files คลิก + หน้า Template
2. ดับเบิ้ลคลิกไฟล์เทมเพลทชื่อ Mypage01.dwt.php เพื่อเปิดไฟล์ขึ้นมาแก้ไข
3. คลิกเลือก Editable Region
4. คลิกและพิมพ์ชื่อใน Properties หรือแก้ไขได้ตามต้องการ

 

การลบ Template
1. คลิกชื่อ Editable Region
2. คลิก Modify>>Templates>>Remove Markup