theme

มันคือ..ธีมเก่า

posted on 10 Jun 2008 21:44 by oatato in Messages

เปลี่ยนธีมแล้วนะครับ อย่าลืมกด F5 กันเหนียว

ชื่อของธีมใหม่ คือ "ธีมเก่า"
ทำไงได้ ก็มันช่างเป็นธีมใหม่ที่ดูเก่าผุพังขมังเวทย์ขนาดนี้

ใครอาจจะงง ๆ ว่าตกลงควรจะเรียกว่าธีมใหม่หรือเก่าดีหว่า
เอาเถอะ เดี๋ยวพอนานเข้า ไอ้ที่เคยเรียกว่าใหม่ มันก็กลายเป็นเก่าเองนั่นแหละ

ถึงวันนั้นก็คงจะเรียกว่า "ธีมเก่า ๆ" ละกัน

เหตุผลที่เปลี่ยน : ยังมาไม่ถึง เลยไม่รู้จะบอกยังไง อุบไว้ดีกว่า

. . . 

มาเฉลย : ถึง 250,000 แล้วครับ แถมเลยไปแล้วด้วย จับแบบเป๊ะ ๆ ไม่ทัน

 

สืบเนื่องจากวิธีการขยายขนาดความกว้างของบล็อก
จนทำให้มีพื้นที่เพิ่มเติมสำหรับเขียนเอ็นทรีกันอย่างเมามัน

เมื่อได้พื้นที่เพิ่มขึ้นมาแล้ว หลายคนอาจจะเริ่มมองถึงเทคนิคขั้นถัดไปที่จะเอามาทำให้
บล็อกซับซ้อนขึ้นไปอีกขั้นหนึ่ง นั่นคือ การทำ sidebar ให้โผล่ขึ้นมาในบล็อกทั้งสองฝั่ง

ซึ่งผมจะไม่เขียนอธิบายวิธีการทำ sidebar แบบนั้นให้หรอก

. . .

นั่น งงกันใหญ่ ( บางคนถึงกับบ่นอุบว่า แล้วเอ็งจะเขียนเกริ่นมาทำปลากระป๋องทำไม )

. . .

เชอะ ชิ ชะ ก็ที่ไม่เขียน เพราะจะมาแนะนำเอ็นทรีที่มีคำอธิบายวิธีการเอาไว้อย่างละเอียดดี
และเข้าใจง่ายอยู่แล้วต่างหาก นั่นคือเอ็นทรีเรื่อง "ทำบลอคที่มีเมนูทั้งซ้าย-ขวากัน" ของคุณ sa-i

ตอนนี้คิดว่าคนส่วนใหญ่คงจะเริ่มชินกับการแต่งธีมหรู ๆ ในเวอร์ชั่นใหม่แล้ว (หลังจากที่มึนกัน
มาอยู่ระยะหนึ่ง) คาดว่าตอนนี้คงจะมีคนเริ่มสนใจที่จะแต่งธีมให้ซับซ้อนขึ้นไปอีกระดับหนึ่ง
แต่ก็ยังไม่เห็นมีลิ้งค์ไปที่เอ็นทรีนั้นเสียที ทั้งที่คุณ sa-i เขียนเอาไว้ตั้งแต่วันแรก ๆ ทีเอ็กทีน
เปลี่ยนเวอร์ชั่น ก็เลยอยากเอามานำเสนอให้ทั่วถึงกันอีกครั้งหนึ่ง

หากใครสนใจก็ลองไปปรับแต่งบล็อก ตามคำอธิบายนั้นละกันครับ ไม่ยากอย่างที่คิดหรอก

แต่ยังไงก็ตาม ผมยังก็คิดว่าบล็อกต้องกว้างหน่อยล่ะ

ป.ล.
เห็นคุณเจ้าชายน้อยแต่งบล็อกแบบใหม่ โดยการนำเอา sidebar ไปแปะติดกันในฝั่งเดียว
ซึ่งดูแล้วดูเท่ห์ดีทีเดียว (หมายถึงตัวบล็อกนะครับ ส่วนเจ้าของบล็อกนั้นเป็นอีกเรื่องหนึ่ง
ที่ผู้เยี่ยมชมคงต้องค้นคว้าและวิจัยเพื่อหาคำตอบกันเอาเอง) ... อย่างนี้ต้องลอง

