<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	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/"
	>

<channel>
	<title>jQueryTips by Tee++; &#187; Editor</title>
	<atom:link href="http://www.jquerytips.com/tag/editor/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.jquerytips.com</link>
	<description>Coding is fun.</description>
	<lastBuildDate>Sun, 25 Apr 2010 11:30:33 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>markItUp! Editor plugin ชั้นเทพ</title>
		<link>http://www.jquerytips.com/2008/06/22/markitup-jquery-plugin/</link>
		<comments>http://www.jquerytips.com/2008/06/22/markitup-jquery-plugin/#comments</comments>
		<pubDate>Sun, 22 Jun 2008 16:41:57 +0000</pubDate>
		<dc:creator>Tee++;</dc:creator>
				<category><![CDATA[Plugins]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Editor]]></category>
		<category><![CDATA[WYSIWYG]]></category>

		<guid isPermaLink="false">http://www.jquerytips.com/2008/06/22/markitup-jquery-plugin/</guid>
		<description><![CDATA[ห่างหายจากการอัพเดทไปเป็นเดือน สาเหตุนั้นไม่ต้องกล่าวถึง &#8220;ขี้เกียจ&#8221; ฉะนั้น นานๆทีมาอัพเดท จึงขอแนะนำของสุดยอดเลยละกัน 
&#8220;markItUp! Universal markup editor&#8221; เป็น editor plugin ของ jQuery ที่มีความสามารถมากมาย โดยแค่เรา แต่กำหนด textarea พร้อม class หรือ id เข้าไป พอเรียกใช้ plugin ตัวนี้มันจะมาเปลี่ยนให้เป็น editor หน้าตางามๆ ให้หลงไหลกัน 

ซึ่งข้อดีของ Editor ตัวนี้มีหลายอย่างอาทิเช่น
1. สามารถใช้ Syntax ได้หลายอย่าง Html, BBcode, Textile, Markdown, Wiki, Dotclear
2. ใช้งานง่ายไม่ต้อง Config อะไรวุ่นวาย
3. มี Add-ons ให้ ดาวน์โหลดไปใช้เพิ่มความสามารถตามที่เราต้องการ
4. มี Skin ให้เลือกใช้ได้ โดยดาวน์โหลดจากเวบได้เลย
5. มี Preview [...]]]></description>
			<content:encoded><![CDATA[<p>ห่างหายจากการอัพเดทไปเป็นเดือน สาเหตุนั้นไม่ต้องกล่าวถึง &#8220;ขี้เกียจ&#8221; ฉะนั้น นานๆทีมาอัพเดท จึงขอแนะนำของสุดยอดเลยละกัน </p>
<p>&#8220;<a href="http://markitup.jaysalvat.com/home/">markItUp! Universal markup editor</a>&#8221; เป็น editor plugin ของ jQuery ที่มีความสามารถมากมาย โดยแค่เรา แต่กำหนด textarea พร้อม class หรือ id เข้าไป พอเรียกใช้ plugin ตัวนี้มันจะมาเปลี่ยนให้เป็น editor หน้าตางามๆ ให้หลงไหลกัน <span id="more-32"></span></p>
<p><a href='http://www.jquerytips.com/wp-content/uploads/2008/06/markitup_editor.jpg' title='markitup_editor.jpg'><img src='http://www.jquerytips.com/wp-content/uploads/2008/06/markitup_editor.thumbnail.jpg' alt='markitup_editor.jpg' /></a></p>
<p>ซึ่งข้อดีของ Editor ตัวนี้มีหลายอย่างอาทิเช่น</p>
<p>1. สามารถใช้ Syntax ได้หลายอย่าง Html, BBcode, Textile, Markdown, Wiki, Dotclear<br />
2. ใช้งานง่ายไม่ต้อง Config อะไรวุ่นวาย<br />
3. มี Add-ons ให้ ดาวน์โหลดไปใช้เพิ่มความสามารถตามที่เราต้องการ<br />
4. มี Skin ให้เลือกใช้ได้ โดยดาวน์โหลดจากเวบได้เลย<br />
5. มี Preview function ในตัว<br />
6. ข้อสุดท้ายสำคัญมาก <strong>It Free!</strong> (MIT/GPL)</p>
<p>เอาล่ะ นับข้อดีได้ตั้ง 6 ข้อแล้วมา ลองของกันดีกว่า </p>
<p><strong>Software Required</strong><br />
1. jQuery<br />
2. markItUp JS<br />
3. markItup Settings<br />
4. markItUp Css</p>
<p>*** ดาวน์โหลดจากเวบของ markItUp! ได้ทั้งหมด ***</p>
<p><strong>Installation</strong><br />
1. Include jQuery กับ Core ของ markItUp! เข้ามา</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;script type=<span class="st0">&quot;text/javascript&quot;</span> src=<span class="st0">&quot;jquery.js&quot;</span>&gt;&lt;/script&gt;</div>
</li>
<li class="li1">
<div class="de1">&lt;script type=<span class="st0">&quot;text/javascript&quot;</span> src=<span class="st0">&quot;markitup/jquery.markitup.js&quot;</span>&gt;&lt;/script&gt;</div>
</li>
</ol>
</div>
<p>2. Include settngs ใน JSON format เข้า</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;script type=<span class="st0">&quot;text/javascript&quot;</span> src=<span class="st0">&quot;markitup/sets/default/set.js&quot;</span>&gt;&lt;/script&gt;</div>
</li>
</ol>
</div>
<p>3. Include CSS </p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;link rel=<span class="st0">&quot;stylesheet&quot;</span> type=<span class="st0">&quot;text/css&quot;</span> href=<span class="st0">&quot;markitup/skins/markitup/style.css&quot;</span> /&gt;</div>
</li>
<li class="li1">
<div class="de1">&lt;link rel=<span class="st0">&quot;stylesheet&quot;</span> type=<span class="st0">&quot;text/css&quot;</span> href=<span class="st0">&quot;markitup/sets/default/style.css&quot;</span> /&gt;</div>
</li>
</ol>
</div>
<p>4. เรียกใช้งาน</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&lt;script type=&quot;text/javascript&quot; &gt;
</div>
</li>
<li class="li1">
<div class="de1">&nbsp; &nbsp;$(document).ready(function() {
</div>
</li>
<li class="li1">
<div class="de1">&nbsp; &nbsp; &nbsp; $(&quot;#markItUp&quot;).markItUp(mySettings);
</div>
</li>
<li class="li1">
<div class="de1">&nbsp; &nbsp;});
</div>
</li>
<li class="li2">
<div class="de2">&lt;/script&gt;
</div>
</li>
<li class="li1">
<div class="de1">&#8230;
</div>
</li>
<li class="li1">
<div class="de1">&lt;textarea id=&quot;markItUp&quot;&gt;&lt;/textarea&gt;</div>
</li>
</ol>
</div>
<p>เพียงเท่านี้ textarea ที่มี id=markItUp จะกลายเป็น Editor ทันที ง่ายใช้มั้ยล่า ^^</p>
<p>นอกจากนี้ยังมี Setting อีกมากมายให้เลือกปรับแต่ง ลองไปดูกันเองได้ที่เวบผู้พัฒนาเลยครับ</p>
<p><a href="http://markitup.jaysalvat.com/downloads/" target="_blank">Download</a><br />
<a href="http://markitup.jaysalvat.com/documentation/" target="_blank">Document</a><br />
<a href="http://markitup.jaysalvat.com/examples/" target="_blank">Examples</a></p>
<p>ลองไปศึกษาต่อกันเอาเองนะครับ ตัวนี้ถึงความสามารถจะไม่เท่าพวก WYSIWYG ที่รวมมาเสร็จสรรพ พร้อม File Manager แต่รับรอง ใช้งานง่ายจนคุณจะเปลี่ยนใจจากตัวอื่นเลยล่ะ </p>
]]></content:encoded>
			<wfw:commentRss>http://www.jquerytips.com/2008/06/22/markitup-jquery-plugin/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
	</channel>
</rss>
