<?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/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" 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>
	<lastBuildDate>Thu, 17 Dec 2009 08:24:14 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.6</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" type="application/rss+xml" href="http://feeds.feedburner.com/divland" /><feedburner:info xmlns:feedburner="http://rssnamespace.org/feedburner/ext/1.0" uri="divland" /><atom10:link xmlns:atom10="http://www.w3.org/2005/Atom" rel="hub" href="http://pubsubhubbub.appspot.com/" /><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><item>
		<title>วิธีสร้าง facebook fanpage</title>
		<link>http://www.divland.com/blog/2009/12/17/how-to-create-facebook-fanpage-become-a-fan/</link>
		<comments>http://www.divland.com/blog/2009/12/17/how-to-create-facebook-fanpage-become-a-fan/#comments</comments>
		<pubDate>Thu, 17 Dec 2009 08:06:14 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
				<category><![CDATA[Webmaster talks]]></category>
		<category><![CDATA[become a fan]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[fanpage]]></category>
		<category><![CDATA[fb]]></category>
		<category><![CDATA[เฟซบุ๊ค]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=452</guid>
		<description><![CDATA[ช่วงนี้ผมซุ่มเงียบทำเว็บไซต์ขายของ  ก็เลยลองเสิชหาวิธีสร้าง Facebook ที่เป็นหน้าของเว็บไซต์ หรือร้านค้า ให้มีปุ่ม become a fan ก็ไปเจอสไลด์ตัวนึงน่าสนใจ เลยเอามาแปะให้ดูกัน เผื่อใครอยากจะสร้างบ้าง กดปุ่ม full ที่แถบด้านล่างดูแบบเต็มจอได้เลยครับ
การสร้าง facebook page หรือ fan page สำหรับ การตลาด พีอาร์ ประชาสัมพันธ์ CRM

ส่วนใครที่ยังใช้งานอะไรไม่เป็นก็ลองอ่านที่ลิ้งค์นี้นะครับ
http://www.facebookgoo.com/รวมวิธีการใช้งาน-facebook/
]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/12/17/how-to-create-facebook-fanpage-become-a-fan/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>โปรแกรมทำ css layout</title>
		<link>http://www.divland.com/blog/2009/11/20/css-layout-program/</link>
		<comments>http://www.divland.com/blog/2009/11/20/css-layout-program/#comments</comments>
		<pubDate>Fri, 20 Nov 2009 04:17:44 +0000</pubDate>
		<dc:creator>Divland's prince</dc:creator>
				<category><![CDATA[CSS tools]]></category>
		<category><![CDATA[css layout]]></category>
		<category><![CDATA[โปรแกรม css]]></category>

		<guid isPermaLink="false">http://www.divland.com/blog/?p=438</guid>
		<description><![CDATA[แจกโปรแกรมสำหรับสร้าง css layout เลือกๆ ลากๆ แล้ววางได้เลย ดูวิธีใช้งาน
1. ตรงกล่องขวามือ มีให้เลือกมากมาย ตามรูป ลากเมนูมาวาง

2.จากนั้นก็จะได้เมนูตามต้องการ ง่ายมากๆ


3.จากนั้น ลากกล่องอื่นๆมาวางบ้าง ตามลำดับ บางชนิดจะไว้เป็นบาร์ด้านข้างก้ได้ เรียงลำดับกล่องต่างๆได้

4.เราก็จะได้เว็ปตามภาพ

5.สามารถปรับ css ของกล่องแต่ละกล่องได้ เช่น ฟอนต์ สี ขนาด อื่นๆ
6.จากนั้นก็จัดการ Export ออกมา
7.จากนั้นเราก็จะได้ไฟล์เว็ป แยกรูปไว้
และภายในไฟล์ html นี้ ก็จะเขียนไว้ในรูปแบบ

 และ css แต่จะฝัง css ไว้ข้างใน html 
ดาวน์โหลดไปลองใช้กันได้
ดาวน์โหลดจาก mega upload
เครดิตจาก http://www.thaiseoboard.com/index.php/topic,82463.0.html
]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2009/11/20/css-layout-program/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<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>
		<slash:comments>12</slash:comments>
		</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; &#8211; เปิดแท็ก list item
&#60;h2&#62; &#8211; เปิดแท็กหัวข้อรอง
&#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>
		<slash:comments>14</slash:comments>
		</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>
		<slash:comments>8</slash:comments>
		</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; &#8211; เปิดแท็ก unordered list
&#60;/ul&#62; &#8211; ปิดแท็ก 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>
		<slash:comments>7</slash:comments>
		</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; &#8211; เริ่มต้นส่วนที่เป็น div ที่เอาไว้ครอบลิงค์ไปยังหน้าก่อนหน้าและหน้าถัดไป
&#60;?php &#8211; เริ่มต้นส่วนที่เป็นโค้ดภาษา php
posts_nav_link() &#8211; เรียกลิงค์ไปยังหน้าก่อนหน้าและหน้าถัดไปขึ้นมาแสดง
; &#8211; สิ้นสุดคำสั่ง
?&#62; &#8211; สิ้นสุดส่วนที่เป็นโค้ดภาษา php
&#60;/div&#62; &#8211; สิ้นสุดส่วนที่เป็น 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>
		<slash:comments>5</slash:comments>
		</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>
		<slash:comments>4</slash:comments>
		</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;

 &#8211; ข้อความที่เกี่ยวเนื่องกับบทความจะอยู่ระหว่างแท็ก [...]]]></description>
		<wfw:commentRss>http://www.divland.com/blog/2008/12/22/create-your-wordpress-theme-lesson5_3/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</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>
		<slash:comments>5</slash:comments>
		</item>
	</channel>
</rss>
