รวมบทความทั้งหมดในหมวดการพัฒนาเว็บไซท์ สอนสร้างเว็บไซต์

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

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

ออกแบบโลโก้หัวในเว็บบอร์ด phpBB
จะเป็นการสร้างหรือออกแบบภาพหัวเว็บไซต์ของเราเอง จากตัวอย่างจะใช้ Photoshop
1. สร้างงานขนาด 1024 x 88 หน้าจอ phpBB สามารถยืดขยายในแนวนอนได้ ถ้าความกว้างของ ภาพหรือ Width น้อยเกินไป ภาพจะดูขาดๆ ไป ไม่สวย ก็ออกแบบให้กว้างๆ ไว้ก่อน ส่วนความสูงก็ไม่ให้ ใหญ่มาก เผื่อคนใช้เน็ตช้าๆ ความเร็วต่ำ จะได้ไม่เสียเวลาโหลดภาพมากนัก
2. สร้างเสร็จแล้วก็บันทึกหรือ Save เป็นไฟล์แบบ jpg หรือ gif จากตัวอย่าง จะเป็นไฟล์แบบ gif ชื่อ mylogo.gif

อัพโหลดภาพหัวเว็บเข้าในเว็บบอร์ด phpBB
สร้างภาพหัวเว็บเสร็จแล้วก็จะจัดการอัพโหลดไปไว้บนเว็บไซต์
1. ใช้โปรแกรม FileZilla แล้วไปยังไดเรคทอรีที่เก็บไฟล์ของ phpBB จากตัวอย่างอยู่ในไดเรคทอรี ชื่อ pboard
2. ในที่นี้จะนำไปเก็บไว้ในไดเรคทอรีชื่อ images ให้คลิกเลือกไดเรคทอรีนี้
3. ในช่องซ้าย ให้เลือกไฟล์ภาพหัวเว็บหรือโลโก้ของเรา แล้วจัดการอัพโหลด
4. ไฟล์ที่ถูกอัพโหลดเรียบร้อยแล้ว จะเก็บไว้ในไดเรคทอรีชื่อ images

Details: Category: คู่มือ phpBB; Hits: 2588

แก้ไขไฟล์เทมเพลทในเว็บบอร์ด phpBB
จะเป็นการแก้ไขไฟล์ overall_header.html และไฟล์ overall_footer.html
A. ดาวน์โหลดไฟล์เทมเพลทจากเว็บไซต์
จะเป็นการดาวน์โหลดไฟล์เทมเพลทจากเว็บไซต์ แต่ถ้าในเครื่องของเรามีอยู่แล้ว ก็จัดการแก้ไขได้ เลย
1. ใน FileZilla ให้คลิกเลือกไดเรคทอรีที่เก็บไฟล์ไว้ก็คือ templates
2. ชี้ลูกศรที่ไฟล์ overall_header.html แล้วคลิกขวาเรียกคำสั่งลัด
3. คลิกปุ่มซ้าย ที่คำสั่งดาวน์โหลด
4. ไฟล์ overall_footer.html ก็ดาวน์โหลดด้วยวิธีการเดียวกัน

B. แก้ไขไฟล์เทมเพลทในเว็บบอร์ด phpBB
การแก้ไขไฟล์ overall_header.html
1. เข้าโปรแกรม Windows Explorer ชี้ลูกศรที่ชื่อไฟล์ แล้วคลิกปุ่มขวาของเมาส์เรียกคำสั่งลัด
2. คลิกปุ่มซ้ายที่คำสั่ง Open With>>Wordpad
3. เลื่อนแถบเลื่อนไปยังตำแหน่ง คำสั่ง ดังตัวอย่าง
4. ลบคำสั่ง ตามตัวอย่างออกไป ที่ได้สร้างแถบสีไว้
5. ส่วนที่ลบออกไป จะเป็นส่วนที่แสดงโลโก้และข้อความชื่อเว็บไซต์ เราจะใช้ภาพหัวเว็บของเรา เอง มาแทนที่ จึงต้องลบออกไป
6. ถ้าจะพิมพ์คำสั่ง PHP หรือ HTML ก็สามารถพิมพ์เพิ่มลงไปในส่วนนี้ได้
7. คำสั่งนี้จะแสดงข้อมูลถัดจากโลโก้ ถ้าไม่ต้องการ ก็ลบออกได้ เช่นกัน
8. เสร็จแล้ว คลิก File>>Save หรือปุ่ม Save
9. จากนั้นก็ปิดไฟล์ โดยคลิก File>>Close

