มาทำ "June write's Previously" กันเถอะ!

posted on 13 Jun 2009 12:39 by chonchon  in HowToBlog

โอ้วววว ในที่สุดcategory

How to blog มีการอัพเดทแล้วว!!!

 

ยังฮาไม่หายตรงที่เมื่อก่อนมีคนแอดบล็อกผมแล้วเขียนว่า

chonchon สอนทำบล็อก ....

ฟังแล้วแทบกระอักเลือด เพราะไอ้นี่มันไม่ค่อยสอนเลย 555
เอาแต่เทคนิคแก้บล็อกแปลกๆมาลง แถมไม่ค่อยบ่อยอีก- -*

วันนี้ได้ไอเดียในการแก้บล็อก เลยได้มีโอกาสอัพ howto ซักที
นั่นก็คือ !!!

June write's Previously!!!

ที่อยู่ตรงsidebarของผมนั่นเอง!~

ซึ่งเป็นอะไรที่เหมาะกับ สาวก June write 
ที่่มีอัพเอนทรีเยอะๆ จนเอนทรีตกอย่างรวดเร็วมากๆ!!!
คนอื่นๆจะได้มาตามอ่านได้!

เพราะนี้คือการเอาwidget previous มาใช้ประโยชน์อย่างสร้างสรรค์
ให้ดูอินเทรนกับ จูนไรท์สุดๆ

มีทั้งดอกไม้ และเฮดกิจกรรมด้วย!

อยากได้บ้างใช่ไหมล่ะ!!! เชิญเลย แจกฟรีๆ

(แต่คนทำเหนื่อยโคตร!!)

  • วิธีทำอย่างง่าย

ถึงจะบอกว่าง่าย แต่ที่จริงก็ต้องแก้เยอะเหมือนกันครับ
ก่อนอื่นก็คือการทำหัว June write 30days 30 entries

ต้องไปที่ theme>CSS editor

และแก้โค๊ดตรง

#sidebar #previous h2,#sidebar2 #previous
ที่อยู่ตามในรูป


โดยใส่โค๊ดนี้ทับไปแทนครับ

 


#sidebar #previous h2,#sidebar2 #previous h2{background:url(http://chonchon.exteen.com/images/junewrite.jpg) no-repeat;width:230px;height:45px;} 


 

มีสองแบบนะครับ  อีกแบบคือ junewrite2.jpg(สำหรับบล็อกที่sidebarสั้น)
ถ้าความยาวมันเกินหรือขาด ก็แก้ไขได้ตรง width นะครับ

 

ต่อไปก็เป็นการใส่ไอค่อนดอกไม้ด้านข้างครับ
อันนี้ถือเป็นการสอนเรื่อง

การใส่ Icon บน side bar ไปในตัว

ก็อปโค๊ดตัวนี้

 


#sidebar .module li, #sidebar2 .module li2{
background:url(http://chonchon.exteen.com/images/junewriteblue.gif) no-repeat;
padding: 0px 0px 0px 15px;

}


 

ไปวางหลังส่วน sidebar .module h2 ตามรูปครับ
วางหลังเครื่องหมาย } นะครับ

 
โค๊ดเมื่อกี้เป็นดอกไม้สีน้ำเงิน
ส่วนใครไม่ชอบสีนี้

ผมก็ทำเตรียมไว้ให้แล้ว!!

(เอนทรีนี้เหนื่อยจริง ทำเองหมด ทำเผื่ออีก)
เพียงแค่เปลี่ยนชื่อตรง Junewriteblue.gif
เป็นสีอื่นครับ เช่น Junewritewhite.gif ก็จะได้สีขาว

โดยสีที่เลือกได้ก็มี

  • white
  • yellow
  • red
  • green
  • blue
  • mix

(ดูตัวอย่างที่ท้ายเอนทรีครับ^^)

 

