Latest News

วันศุกร์ที่ 2 ธันวาคม พ.ศ. 2554

วิธีใส่ Emotion ใน Commemt Box


ถ้ามีไอคอนแสดงอารมณ์ตรงคอมเม้นก็คงดูดีไปอีกแบบนะค่ะ 
การเติม Emotion ใน Commemt Box มีขั้นตอน ดังนี้

ขั้นตอนที่ 1. เข้าสู่บล็อก 
ไปที่หน้าแดชบอร์ด www.blogger.com ดูในส่วนของตัวเลือกเพิ่มเติม ไปที่ แม่แบบ

ขั้นตอนที่ 2. แก้ไข HTML คลิก แก้ไข HTML กด Ctrl+F หาโค้ด

<b:if cond='data:post.embedCommentForm'> หรือ <b:include data='post' name='comment-form'/>

ขั้นตอนที่ 3. นำโค้ดที่ให้นี้วางบนโค้ด ดังกล่าว

<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddf; height:86'> 
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif' width='18'/> :))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/71.gif' width='18'/> ;))
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif' width='18'/> ;;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif' width='18'/> :D
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif' width='18'/> ;)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif' width='18'/> :p
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif' width='22'/> :((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif' width='18'/> :)
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif' width='18'/> :(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif' width='18'/> :X
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif' width='18'/> =((
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif' width='18'/> :-o
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif' width='20'/> :-/
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif' width='18'/> :-*
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif' width='18'/> :|
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif' width='24'/> 8-}
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif' width='31'/> :)]
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif' width='44'/> ~x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif' width='30'/> :-t
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/66.gif' width='18'/> b-(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/62.gif' width='18'/> :-L
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif' width='34'/> x(
<img border='0' height='18' src='http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif' width='30'/> =))
</b>
</div>


อธิบายโค้ด

<div style='-moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 369; text-align: left; border: 1px solid #cccccc; padding: 5px; background: #eeeddfheight: 86'

width: 369 ความกว้างของกรอบไอคอนแสดงอารมณ์
1px ความหนาของBorder solid รูปแบบของ Border ดู Border แบบต่างๆ
#cccccc สีของเส้น Border
padding: 5px;
#eeeddfโค้ดสีของพื้นหลังกล่อง
height: 86 ความสูงของกล่องไอคอนแสดงอารมณ์

<img border='0' height='18' src='URL รูปภาพไอคอนแสดงอารมณ์width='18'/> :))

width='18' ความกว้างของไอคอนแสดงอารมณ์
height='18' ความสูงของไอคอนแสดงอารมณ์
URL รูปภาพไอคอนแสดงอารมณ์
:)) ตรงแสดงความคิดเห็นถ้าใส่ :)) ไปก็จะแสดงภาพไอคอนแสดงอารมณ์ดังกล่าว


ถ้าวางบนโค้ด <b:if cond='data:post.embedCommentForm'> ไอคอนแสดงอารมณ์จะอยู่ด้านบนกล่องคอมเม้นดังภาพ แต่ถ้าวางไว้บนโค้ด <b:include data='post' name='comment-form'/> ไอคอนแสดงอารมณ์จะอยู่ด้านล่างของกล่องคอมเม้นค่ะ

ขั้นตอนที่ 4.เมื่อจัดวางโค้ดดังกล่าวเสร็จ ก็หาโค้ด </body>
เมื่อหาเจอแล้วให้ นำ code ด้านล่างนี้วางไว้ก่อน code ดังกล่าว

<script src='https://sites.google.com/site/meesubandmeesuksite/myfile/smiley.js'type='text/javascript'/><noscript><a href='http://www.bloggerstop.net'target='_blank'><span style='font-size: x-small;'>Add Smilies</span></a></noscript>

ขั้นตอนที่ 5.เมื่อทำตามทุกขั้นตอนเสร็จหมดแล้ว
ก็บันทึกแม่แบบและดูผลลัพธ์ได้เลยค่ะ

เครดิตโค้ด bloggerstop.net
อ้างอิงข้อมูล : www.xn--12cbx4dabh2a2b6ao8eg1i0a6le6kj.com

3 ความคิดเห็น:

  1. สวัสดีค่ะ คือว่าสอนวิธีใส่โค้ดอีโมหัวหอมในบล็อกได้มั้ยคะ
    ทำหลายทีบนกล่องความเห็นก็ยังเป็นข้อความโค้ดอะค่ะ

    ตอบลบ
  2. ลงในบล็อกเกอร์นะคะ ขอบคุณมากค่ะ

    ตอบลบ
  3. ถ้าต้องการจะเปลี่ยนรูปภาพก็ต้องแก้ไขสคริป ซึ่งเป็นสคริปที่ทาง www.bloggerstop.net เป็นคนเขียนทางเราไม่สามารถเปลี่ยนแปลงได้ค่ะ

    แต่ถ้ามีปัญหาเรื่องการแสดงผลหรือเป็นส่วนที่เราจะสามารถแก้ไขสอบถามมาได้เลยค่ะ

    ตอบลบ

หากบทความเกิดความผิดพลาดประการใดต้องขออภัยและช่วยชี้แนะด้วยนะคะ ^^

PakamasBlog

Add us on Google+