nop-arti3319-wordpressthai.com

Page 1

Theme: Liverpool Nop Suksanguansri ID: 511313382


Theme: Liverpool FC ที่มาของการออกแบบ: เนื่องจากการเรียนในรายวิชา ARI3319 ได้มีการเรียนการ สอนเกี่ยวกับการใช้งานโปรแกรม Word Press Thai จึงได้ศึกษาเรียนรู้ และลองใช้ งานเพื่อให้เข้าใจถึงการสร้างและโครงสร้างของเว็บไซต์ จึงเกิดโครงการการออกแบบ Theme นี้ขึ้นมา ซึ่งจะเป็นเรื่องราวเกี่ยวกับทีมฟุตบอลทีมโปรดของผม นั่นคือทีม Liverpool FC นั่นเอง โจทย์และวัตถุประสงค์: เพื่อเรียนรู้การจัดการกับ WordPressThai3.3.2 และ เพื่อฝึกฝนการออกแบบเว็บไซต์ โปรแกรมที่ใช้งาน: Adobe Photoshop, WordPressThai3.3.2


1. เปิด WordPressThai3.3.2Portable-Academy-Version แล้วดับเบิ้ลคลิกที่ usbwebserver.exe เพื่อเปิดใช้งานโปรแกรม 2. จากนั้นจะขึ้นหน้าต่าง USBWebserver 8.0 ให้คลิกที่ Localhost เพื่อเข้าสู่ หน้าจอการจัดการเว็บไซต์

3. เมื่อเข้ามาที่หน้าหลักแล้วให้ทาการ Login เข้าสู่ระบบ


4. จากนั้นให้เข้าไปที่ “ศูนย์จัดการระบบ” เพื่อทาการตกแต่ง โดยจะเปลี่ยน theme เป็น pagelines ดาวน์โหลดมาจาก http://wordpress.org/extend/themes ดาวน์โหลดไฟล์จากเว็บไซต์แล้วเอาไฟล์ที่ได้ไปวางที่ path: \wordpressthaiedition \wp-content\themes ดังรูป


5. จากนั้นให้ refresh browser แล้วคลิกที่ “รูปลักษณ์หน้าเว็บ” ก็จะเห็น theme ที่ ได้ทาการดาวน์โหลดมาลงเพิ่ม ดังรูป


5. เปลี่ยนชื่อเว็บไซต์ โดยเข้าไปที่ "การตั้งค่าระบบ" -> "การตั้งค่าทั่วไป" จากนั้นก็ทาการเปลี่ยนชื่อเว็บไซต์และคาอธิบายบล็อก ดังรูป


6. เปลี่ยน logo โดยการเอาไฟล์ภาพที่ต้องการใช้เป็น logo โดยเปลี่ยนชื่อให้เป็น logo.png แล้วเอาไปวางแทนที่ไฟล์เดิมที่ path:\wordpressthaiedition \wp-content\themes\pagelines\images ดังรูป



7. ทาการจัดการกับสีของตัวอักษร โดยคลิกที่ เข้าไปที่ PageLines -> Site Options -> Color Control ดังรูป


8. จากนั้นเปลี่ยน background โดยเลื่อนลงมากาหนดค่า background ดังรูป


9. ทาการแก้ไขเนื้อหาบล็อกโดยเข้าไปที่ “เนื้อหาล็อก” จากนั้นระบบจะแสดงเนื้อหา ทั้งหมดที่มีอยู่ ซึ่งสามารถคลิกเพื่อลบหรือแก้ไขเนื้อหาที่มีอยู่แล้ว ดังรูป หรือหาก ต้องการสร้างใหม่ ให้คลิกที่ “สร้างเนื้อหา: เรื่องที่จะส่งใหม่”


10. เมื่อทาการแก้ไขเสร็จแล้วให้คลิกที่ปุ่ม “ปรับปรุงใหม่” หรือหากต้องการจะดู ตัวอย่างหน้าที่ได้ทาการแก้ไขไปแล้วก็ให้คลิกที่ปุ่ม “ดูการดูเปลี่ยนแปลง” ดังรูป


11. ทาการสร้างและแก้ไขหน้า โดยเข้าไปที่ “เมนู-เนื้อหาหลัก” ระบบจะแสดง หัวข้อ:เมนู:หมวดรายการหลัก ทั้งหมดที่มีอยู่ วิธีการสร้างและแก้ไขก็เหมือนกับ “เนื้อหา บล็อก” ดังรูป


12. ทาการเพิ่มหน้าและเมนูใหม่ ซึ่งในที่นี้จะยกตัวอย่างหน้า “Gallery” โดยคลิก “สร้างหัวข้อเมนู-หมวดรายการหลัก” แล้วใส่ชื่อหัวข้อเป็น Gallery จากนั้นตรงส่วน ของรายละเอียดจะเป็นการใส่รูปต่างๆ ซึ่งจะใช้ code html ในส่วนของตารางมาเป็น ตัวช่วยในการจัดการให้รูปภาพสามารถแสดงได้อย่างเป็นระเบียบมาขึ้น โดยใส่ <table><tr><td></td></tr></table> ลงไปในส่วนของรายละเอียด จากนั้นให้คลิกที่ ปุ่ม ตรงส่วนของ “แทรกสื่อ” เพื่อนาไฟล์รูปมาแสดง ดังรูป ทาเช่นนี้ไปเรื่อยๆ จนกว่าจะใส่รูปครบตามที่ต้องการ


12.1) เลือกไฟล์รูปที่ต้องการ จากนั้นรอจนกระทั่งระบบนาไฟล์รูปเข้าสู่ระบบเสร็จ


12.2) เมื่อเสร็จแล้วก็สามารถแก้ไขรายเอียดหรือข้อมูลต่างๆเกี่ยวไฟล์รูปได้อีกด้วย จากนั้นคลิกที่ปุ่ม “แทรกเข้าในเนื้อหา” ได้เลย ถ้ารายละเอียดของรูปไหนไม่ แสดงก็ให้คลิกที่ “แสดง” ดังรูป


12.3) เมื่อคลิกแทรกแล้วจะแสดง code ดังรูป


13. หลังจากสร้างหน้าจนครบแล้วก็จะทาการสร้าง/แก้ไข/จัดการ Widgets โดย เข้าไปที่ “รูปลักษณ์หน้าเว็บ” -> “บล็อกเมนูข้าง:Widgets” ดังรูป


จากการออกแบบสามารถสรุปได้ว่าจะให้ Theme เป็นสีดาเนื่องจากทีมลิเวอร์พลู มี Logo เป็นสีแดง เพื่อให้ตัดกัน และจะทาให้ดูไม่จืดเกินไป และที่สร้างเป็นประวัติ และ Gallery เพื่อให้รู้ถึงประวัติความเป็นมาของทีมลิเวอร์พลู อีกทั้งยังมีรูปภาพต่างๆ ไม่ว่าจะเป็นผู้เล่นในทีม อีกทั้งยังมีกิริยาท่าทางต่างๆ อีกด้วย

เนื่องจากเป็นการสร้างเว็บไซต์ด้วย Word Press Thai เป็นครั้งแรกจึงทาให้ใช้ เวลาในการสร้างนาน และต้องลองผิดลองถูกก่อน ทาให้ไม่สามารถสร้างได้อย่างเต็มที่ เท่าไหร่นัก


ชื่อ: นายนพ สุขสงวนศรี รหัสนักศึกษา: 5111313382 Email: nops511@gmail.com Blogger: http://nop-arti3319.blogspot.com/ Wordpress: http://noparti3319.wordpress.com/


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.