HowToBlog

มาทำ "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 จะได้มาเล่นกันเยอะๆ

Favourites