และถ้าวางโค๊ดทับไปแล้ว กลัวว่าจะเอาของเดิมกลับมาไม่ได้
ก็สามารถกลับมาดู โค๊ดที่นี่ได้ครับ เผื่อไว้ให้แล้ว

 


#sidebar #previous h2,#sidebar2 #previous h2{background:url(http://g.exteen.com/t/darkapollo/hd_previous.png) no-repeat;width:104px;height:23px;}


 

 

ทีนี้ก็มาถึงขั้นตอนปรับตำแหน่ง  ให้ไปที่ Theme>widget

แนะนำให้เอา widget ที่เกะกะ เช่น recommend, categories, archives ออก
เพื่อทำให้สังเกตเห็นง่ายครับ ว่าเราร่วมกิจกรรม June write อยู่


จากนั้นเอาwidget previous มาใส่
และควรอยู่ต่อจาก widget June write ครับ จะได้เห็นชัดๆ

และก็ปรับแต่ง Previous ให้มีเอนทรีเท่ากับที่เขียนอยู่ในเดือนนี้ ตามภาพครับ
จะได้รู้ว่า๋June writeเริ่มต้นจากเอนทรีไหน ถ้าอัพทุกวันก็ต้องมานั่งแก้ทุกวัน!

 
แต่มัน max ที่ 20 เอง พี่แชมป์ แก้เป็น30ด่วนนนนน

เพียงเท่านี้ คุณก็จะได้ แคทตาล็อก June write อันสวยงามมาไว้ที่
sidebar อวดคนที่เข้ามาอ่าน และช่วยให้เขารดน้ำต้นไม้เราง่ายขึ้นด้วย!
เพราะมันจะอยู่ข้างล่าง widget june write เหมือนช่วยเตือนสติว่า
"รดน้ำให้ด้วย!"


 

  • วิธีทำแบบยาก

สำหรับคนที่แก้ CSS และแต่งรูป เป็นอยู่แล้ว
ผมขอลง source file ไว้ให้ละกันครับ  เซฟโลด
เชิญเอาไปใช้ปรับ ให้เข้ากับบล็อกของท่านตามสะดวก


แบบยาว


แบบสั้น(ตัดทิ้งได้)

white

yellow

red

green

blue

mix!!!(เจ๋งป่ะล่ะ)

ใครเอาไปใช้ก็บอกด้วยนะครับจะตามไปดู
และสงสัยอะไรก็ถามได้นะครับ จะพยายามช่วย
(เพราะไม่เก่งCSSเหมือนกัน)

ปล. จบเดือนไปก็อย่าลืมเปลี่ยนกลับเป็นเหมือนเดิมนะครับ
แต่ถ้าชอบดอกไม้ ก็ใช้ต่อโลด 555

ปล2.อย่าลืมให้ดาวเยอะๆ ชาวEXTEEN จะได้มาเล่นกันเยอะๆ

Comment



smilebig smileopen-mounthed smileconfused smilesad smileangry smiletonguequestionembarrassedsurprised smilewinkdouble winkcry

Tweet

จ เจ๋ง =[]=b

สุดยอดดcry

ขอรับไปใช้น่ะค่ะ

ปล.chonchonสอนทำบลอค หึหึ

#1 By - M E W Z - on 2009-06-13 12:46

Hot! confused smile

#2 By DaZe_erk on 2009-06-13 13:48

เยี่ยมเลย ขอลองศึกษาดูหน่อยนะ (ไม่เป็น)

ขออภัยดับเบิ้ลคอมเมนต์ ฮาๆsad smile

#3 By DaZe_erk on 2009-06-13 13:49

น่าทำ...แต่เห็นโค้ดแล้ว...sad smile
(ความทรงจำสุกสยองมาเยือน...)
แต่มันก็น่าทำจริงๆนะ...Hot!

#4 By araignee on 2009-06-13 13:54

Hot! Hot!
สุดยอดเล้ยย แต่เจ้ทำไม่เป็นอ่า

