wordpressthai Theme design

Page 1

For wordpress thai edition : wordpress thaiacademy By Mr.Boonyakorn Jirapong 5213000457 CHANDRAKASEM RAJABHAT UNIVERSITY Communication .Design ART Technology For ARTI3319


คำนำ

จ ัดทำโดย นำย บุณยกร จิรำพงษ์ ิ ปกรรม 5213000457 ศล ิ ป์ แขนงออกแบบนิเทศศล

วิชำเทคโนโลยีเพือ ่ กำร ิ ป์ ออกแบบนิเทศศล ARTI3319

1


สำรบ ัญ คำนำ

1

แนวคิดในกำรออกแบบ Theme : WordPress Thai Edition

3

WordPress thai คือ อะไร ขนตอนและวิ ั้ ธก ี ำรติดตงั้ WordPress that v3.51

3-4 5

อธิบำยกำรปร ับค่ำชุดรูปแบบกรำฟฟิ ก Theme

6-7

อธิบำยขนตอนกำรเพิ ั้ ม ่ แทบเมนูดำ้ นข้ำง Add Widget

8-9

2


Wordpressthai คือ อะไร WordPress เป็ น open source web software ที่เราสามารถติดตั้งบนเว็บ server ของเราเพื่อสร้างเว็บไซต์, blog หรื อ community ตอนเริ่ มแรก WordPress เป็ นเครื่ องมือไว้สาหรับสร้าง blog แต่ได้รับการพัฒนามา เรื่ อย ๆ จนสามารถสร้างเป็ นเว็บไซต์ หรื อ เว็บ community ได้แล้ว โดยมีระบบจัดการบทความ หรื อ Content Management System (CMS) ทาให้ง่ายต่อการใช้งาน ซึ่ง WordPress สร้างขึ้นโดย Matt Mullenweg และ Mike Little ในปี 2003 นับว่ามีการพัฒนามาถึง 9 ปี

เวิร์ดเพรส เป็ นระบบเพลต

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

ขั้นตอนและวิธีการติดตั้ง Wordpressthai v3.51

1. เข้ าสู่ เว็บไซค์ www.wordpressthai.com เลือ่ นลงมาด้ านล่างสุ ดจะมีคลิกให้ ดาวน์ โหลด Wordpressthai v3.51

2.เริ่มต้ นจากการดาวโหลดข้ อมูล Wordpressthai v3.51 Portable ลงใน เครื่อง

3


3. เมือ่ เข้ ามาใน Floder ทีเ่ ราทา การดาวน์ โหลดมาให้ Double cick ที่ Usbwebserver.exe เพือ่ เป็ นการจาลอง Server Wordpress ขึน้

4. คลิกทีต่ ัวโปรแกรมจะขึน้ เป็ น หน้ าต่ างตามภาพจากนั้นให้ คลิก เข้ าไปที่ Localhost เพือ่ เข้ าสู่ โปรแกรมหน้ าเว็บจาลอง ส่ วน Root dir คือส่ วนทีเ่ อาไว้ สาหรับ เก็บไฟล์ต่างๆ

5. เมือ่ คลิกเข้ า Localhost แล้วลิงค์ ต่ อมาคือหน้ าชี้แจงโปรแกรมแล้ ว ไปคลิกที่ http://localhost:8080/wordpress thaiedition เพือ่ เชื่อมต่ อไปทีห่ น้ า Login

4


6.บริการเว็บไซค์ แบบเคลือ่ นทีเ่ วิร์ดเพรส บล็อกฉบับภาษาไทย WordPressThai Edition โดย ผศ.ประชิด

ทิณบุตร

Thai Comtomisation by Asistant Professor Prachid Tinnabutr

เมือ่ ทาการ Login แล้วคลิกเข้ าไปจะปรากฏหน้ าต่ างดังรู ปภาพจากนั้นเลือกธีมทีจ่ ะทาการ แก้ไขโดยวิธีการ ทาชุด theme จะทาการเลือก Theme Wordpressthai : Academy by Assistant Professor Prachid tinnabutr ออกมาทาการพัฒนาในรู ปแบบของการออกแบบ Design Theme

5


7. จากนั้นก็จะเข้ าสู่ ระบบการจัดการ ระบบการจัดการก็จะคล้าย ๆ Blogspots ให้ เข้ าไปตั้งค่ าข้ อมูลต่ างๆ ลองทดลองใช้ ตัวผมได้ เข้ าไปปรับเปลีย่ นข้ อมูลและตั้ง ค่ าอืน่ ๆ

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

สามารถกดเข้ าง่ าย

2.หน้ าลิงค์ ต่อได้ เข้ ามาอัพโหลดภาพ พืน้ หลังของธีม เข้ าไปอัฟโหลดเอา ไฟล์ภาพพืน้ หลังทีต่ ้ องการจาก Open File

6


3.ต่ อมาเข้ ามาปรับตั้งค่ าภาพส่ วนหัว ไซต์ อพั โหลดภาพจากไฟล์คลิกที่ Choose File เลือกภาพจากไฟล์ของเรา ทีต่ ้ องการ

4.ลิงค์ ต่อมาระบบจะให้ ทาการคร็อปตั้ง ค่ าขนาดภาพส่ วนหัวของไซต์ ปรับ ความกว้ าง-ความสู งตามกรอบ

ภาพตัวอย่ างของการปรับตั้งค่ ชุดรู ปแบบกราฟิ ก Theme ที่เสร็จสมบูรณ์

7


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

2.ลิงค์ ภาพถัดมาจะเป็ นแทบเครื่องมือ สาหรับลากตั้งค่ าข้ อมูลในส่ วนต่ างๆ นาไปใส่ ใน Primary Widget Area

3.ใส่ ข้อมูลลงใน Widget สร้ าง Widgetขึน้ เองใน 2 หัวข้ อ -About Blogger :ชื่อเจ้ าของบล็อก -Blogs & Sites.google : เว็บบล็อก และกรู เกิล้ ไซต์

8


4.ลาก Widgets ไปยังด้ านข้ างทางขาว เพือ่ เปิ ดใช้ งานพวกมัน ลากกลับมาที่เดิม เพือ่ เลิกใช้ งานและลบการตั้งค่าพวกมัน

ภาพตัวอย่ างที่ทาการเพิม่ เมนูข้างบล็อก Widget เสร็จสมบูรณ์

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

9


แนวคิดในการออกแบบ Theme :WordPressThai Edition ในการออกแบบ Theme นี้เลือกใช้ Theme ที่ดูแล้วสื่ อถึงความ เป็ นไทยจึงนาลวดลายไทยมาใช้ในการออกแบบโดยนามาปรับ

ABOUT BLOGGER Mr. Boonyrkorn Jirapong

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

10


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.