สิ่งที่ค้นพบเกี่ยวกับแถบเมนูสีดำ ในตำแหน่งด้านบนของบล็อก

  1. น่าจะเรียกว่า Admin bar
  2. ข้อมูลธีมของ Admin bar ไม่ได้ถูกกำหนดใน CSS Editor
    แต่ถูกเก็บไว้ในไฟล์ CSS อีกไฟล์หนึ่ง ที่แก้ไขไม่ได้
  3. ชื่อ element สำหรับการปรับ stylesheet ของ Admin bar คือ #adminbar
  4. โดยหลักการ เราสามารถใช้ CSS Editor เพิ่มบรรทัดเพื่อเปลี่ยนค่าของ stylesheet
    ของ element ใด ๆ ก็ได้ ไม่ว่ามันจะถูกตั้งค่ามาก่อนหน้านี้แล้วกี่ครั้งก็ตาม
  5. แต่สำหรับ element ที่ชื่อ #adminbar แล้ว เราจะไม่สามารถแก้ไขธีมนั้นได้ด้วย CSS เพราะว่าถ้าเราพยายามเข้าไปเพิ่ม stylesheet ที่ชื่อ #adminbar แล้ว
    ทันทีที่กดบันทึก ชื่อ element จะเป็นไปเป็น #adminbar_notallow
  6. notallow แปลว่า ไม่อนุญาต ซึ่งสื่อว่า element นี้ไม่สามารถแก้ไขปรับแต่งได้

ในความเป็นจริงแล้ว ยังมีช่องทางในการปรับแต่งแก้ไขธีมของ Admin bar ได้อยู่ดี
แต่ไม่รู้ว่าจะมีปัญหาอะไรตามมาหรือเปล่า ถ้ามันถูกปรับแต่งได้ตามใจชอบ หรือถูกทำให้หายไป

ดังนั้น จนกว่าจะค้นพบคำตอบนั้น จึงขอเก็บไว้เป็นความลับก่อนละกัน

หรือใครสามารถแฮ็กวิธีการนี้เอาออกไปใช้ได้ก่อน ก็เชิญตามสบายครับ

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

มาอัพเดตว่าพบคำตอบนั้นแล้ว

ว่าคุณแชมป์ต้องการให้เป็น admin bar ที่มีรูปแบบเดียวกันทั้งเว็บครับ

ดังนั้นผมจะกลับไปใช้ธีมแบบเดิมครับ

ป.ล. ไม่มีการเฉลยนะ

ใครกำลังประสบปัญหาเนื้อที่การเขียนเอ็นทรีในบล็อกน้อยไปหรือเปล่า

วันนี้จะมานำเสนอวิธีขยายความกว้างพื้นที่แสดงข้อความในเอ็นทรีกัน
เป้นวิธีปรับแต่งความกว้าง สำหรับธีมเวอร์ชั่นใหม่ของเอ็กทีนโดยเฉพาะเลย

ในตัวอย่างจะขยายความกว้างขึ้นอีก 100px (pixels) เพราะง่ายต่อความเข้าใจครับ

ให้ไปที่ Tab ชื่อ Theme
> คลิกที่ปุ่ม Edit ของธีมที่ต้องการ
> หน้าจอ CSS Editor จะโผล่ขึ้นมา
>
ให้แก้ไขข้อมูลของธีมที่ถูกเลือกในจุดต่าง ๆ ตามนี้

#page
#header, #neck, #belly, #leg, #footer
ให้แก้ไขค่า width จาก 780px เป็น 880px

#coverimage
#neck .module
#leg .module
ให้แก้ไขค่า width จาก 730px เป็น 830px

#content
ให้แก้ไขค่า width จาก 490px เป็น 590px


เสร็จแล้วในส่วนของการกำหนดค่าตัวเลข แต่ยังไม่เสร็จทั้งหมดครับ
เพราะถ้าสังเกตในธีม จะเห็นว่ามีไฟล์รูปในส่วนที่เป็นขอบของบล็อก
ซึ่งจะเกิดจากไฟล์รูป 3 ไฟล์ประกอบกัน คือ header footer และ belly
ให้รูปมีขนาดความกว้างสูงสุดตามที่เรากำหนดไว้ ซึ่งในที่นี้ก็คือขนาด 880px

