เอนทรีนี้จะสอนวิธีการเอารูปมาใส่ในชื่อที่เราตั้งเวลาสร้าง Page น่ะค่ะ ตัวอย่างเช่น ในส่วน Page ของบลอคเจนเนสซ่า จะมีรูปดอกไม้ข้าง ๆ ชื่อเรื่องอยู่ ดังรูป (ดูข้างบนก็ได้ค่ะ)

 

 

วิธีทำง่ายมากกกก ไปดูกันเลยค่ะ

1. เตรียมรูปที่จะใช้ก่อนค่ะ โดย upload ขึ้นที่ Exteen เพื่อให้มี url ของรูปก่อน (หรือจะ upload ไว้ที่อื่นก็ได้นะ) ตัวอย่าง URL ของรูป ดังข้างล่าง

http://jennessa.exteen.com/images/155.gif

.

2. ถ้ามี Page อยู่แล้ว ก็กด Edit เข้าไปเลยค่ะ หรือในกรณีสร้างใหม่ก็ทำเหมือนกันค่ะ คือ ในหน้าเพิ่ม/แก้ไข Page ให้ดูตรง Title ที่เราเอาไว้ใส่ชื่อ Page ดังรูป เดี๋ยวเราจะใส่ code ตรงนี้

 


 

3. ทีนี้ code html ที่จะทำให้รูปแสดงก็คือ tag < img > เราก็เอา url รูป (จากข้อ 1) ไปใส่เป็น src ค่ะ ออกมาเป็นอย่างข้างล่าง อย่าลืมใส่ border="0" ด้วยนะคะ

< img src="http://jennessa.exteen.com/images/155.gif" border="0"/>

.

4. code จากข้อ 3 เหมือนเป็นตัวแทนรูปที่เราจะใช้นะคะ :D อยากให้รูปอยู่ตรงไหนของชื่อเรื่อง ก็ใส่ code นั้นลงไปในช่อง Title (รูปข้อ 2) ค่ะ สมมติว่าจะใส่รูปหน้าชื่อเรื่อง ในช่อง Title ก็จะออกมาเป็น

< img src="http://jennessa.exteen.com/images/155.gif" border="0"/> Blog Map

.

5. แล้วก็กด Publish ได้เลยค่า แค่นี้เอง

.

อันนี้ตั้งชื่อเรื่องเป็น ตอนที่ 1 แต่ยังคิดตอนที่ 2 ไม่ออกเลยค่ะ 55 เอาไว้ถ้ามีวิธีอะไรอีกแล้วจะเอามาบอกนะคะ มีคำถามก็คอมเมนต์ไว้นะ (^^)V

ปล. ** เครื่องหมาย < กับคำว่า img ตอนเอาไปใช้ให้เขียนติดกันนะคะ ในนี้เว้นวรรคไว้เพื่อไม่ให้ code โดน rip ออกไปค่ะ

เพิ่มเติมจากคุณ iPats  สามารถทำด้วย CSS ก็ได้นะคะ ตาม code ข้างล่างเลยค่า ขอบคุณมากนะคะ (^^)

#pagemenu ul li a:after {content: url("http://jennessa.exteen.com/images/155.gif");}
#pagemenu ul li a:before {content: url("http://jennessa.exteen.com/images/155.gif");}

 

credit : เจนเนสซ่า

Comment

Comment:

Tweet

ขอบคุณค่ะ กำลังหาวิธีแต่งอยู่เลย

#8 By kOREwa on 2012-09-11 13:45

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

#6 By เจนเนสซ่า on 2011-06-08 10:36

แต้งกิ้วว

#5 By จุด on 2011-03-26 13:38

ขอบคุณมากคะ ^_^

#4 By S u N m U l 0 0 1 9 on 2010-08-07 16:48

<a href="http://ahflunrxwvzynmm.com">klozgqxxvcyyrdt</a> http://wvgtvxguidqgtuj.com [url=http://oigcjytcehrunoi.com]bcipabnyqhiawxe[/url]

#3 By jdpxesrycj (94.102.52.87) on 2010-06-14 10:42

ทำได้แว้ววค่า ขอบคุณมากๆเลยค่ะ
ปล. บลอคคุณให้วิธีการแต่งบลอคละเอียดจริงๆเลยล่ะค่ะ Hot! Hot! Hot!

#2 By Ayumi Hector on 2010-03-09 01:29

ขอบคณมากๆเลยค่ะ ^^

#1 By Sinbi ♥ on 2009-12-14 00:05