Details: Category: คู่มือ phpBB; Hits: 1641

การแก้ไขไฟล์ overall_footer.html ในเว็บบอร์ด phpBB
1. วิธีการแก้ไขก็คล้ายๆ กัน เปิดไฟล์ขึ้นมาแก้ไขด้วยโปรแกรม Wordpad ในที่นี้เราต้องการลบ ลิงค์ ทีมงาน ลบ Cookies ... ลบออกไป แล้วหาแบนเนอร์มาวาง
2. ภาพแบนเนอร์จะใช้ภาพชื่อ snm.jpg จัดการอัพโหลดไปไว้ในไดเรคทอรี images ที่เดียวกับที่ ได้เก็บไฟล์โลโก้ mylogo.gif

3. ลบคำสั่งที่ได้สร้างแถบสีออกไป
4. ตำแหน่งนี้ในหน้าจอเว็บบอร์ด ก็จะถูกลบออกไป

5. วางภาพแบนเนอร์ด้วยคำสั่งดังนี้ อาจลองใช้คำสั่ง PHP หรือ HTML แบบอื่นๆ ก็ได้
6. คำสั่ง Width และ Height เป็นค่าความกว้างและความสูงของภาพ

7. การดูค่า Width และ Height ให้ใช้โปรแกรม Windows Explorer คลิกที่ภาพเพื่อเลือกก่อน
8. จากนั้นดูที่ Status Bar หรืออาจคลิก View>>Tiles ก็ได้

9. การระบุตำแหน่งภาพ จะมีวิธีอ้างอิงง่ายๆ ถ้าภาพอยู่ในไดเรคทอรีหลัก publich_html/pboard/images/ชื่อภาพ
10. ชื่อเว็บไซต์ของเราก็คือ www.siamebook.com การอ้างอิงตำแหน่งภาพ ก็จะเป็น
www.siamebook.com/pboard/images/ชื่อไฟล์ภาพเช่น snm.jpg
11. สำหรับการใช้งานที่ฟรีเว็บไซต์ kmancity.com ชื่อก็จะยาวหน่อยเช่น
www.pasakresort.kmancity.com/pboard/images/snm.jpg เป็นต้น

C. อัพโหลดไฟล์เข้าเว็บไซต์
แก้ไขไฟล์เสร็จแล้ว ก็จัดการอัพโหลดเข้าเว็บไซต์ ไปเก็บไว้ที่เดิม

Details: Category: คู่มือ phpBB; Hits: 1130

แก้ไขไฟล์ Themes
ไฟล์ธีม จะเป็นไฟล์แบบ css ในที่นี้จะแก้ไขเพียงไฟล์เดียว ก็คือ colour.css
A. ดาวน์โหลดไฟล์จากเว็บไซต์
จัดการดาวน์โหลดไฟล์จากเว็บไซต์ หรือถ้าในเครื่องมีอยู่แล้วก็จัดการแก้ไขได้เลย
1. ไฟล์ธีมจะอยู่ในไดเรคทอรีชื่อ themes ให้ดาวน์โหลดไฟล์ชื่อ colours.css มาไว้ในเครื่อง

B. แก้ไขไฟล์ Themplate
การแก้ไขจะคล้ายกันกับการแก้ไขไฟล์ Template
1. เปิดไฟล์ด้วยโปรแกรม Wordpad
2. เลื่อนไปยังบรรทัดดังตัวอย่าง
3. จัดการแก้ไขตามนี้ จะเป็นการเรียกใช้งานไฟล์โลโก้ mylogo.gif นั่นเอง ซึ่งได้อัพโหลดเก็บไว้ ในไดเรคทอรี images
4. อาจแก้ไขค่าสีต่างๆ ต้องลองงมโค้ดกันเอง เพราะเยอะมากๆ เช่นในไฟล์ php หรือ html จะ มีการเรียกใช้งาน ให้ดูที่คำสั่ง class