wordpressธีม บทที่ 5 : การวนลูป(The Loop)

การวนลูปมีความสำคัญมาก เราใช้การวนลูปเพื่อเรียกแต่ละบทความในบล็อกมาแสดง ณ ตอนนี้คุณก็ได้เรียนรู้การสร้างธีมสำหรับwordpressมาบ้างเล็กน้อย มาทบทวนกันอีกทีดีกว่าว่าเรียนอะไรไปบ้างแล้ว

เรียนอะไรมาบ้างแล้ว?

• กฏ, โครงสร้าง, ลำดับชั้นความสำคัญ ของธีมwordpress
• แต่ละหน้าของบล็อกประกอบไปด้วยอะไรบ้าง
• การติดตั้งธีม
• การเรียกใช้ชื่อบล็อกมาแสดงเป็นลิงค์ และการเรียกใช้คำอธิบายบล็อกมาแสดงและการแยกโค้ดในส่วนหัวออกจากโค้ดส่วนอื่น ๆ

เริ่มบทที่ 5 กันได้แล้ว

สิ่งที่ต้องทำก็เหมือนเดิมครับ เปิดโฟลเดอร์ธีม tutorial ขึ้นมา, เปิดเบราเซอร์ไปที่ wordpress ของคุณ, เปิดไฟล์ index.php ขึ้นมา

อ่านต่อ คลิกที่นี่ »

ในบทที่แล้วผมได้บอกการติดตั้งธีม และ แนะนำให้รู้จัก php เล็กน้อย สำหรับวันนี้เราจะต่อกันในเรื่องของ php กันอีกนิด และ เรียนรู้วิธีแสดงชื่อบล็อกของเรา

โปรดจำไว้ว่า อย่าคัดลอกโค้ดที่ผมเตรียมไว้ให้ไปใช้นะครับ ให้คุณพิมพ์เอง อย่างน้อยมันจะช่วยให้จำขึ้นใจไงล่ะครับ

ขั้นตอนที่ 1ไปที่โฟลเดอร์ธีมของคุณ ในโฟลเดอร์นั้นจะต้องมีไฟล์ index.php และ style.css

โค้ดข้างในไฟล์ index.php และ style.css จะต้องเหมือนกับ index.txtและ style.txt

ขั้นตอนที่ 2

• เปิดหน้าต่างเว็บเบราเซอร์ขึ้นมา ไปที่เว็บ wordpress ของคุณ ภาพที่ปรากฏอยู่ตรงหน้าคุณจะต้องเป็นหน้าจอว่างเปล่านะครับ เพราะว่าธีมที่เราทำไว้ครั้งที่แล้วเราไม่ได้ใส่ให้มันแสดงผลอะไรเลย
• กลับไปที่ธีมโฟลเดอร์ จากนั้นเปิดไฟล์ index.php ขึ้นมา

มาถึงขั้นตอนนี้ สิ่งที่เราเพิ่งทำเสร็จไปก็คือ เปิด โฟลเดอร์ธีม, เว็บเบราเซอร์ และ index.php ขึ้นมา
อ่านต่อ คลิกที่นี่ »

สร้าง index.php เป็นบทที่สามของชุดการสอนสร้างธีมเวิร์ดเพลส
ถึงเวลาแล้วที่จะพักเรื่องทฤษฏีไว้ แล้วมาเริ่มลงมือปฏิบัติจริงกัน ในบทนี้คุณจะได้ยุ่งกับโค้ดของเวิร์ดเพลสเล็กน้อย ตอนนี้คุณควรติดตั้งเวิร์ดเพลสไว้ในคอมพิวเตอร์คุณได้แล้วนะครับ เพราะว่าการใช้บล็อกออนไลน์จะไม่สะดวกในการลองรัน

ขั้นตอนที่ 1 : สร้างโฟลเดอร์ธีม

ไปที่โฟลเดอร์ธีมของเวิร์ดเพลส ซึ่งมันควรจะอยู่ที่ wp-content/themes และ ตั้งชื่อโฟลเดอร์ใหม่ในโฟลเดอร์ themes ว่า “tutorial”

ขั้นตอนที่ 2 : สร้างไฟล์ index.php และ style.css

เปิดโปรแกรม dreamweaver หรือ โปรแกรมจัดการตัวหนังสือ(text editor)ที่คุณชื่นชอบ

คัดลอกโค้ดต่อไปนี้ ไป paste ที่หน้าโปรแกรม text editor ของคุณ
อ่านต่อ คลิกที่นี่ »

(Template Files and Templates)
ไฟล์เทมเพลทและเทมเพลท เป็นบทที่สองของชุดการสอนสร้างธีมเวิร์ดเพลส หากคุณยังไม่ได้อ่านบทที่ 1 เพื่อให้เข้าใจตรงกันในเรื่องของคำศัพท์ที่ใช้ จึงควรกลับไปอ่านบทที่ 1 ก่อนครับ

ในบทนี้จะช่วยให้คุณคุ้นเคยและมีความเข้าใจเกี่ยวกับ ไฟล์เทมเพลท, เทมเพลท, และโครงสร้างของแต่ละหน้า(page) มากยิ่งขึ้น

สิ่งหนึ่งที่ควรจำไว้คือ แต่ละหน้า(page)ของบล็อกคุณประกอบไปด้วยไฟล์เทมเพลทหลาย ๆ ไฟล์ ข้างล่างนี้คือตัวอย่างหน้าแรกของบล็อก

ในตัวอย่างข้างต้น หน้าแรกประกอบไปด้วยไฟล์เทมเพลท 4 ไฟล์ : header, index, sidebar, และ footer
อ่านต่อ คลิกที่นี่ »

บทความนี้เป็นบทแรกของการสอนสร้างเวิร์ดเพลสธีม ผมจะไม่สอนทุกอย่างในครั้งเดียว แต่จะแบ่งออกเป็นบท ๆ (ไม่อยากอัดแน่นเกินไป) อนึ่งสิ่งที่ผมจะสอนนี้ไม่อาจจะเป็นบทความอ้างอิงได้ หมายความว่าผมจะสอนคุณไปทีละขั้น แต่ถ้าหากคุณต้องการเอกสารอ้างอิงก็สามารถอ่านได้จากเอกสารของเวิร์ดเพลสเอง ซึ่งมีให้ทุกอย่าง
บทนี้ประกอบไปด้วย

• กฏง่าย ๆ (Basic Rules)
• คำศัพท์ที่ควรรู้(Lingo)
• ลำดับชั้นของไฟล์(Hierarchy)

กฏง่าย ๆ (Basic Rules)

• กฏข้อที่ 1 : ปิดทุกแท็ก(tag) ที่คุณเปิดมันไว้
  
  วิธีปิดแท็กที่ผิด ผิดเพราะอะไรนะหรือ : วางแท็กปิด ul ไว้ผิดลำดับ แท็กทุกแท็กจะอยู่ในเครื่องหมาย “<” และ “>” เครื่องหมาย “/” ใส่ไว้เพื่อระบุว่าแท็กนั้น ๆ เป็นแท็กปิด ในตัวอย่างข้างต้นผมใช้ ul (unordered list) และ li(list item) แท็ก โปรดสังเกตวิธีการวาง <li></li> จะต้องอยู่ใน <ul></ul> ซึ่งเรียกว่าการวางแบบซ้อน (nesting)

อ่านต่อ คลิกที่นี่ »