<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" media="screen" href="/~d/styles/rss2full.xsl"?><?xml-stylesheet type="text/css" media="screen" href="http://feeds.feedburner.com/~d/styles/itemcontent.css"?><rss xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:sy="http://purl.org/rss/1.0/modules/syndication/" version="2.0">

<channel>
	<title>Divland.com:เรียนรู้วิธีเขียน CSS หลักการ เครื่องมือ ในการเขียน CSS เทคนิคต่างๆ เทมเพลต CSS ฟรี และเรื่องราวเกี่ยวกับ wordpress การทำธีมเวิร์ดเพรส</title>
	
	<link>http://www.divland.com/blog</link>
	<description>The miracle land of inspiration</description>
	<pubDate>Wed, 01 Jul 2009 06:52:31 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.7.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="self" href="http://feeds.feedburner.com/divland" type="application/rss+xml" /><feedburner:emailServiceId xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">divland</feedburner:emailServiceId><feedburner:feedburnerHostname xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0">http://feedburner.google.com</feedburner:feedburnerHostname><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com" /><item>
		<title>ทำ layout ให้สูงเท่ากันทุกคอลัมน์</title>
		<link>http://www.divland.com/blog/2009/07/01/equal-height-column/</link>
		<comments>http://www.divland.com/blog/2009/07/01/equal-height-column/#comments</comments>
		<pubDate>Wed, 01 Jul 2009 06:38:35 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Tip & Trick]]></category>

		<category><![CDATA[css layout]]></category>

		<category><![CDATA[equal height]]></category>

		<category><![CDATA[layout]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=432</guid>
		<description><![CDATA[
ปัญหาคอลัมน์ยืดยาวไม่เท่ากัน มีรูปแบนเนอร์ที่ต้องการให้อยู่ชิดล่างตลอด มีวิธีแก้ดังต่อไปนี้

ก๊อปปี้สคริปตัวนี้ไป

/*
  ------------------------------------------------
  PVII Equal CSS Columns scripts -Version 2
  Copyright (c) 2005 Project Seven Development
  www.projectseven.com
  Version: 2.1.0
  ------------------------------------------------
*/
function P7_colH2&#40;&#41;&#123; //v2.1.0 by PVII-www.projectseven.com
 var i,oh,h=0,tg,el,np,dA=document.p7eqc,an=document.p7eqa;if&#40;dA&#38;amp;&#38;amp;dA.length&#41;&#123;
 for&#40;i=1;i&#38;lt;dA.length;i+=2&#41;&#123;dA&#91;i+1&#93;.style.paddingBottom='';&#125;for&#40;i=1;ih&#41;?oh:h;&#125;for&#40;i=1;i&#38;lt;dA.length;i+=2&#41;&#123;oh=dA&#91;i&#93;.offsetHeight;
 if&#40;oh&#38;lt;h&#41;&#123;np=h-oh;if&#40;!an&#38;amp;&#38;amp;dA&#91;0&#93;==1&#41;&#123;P7_eqA2&#40;dA&#91;i+1&#93;.id,0,np&#41;;&#125;else&#123;
 dA&#91;i+1&#93;.style.paddingBottom=np+&#34;px&#34;;&#125;&#125;&#125;document.p7eqa=1;
 document.p7eqth=document.body.offsetHeight;
 document.p7eqtw=document.body.offsetWidth;&#125;
&#125;
function P7_eqT2&#40;&#41;&#123; //v2.1.0 by PVII-www.projectseven.com
 if&#40;document.p7eqth!=document.body.offsetHeight&#124;&#124;document.p7eqtw!=document.body.offsetWidth&#41;&#123;P7_colH2&#40;&#41;;&#125;
&#125;


function P7_equalCols2&#40;&#41;&#123; //v2.1.0 by PVII-www.projectseven.com
 var c,e,el;if&#40;document.getElementById&#41;&#123;document.p7eqc=new Array&#40;&#41;;
 document.p7eqc&#91;0&#93;=arguments&#91;0&#93;;for&#40;i=1;i&#38;lt;arguments.length;i+=2&#41;&#123;el=null;
 c=document.getElementById&#40;arguments&#91;i&#93;&#41;;if&#40;c&#41;&#123;e=c.getElementsByTagName&#40;arguments&#91;i+1&#93;&#41;;
 if&#40;e&#41;&#123;el=e&#91;e.length-1&#93;;if&#40;!el.id&#41;&#123;el.id=&#34;p7eq&#34;+i;&#125;&#125;&#125;if&#40;c&#38;amp;&#38;amp;el&#41;&#123;
 document.p7eqc&#91;document.p7eqc.length&#93;=c;document.p7eqc&#91;document.p7eqc.length&#93;=el&#125;&#125;
 setInterval&#40;&#34;P7_eqT2()&#34;,10&#41;;&#125;
&#125;


function [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/07/01/equal-height-column/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่6_2:Archive,Link</title>
		<link>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_2/</link>
		<comments>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_2/#comments</comments>
		<pubDate>Sun, 08 Mar 2009 16:15:14 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม เวิร์ดเพลส]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=308</guid>
		<description><![CDATA[ในบทนี้ผมจะสอนวิธีการนำรายการ Archive ที่แยกตามเดือน และ Link ไปยังเว็บไซท์อื่น เช่น blogroll มาแสดง บทนี้ถือว่าง่ายมาก ๆ ครับ เพราะไม่ค่อยต่างจากบทความก่อนเท่าไหร่นัก ส่วนบทต่อไปเป็นเรื่องเกี่ยวกับปฏิทินและ search form ฟังดูน่าสนใจไหมครับ เพราะฉะนั้นอย่าพลาด ๆ

ขั้นตอนที่ 1: ใส่ archive ลิงค์
นำโค้ดข้างล่างนี้ไปใส่ไว้ใน sidebar ตรงข้างล่างรายการ Categories
&#60;li&#62;&#60;h2&#62;&#60;?php _e(’Archives’); ?&#62;&#60;/h2&#62;
&#60;ul&#62;
&#60;?php wp_get_archives(’type=monthly’); ?&#62;
&#60;/ul&#62;
&#60;/li&#62;
อย่าลืมกด tab เพื่อจัดระเบียบมันด้วยนะครับ


บันทึกไฟล์ แล้วรีเฟรชเบราเซอร์เพื่อดูผล

เกิดอะไรขึ้น?
คำสั่งที่เราใช้คือ wp_get_arhives() ซึ่งเป็นฟังก์ชั่นของเวิร์ดเพรสเค้า ใส่แอทริบิวท์ type และค่าของแอทริบิวท์คือ monthly เข้าไปเพื่อเรียกรายการ archive จัดเรียงตามเดือน (รายการ archive ที่ว่านี้จะเป็นลิงค์ไปยังรายการบทความในแต่ละเดือนครับ)

&#60;li&#62; - เปิดแท็ก list item
&#60;h2&#62; - เปิดแท็กหัวข้อรอง
&#60;?php _e(’Archives’); ?&#62; - ข้อความที่ใส่เป็นหัวข้อ
&#60;/h2&#62; [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_2/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่6_1:Page-Link</title>
		<link>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_1/</link>
		<comments>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_1/#comments</comments>
		<pubDate>Sun, 08 Mar 2009 16:05:30 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม เวิร์ดเพลส]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=310</guid>
		<description><![CDATA[มาถึงตอนนี้ผมคิดว่าคุณคงจะคุ้นเคยกับโครงสร้างของ sidebar บ้างแล้วนะครับ ในบทนี้ผมจะสอนให้คุณใส่รายการ Page-Link ไว้ใน sidebar เมื่อทำ sidebar เสร็จแล้วผมจะสอนวิธีการทำให้ sidebar ที่เราสร้างกันมา เป็น widget
นำโค้ดข้างล่างนี้ใส่ไว้บนส่วน Categories (ที่ทำไว้ในบทที่แล้ว) ดังรูป

&#60;?php wp_list_pages(); ?&#62;

ทีนี้ก็บันทึกไฟล์ และรีเฟรชเว็บเบราเซอร์ดูความเปลี่ยนแปลงที่เกิดขึ้น


โดยปกติแล้วถ้าติดตั้งบล็อกใหม่ หากคุณยังไม่ได้เพิ่มหน้าเพจ มันจะมีเพียงหน้าเดียวคือ About ส่วนในรูปข้างต้นนั้น ผมได้เพิ่มเพจเข้าไปเองมันจึงแสดงออกมาหลายเพจและหลายระดับ
ไปที่ View &#62; Page Source เพื่อดูว่าฟังก์ชั่น wp_list_pages() มันคืนค่าอะไรออกมาให้เรามั่ง ก็ปรากฏว่ามันทำโครงสร้างพวก ul li ให้เราเสร็จเรียบร้อย ดังตัวอย่างข้างล่างนี้

อันดับแรกเลย มันเอา list item(LI) ครอบทุกสิ่งทุกอย่างที่มันพิมพ์ออกมาจากฟังก์ชั่น wp_list_pages() ต่อมามันตั้งชื่อหัวข้อในส่วนนี้ว่า Pages ต่อมามันเพิ่ม unordered list (UL) ไว้ใต้ชื่อหัวข้อ(Page) ท้ายสุด มันซ้อน ชุดของแท็ก &#60;li&#62;และ&#60;/li&#62; เข้าไปอีกโดย &#60;li&#62; [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6_1/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 6:Sidebar</title>
		<link>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6/</link>
		<comments>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6/#comments</comments>
		<pubDate>Sun, 08 Mar 2009 08:10:02 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม เวิร์ดเพลส]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=312</guid>
		<description><![CDATA[เคยลองดู sidebar บ้างหรือยังครับ ในตอนแรกมันอาจจะดูยุ่งยากนิดนึง แต่ถ้าเข้าใจโครงสร้างมันแล้ว คุณจะรู้สึกว่าการสร้าง sidebar และใส่รูปแบบการแสดงผลให้มันง่ายนิดเดียว! จริงๆ นะ
ก่อนที่จะไปเริ่มทำ sidebar ไฟล์ index ต้องเหมือนตามนี้นะครับ
ขั้นตอนที่ 1: นำกล่อง div ตามโค้ดข้างล่างนี้ไปไว้ระหว่างแท็กปิด container และ แท็ก&#60;/body&#62;
&#60;div class=”sidebar”&#62;
&#60;/div&#62;


ขั้นตอนที่ 2: ใส่แท็ก unordered list ไว้ใน div ชื่อ sidebar ที่สร้างไว้เมื่อกี้
&#60;ul&#62; - เปิดแท็ก unordered list
&#60;/ul&#62; - ปิดแท็ก unordered list

list ในภาษา html ที่ใช้กันโดยทั่วไปจะมีอยู่ 2 ประเภท คือ Unordered Lists (เป็นเครื่องหมายจุดทึบ) และ Ordered Lists (มีหมายเลขกำกับแต่ละรายการ เรียงจาก 1 เป็นต้นไป)
ขั้นตอนที่ [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/03/08/create-your-wordpress-theme-lesson6/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 5_5:Posts Nav Link</title>
		<link>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_5/</link>
		<comments>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_5/#comments</comments>
		<pubDate>Wed, 28 Jan 2009 14:14:19 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[ออกแบบ ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=314</guid>
		<description><![CDATA[ในส่วนล่างของเวิร์ดเพรสส่วนใหญ่จะมีลิงค์ไปยังหน้าก่อนหน้าและหน้าถัดไป เราสามารถเรียกให้ลิงค์พวกนี้มาแสดงได้โดยการใช้คำสั่ง posts_nav_link() ในตอนนี้จะมีเพียงแค่ขั้นตอนเดียวเท่านั้นครับ
ขั้นตอนที่ 1: (และมีเพียงแค่ขั้นตอนเดียว)
แทรกโค้ดด้านล่างนี้ไว้ระหว่าง &#60;?php endwhile; ?&#62; และ &#60;?php else : ?&#62;
&#60;div class=&#8221;navigation&#8221;&#62;
&#60;?php posts_nav_link(); ?&#62;
&#60;/div&#62;

จากรูปข้างบนจะสังเกตุเห็นการย่อหน้า ซึ่งผมจะทำอย่างนี้ประจำเพื่อให้โค้ดดูมีระเบียบ อ่านง่าย

&#60;div class=”navigation”&#62; - เริ่มต้นส่วนที่เป็น div ที่เอาไว้ครอบลิงค์ไปยังหน้าก่อนหน้าและหน้าถัดไป
&#60;?php - เริ่มต้นส่วนที่เป็นโค้ดภาษา php
posts_nav_link() - เรียกลิงค์ไปยังหน้าก่อนหน้าและหน้าถัดไปขึ้นมาแสดง
; - สิ้นสุดคำสั่ง
?&#62; - สิ้นสุดส่วนที่เป็นโค้ดภาษา php
&#60;/div&#62; - สิ้นสุดส่วนที่เป็น div
ทำการบันทึกไฟล์ และรีเฟรชเว็บเบราเซอร์ จะได้ผลลัพธ์ออกมาดังภาพข้างล่างนี้

ถ้าบล็อคของคุณมีบทความไม่ถึงสิบบทความ ลิงค์นี้จะไม่ปรากฏขึ้น แต่ถ้าอยากให้มันขึ้นมาให้คุณล็อกอินเข้าไปยังส่วนบริหารจัดการเว็บบล็อค ไปที่ Options &#62; Reading จากนั้นใส่ค่าตัวเลขที่น้อยกว่าจำนวนบทความที่มีอยู่ในบล็อค เช่น ถ้าคุณมี 6 บทความ ให้ใส่ค่าเป็น 5
การปรับแต่งค่า posts_nav_link():
การปรับแต่งค่าฟังค์ชันนี้จะเหมือนกับการปรับแต่งค่าให้กับ postmetadata คุณสามารถใส่ค่าเป็นอะไรก็ได้ที่คุณต้องการระหว่าง,ก่อน [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_5/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 5_4:Else, Post ID</title>
		<link>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_4/</link>
		<comments>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_4/#comments</comments>
		<pubDate>Wed, 28 Jan 2009 14:02:30 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=316</guid>
		<description><![CDATA[ในหัวข้อนี้เราจะมาศึกษาการใช้ Else, post ID, and link title ถึงแม้ว่าจะไม่ใช้ก็ได้ แต่ผมแนะนำให้ใช้
ขั้นตอนที่ 1:
พิมพ์โค้ดต่อไปนี้ไว้ใต้ &#60;?php endwhile; ?&#62;
&#60;?php else : ?&#62;
&#60;div class=”post”&#62;
&#60;h2&#62;&#60;?php _e(’Not Found’); ?&#62;&#60;/h2&#62;
&#60;/div&#62;
ดังภาพข้างล่างนี้ (โปรดสังเกตุการย่อหน้าเพื่อจัดระเบียบโค้ด)

save ไฟล์ดังกล่าว กดรีเฟรช คุณจะเห็นว่าไม่มีอะไรเปลี่ยนแปลงเลย ดังนั้นเรามาทบทวนเรื่องการวนลูป(บทที่ 5) กันอีกทีเพื่อให้คุณเข้าใจว่าที่พิมพ์ไปเมื่อกี้มันคืออะไร
ลูปที่เราใช้มีดังนี้

&#60;?php if(have_posts()) : ?&#62;&#60;?php while(have_posts()) : the_post(); ?&#62;
&#60;?php endwhile; ?&#62;
&#60;?php endif; ?&#62;
เราใช้ if(have_posts()) เพื่อเช็คว่าในบล็อกของเรามีบทความอยู่หรือไม่ ถ้ามี คำสั่ง while(have_posts()) ซึ่งอยู่ระหว่าง if() และ else ก็จะวนลูปเรียกบทความมาแสดงด้วยคำสั่ง the_post() ดังนั้น คำสั่งต่าง ๆ ที่อยู่หลัง Else จะทำงานก็ต่อเมื่อไม่มีบทความในบล็อก
สิ่งที่เราจะสั่งให้เวิร์ดเพรสทำ [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/01/28/create-your-wordpress-theme-lesson5_4/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 5_3:Postmetadata</title>
		<link>http://www.divland.com/blog/2008/12/22/create-your-wordpress-theme-lesson5_3/</link>
		<comments>http://www.divland.com/blog/2008/12/22/create-your-wordpress-theme-lesson5_3/#comments</comments>
		<pubDate>Mon, 22 Dec 2008 08:59:09 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=318</guid>
		<description><![CDATA[เวิร์ดเพรสธีม บทที่ 5_3: ข้อความที่เกี่ยวเนื่องกับบทความ(Postmetadata) ต่อ
วันนี้เราจะมาเรียนรู้เกี่ยวกับ ข้อความเกี่ยวเนื่องแต่ละบทความในบล็อก(postmetadata) : วันที่, ประเภท, ผู้เขียนบทความ, จำนวนคอมเม้นท์ และข้อความต่าง ๆ ที่เกี่ยวกับบทความ
ก่อนที่จะเริ่ม ให้เปิด โฟลเดอร์ธีม, เบราเซอร์ และไฟล์ index.php ในไฟล์ index.php คุณจะต้องมีโค้ดดังรูป

ขั้นตอนที่ 1:
คัดลอกโค้ดจากไฟล์ postmetadata.txtไว้ใต้  &#60;?php the_content(); ?&#62; (หมายเหตุ: สำหรับส่วนนี้คุณสามารถคัดลอกและวางได้เลย ตอนที่ผมทำธีมเวิร์ดเพรสผมก็คัดลอกส่วนนี้มาใช้เลย ซึ่งส่วนนี้เราไม่จำเป็นต้องเข้าใจอย่างละเอียดก็ได้ เพียงแค่รู้ว่าส่วนนี้มันทำอะไรก็ได้แล้ว)

รูปข้างล่างนี้ผมจัดให้เพียงพอต่อพื้นที่ แต่สำหรับท่านผู้อ่าน ผมขอให้จัดโค้ดให้เป็นระเบียบนะครับ เพื่อให้ง่ายต่อการดูโค้ด

กดบันทึกและรีเฟรชเว็บเบราเซอร์ ผลลัพธ์จะออกมาเป็นดังรูป

คุณสามารถลองเปิดดู source code ที่เบราเซอร์เพื่อดูว่าข้อความเกี่ยวเนื่องบทความในโค้ดฝั่งไคลเอนท์เป็นยัง ไง ยังจำวิธีดู source code ได้ไหมครับ ให้ไปที่ View&#62;Page Source หรือ Source
คำอธิบาย:



&#38;lt;p class=&#34;postmetadata&#34;&#38;gt; และ &#38;lt;/p&#38;gt;

 - ข้อความที่เกี่ยวเนื่องกับบทความจะอยู่ระหว่างแท็ก [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2008/12/22/create-your-wordpress-theme-lesson5_3/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 5_2 : เนื้อหา</title>
		<link>http://www.divland.com/blog/2008/12/07/create-your-wordpress-theme-lesson5_2/</link>
		<comments>http://www.divland.com/blog/2008/12/07/create-your-wordpress-theme-lesson5_2/#comments</comments>
		<pubDate>Sun, 07 Dec 2008 15:12:17 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=320</guid>
		<description><![CDATA[ในบทนี้ ผมจะสอนวิธีการนำเนื้อหาออกมาแสดง แล้วใช้ (Div) เพื่อแยกระหว่างหัวข้อบทความกับเนื้อหาบทความ
เริ่มกันที่  เปิดโฟลเดอร์ &#8220;tutorial&#8221; ขึ้นมา, เปิดเว็บเบราเซอร์ชี้ไปที่ http://localhost/wordpress และเปิดไฟล์ index.php ขึ้นมา
ขั้นตอนที่ 1:
พิมพ์ &#60;?php the_content(); ?&#62; ไว้ใต้หัวข้อบทความ

บันทึก และรีเฟรชเว็บเบราเซอร์ จะมีข้อความปรากฏขึ้นใต้หัวข้อบทความ


เกิดอะไรขึ้น?
เราใช้ฟังก์ชัน the_content() เพื่อเรียกเนื้อหาบทความมาแสดง แต่ตอนนี้ข้อความเหล่านั้นยังไม่ได้ถูกจัดรูปแบบ ยังจำไฟล์  style.css ได้อยู่ไหมครับ ต่อไปเราจะใช้มันควบคุมการแสดงผลเนื้อหา
ในบทความที่แล้ว ผมได้บอกให้คุณโพสบทความมั่ว ๆ หลาย ๆ บทความเพื่อเอาไว้ดูการแสดงผล ถ้าคุณยังไม่ได้ทำก็ขอให้ทำซะนะครับ แล้วมาดูที่หน้าเว็บเบราเซอร์ บทความที่ได้โพสไปจะต้องแสดงผลออกมาหลาย ๆ บทความดังรูป

ต่อไปให้ไปที่เว็บเบราเซอร์ คลิกที่เมนู View แล้วเลือก Page Source หรือ Source หน้าต่างที่เต็มไปด้วยโค้ดจะเด้งขึ้นมา
ถ้าคุณใช้ IE หน้าต่าง notepad จะเด้งขึ้นมา

แต่ถ้าใช้ firefox หน้าตาโค้ดมันจะออกมาเป็นดังนี้ (ดูง่ายหน่อยเพราะมีสีด้วย)

สังเกตุความแตกต่างระหว่างไฟล์ index.php [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2008/12/07/create-your-wordpress-theme-lesson5_2/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 5 : การวนลูป(Loop)</title>
		<link>http://www.divland.com/blog/2008/11/25/create-your-wordpress-theme-lesson5/</link>
		<comments>http://www.divland.com/blog/2008/11/25/create-your-wordpress-theme-lesson5/#comments</comments>
		<pubDate>Tue, 25 Nov 2008 16:13:20 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=322</guid>
		<description><![CDATA[wordpressธีม บทที่ 5 : การวนลูป(The Loop) 
การวนลูปมีความสำคัญมาก เราใช้การวนลูปเพื่อเรียกแต่ละบทความในบล็อกมาแสดง ณ ตอนนี้คุณก็ได้เรียนรู้การสร้างธีมสำหรับwordpressมาบ้างเล็กน้อย มาทบทวนกันอีกทีดีกว่าว่าเรียนอะไรไปบ้างแล้ว 
เรียนอะไรมาบ้างแล้ว?

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

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

โค้ดที่ต้องมีในไฟล์ index.php 

พึงระลึกไว้เสมอว่า วิธีการเรียนรู้ที่ดีสำหรับชุดการเรียนรู้นี้ คือ พิมพ์โค้ดเอง ห้ามคัดลอกไปแปะ 
ขั้นตอนที่ 1
เพิ่ม DIV ไว้ใต้ส่วนหัว(header หรือ ที่วงสีแดง) ตั้งชื่อให้ ID ว่า &#34;container&#34; และต่อจากนี้ไปผมจะเรียกกล่องนี้ว่า กล่องเนื้อหา ดังนี้ 
&#60;div id=&#8221;container&#8221;&#62; 
&#60;/div&#62; [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2008/11/25/create-your-wordpress-theme-lesson5/feed/</wfw:commentRss>
		</item>
		<item>
		<title>เวิร์ดเพรสธีม บทที่ 4 : Header Template</title>
		<link>http://www.divland.com/blog/2008/11/16/create-your-wordpress-theme-lesson4/</link>
		<comments>http://www.divland.com/blog/2008/11/16/create-your-wordpress-theme-lesson4/#comments</comments>
		<pubDate>Sun, 16 Nov 2008 04:09:50 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
		
		<category><![CDATA[Wordpress]]></category>

		<category><![CDATA[theme wordpress]]></category>

		<category><![CDATA[ธีม]]></category>

		<category><![CDATA[เวิร์ดเพรส]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=324</guid>
		<description><![CDATA[ในบทที่แล้วผมได้บอกการติดตั้งธีม และ แนะนำให้รู้จัก php เล็กน้อย สำหรับวันนี้เราจะต่อกันในเรื่องของ php กันอีกนิด และ เรียนรู้วิธีแสดงชื่อบล็อกของเรา
โปรดจำไว้ว่า อย่าคัดลอกโค้ดที่ผมเตรียมไว้ให้ไปใช้นะครับ ให้คุณพิมพ์เอง อย่างน้อยมันจะช่วยให้จำขึ้นใจไงล่ะครับ
ขั้นตอนที่ 1ไปที่โฟลเดอร์ธีมของคุณ ในโฟลเดอร์นั้นจะต้องมีไฟล์ index.php และ style.css
โค้ดข้างในไฟล์ index.php และ style.css จะต้องเหมือนกับ index.txtและ style.txt
ขั้นตอนที่ 2

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

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

ขั้นตอนที่ 3
ไปที่ไฟล์ index.php แล้วให้พิมพ์ &#60;?php bloginfo(’name’); ?&#62; ไว้ระหว่างแท็ก &#60;body&#62; และ &#60;/body&#62; แล้วกด save
กลับไปที่เว็บเบราเซอร์ กดปุ่มรีเฟรช หรือ F5 [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2008/11/16/create-your-wordpress-theme-lesson4/feed/</wfw:commentRss>
		</item>
	</channel>
</rss>