#header
ให้กำหนดค่าของ background โดยระบุตำแหน่งรูปใหม่ที่ปรับขนาดแล้ว
url(
เลือกไฟล์ header ที่แก้ไขความกว้างแล้ว) top left no-repeat;

#neck
#leg
ให้กำหนดค่าของ background โดยระบุตำแหน่งรูปใหม่ที่ปรับขนาดแล้ว

url(เลือกตำแหน่งไฟล์ belly ที่แก้ไขความกว้างแล้ว) top left;

#belly
ให้กำหนดค่าของ background โดยระบุตำแหน่งรูปใหม่ที่ปรับขนาดแล้ว
url(
เลือกตำแหน่งไฟล์ belly ที่แก้ไขความกว้างแล้ว) repeat-y;

#footer
ให้กำหนดค่าของ background โดยระบุตำแหน่งรูปใหม่ที่ปรับขนาดแล้ว
url(เลือกตำแหน่งไฟล์ footer ที่แก้ไขความกว้างแล้ว) bottom left no-repeat;

ซึ่งจะต้องนำรูปที่แก้ไขแล้วมาอัพโหลดเก็บไว้ในพื้นที่ในบล็อก
แล้วจึงนำเอา url ของแต่ละภาพไปใส่ในตำแหน่งที่กำหนดไว้

และข่าวดีก็คือ ผมทำรูปพวกนั้นมาให้โหลดกันแล้ว ก๊อปเอาไปใช้กันได้เลย

  • header.png ขนาดความกว้าง 880 pixels [ PNG | GIF ]
  • belly.png ขนาดความกว้าง 880 pixels [ PNG | GIF ]
  • footer.png ขนาดความกว้าง 880 pixels [ PNG | GIF ]

หมายเหตุ: ไฟล์ PNG จะมีการสร้างเงาใต้กรอบรูป ส่วนไฟล์ GIF จะไม่มีเงาครับ

คำเตือน: การใช้ไฟล์ PNG ในบล็อก อาจส่งผลข้างเคียงอย่างรุนแรงกับผู้ที่ใช้ IE ได้ อ่านที่นี่ »

หรือถ้าคุณคิดว่าขนาด 880 นั่นยังกว้างไม่พอสำหรับบล็อกคุณ เอาไปเลย 980 pixels

  • header.png ขนาดความกว้าง 980 pixels [ PNG | GIF ]
  • belly.png ขนาดความกว้าง 980 pixels [ PNG | GIF ]
  • footer.png ขนาดความกว้าง 980 pixels [ PNG | GIF ]

ถ้าเป็นเตียงก็คงเป็นขนาดคิงไซส์กันเลยทีเดียว นอนสบายไม่ตกเตียงขาหัก
ซึ่งน่าจะพอเพียงสำหรับการทำ sidebar แบบสองฝั่งคลองได้ครับ

เสร็จแล้วล่ะ แค่นี้บล็อกของคุณก็จะกว้างขึ้นทันตาเห็น สามารถอัพเอ็นทรีกันได้กว้างจุใจ

ขอให้สนุกกับการแต่งบล็อกครับ

ธีมของเอ็กทีน

posted on 10 Oct 2007 20:42 by oatato in BlogDesign

คติพจน์ประจำวันนี้ 

"ถ้าอยากใช้ฟีเจอร์ใหม่ ๆ ของเอ็กทีน ก็จงเปลี่ยนไปใช้ธีมใหม่ของเอ็กทีนซะดีดี"

นี่จึงเป็นสาเหตุที่ทำให้ข้าพเจ้าตัดสินใจละทิ้งธีมเก่า แล้วเปลี่ยนไปใช้ธีมใหม่ของเอ็กทีนโดยไม่ลังเล
เลือกธีมใหม่กันตามชอบ แล้วค่อย ๆ ปรับแก้ไข css แบบค่อยเป็นค่อยไปจะดีที่สุด

. . . 

ธีมของบล็อก ก็เหมือนสีสันในชีวิตประจำวัน มีจุดเปลี่ยนบ้างก็ดี จะได้ไม่น่าเบื่อจนเกินไป

Recommend