#5 By ๛Girl In Game๛ on 2009-06-13 13:57

sidebar in trend Hot!

#6 By Aklare on 2009-06-13 14:47

สวยดีค่ะ Hot! Hot!

#7 By Daughter Of Sparda on 2009-06-13 14:58

โอ้โห้ เอาไปประยุคใช้ดีกว่า ขอบคุณครับ ความรู้ๆๆๆๆ Hot!

#8 By gol-a-khung on 2009-06-13 16:11

ในที่สุดก็มีคนโมฯจูนไรท์ Hot!

#9 By on 2009-06-13 17:04

เห็น code พวกนี้แล้ว มึนๆ ไงไม่รู้

ฮ่าๆ รดน้ำให้นะคะ Hot!

#10 By Milana (มิลานะ) on 2009-06-13 17:50

รับไว้พิจารณาค่ะ big smile
ดอกไม้สวยดีอะ
Hot!

#11 By Hirumi Arika on 2009-06-13 19:09


อยากเล่นเป็นทุกอย่างเลย.. แต่โลว์เทคเกินค่ะ
แค่อ่านยังไม่เข้าใจเลย..
Hot!

#12 By แอ้ on 2009-06-13 22:54

เจ๋งเป้งค่า Hot!

#13 By อีฟ on 2009-06-14 01:37

โอ้ววว ขอบคุณมากค่า

เดี๋ยวขอเอาไปปรับใช้เน้อ(แบนเนอร์ด้วย เคร้ๆ)
Hot! Hot! Hot!
ความคิดดีนะเนี่ย จะได้สมกับที่เป็นJuneWriteconfused smile
ชอบไอเดียดอกไม้ น่ารักๆๆๆcry
พี่แช้มป์เข้ามาดูด่วน ได้เปลี่ยนเป็น30เอนทรี่ อิอิquestion

Hot! Hot!
Hot!

#16 By Little Lamb on 2009-06-14 11:23

โห~ 30 เอนทรี่ ยาวไปมั้ง sad smile

#17 By cartoonst on 2009-06-14 12:08

ขอน้อมรับนำไปใช้ด้วยความขอบคุณครัย Hot! Hot! Hot!

#18 By บราอู1984 on 2009-06-14 13:02

ขอบคุณค๊าconfused smile

#19 By ewa on 2009-06-14 13:19

Hot! แหล่มค่ะ

(แต่คงไม่ทำเอง เพราะเขียนจูนไรท์ไปไม่กี่เอนทรี่เอง TTATT)

#20 By Rio ▪ V Ĭ P ▪ on 2009-06-14 13:31

เทพ ๆ

Hot!

#21 By Dhammasarokikku on 2009-06-14 14:19

เยี่ยม! เดี๋ยวลองทำดูนะคะbig smile Hot!

#22 By ICEgotcha! on 2009-06-14 16:04

น่าสนใจ
แต่แก้โค้ดไม่เป็น

#23 By canta+! on 2009-06-14 17:08

เเจ่มสุดยอด ตบมือๆ Hot! Hot! Hot!

#24 By ►JuNo★iji◄ on 2009-06-14 17:54

Hot! ดีจังๆ

ไว้จะลองทำดูค่ะ

#25 By finch on 2009-06-14 20:31

เจ๋งdouble wink double wink double wink

#26 By Fenfen on 2009-06-14 21:05

ว้าวๆ อยากทำอ่ะ แต่ลืมไปนานแล้ว

ต้องไปรื้อฟื้นก่อนค่ะ เฮ้ออ

#27 By sebin_เซบิน on 2009-06-16 01:36

เค้าไม่ได้ทำเลยอ่ะ
กลัวแห้งแ้ล้งตาย


แวะมารดน้ำต้นไม้จ้าาาา

#28 By J.M.P---Moo-Moo on 2009-06-23 18:55

Favourites