การทำ sidebar ทั้งสองข้าง

posted on 05 Nov 2007 09:25 by oatato  in BlogDesign

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

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

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

. . .

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

. . .

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

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

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

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

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

Tags: css, double up, exteen, sidebar, theme23 Comments

Comment



smilebig smileopen-mounthed smileconfused smilesad smileangry smiletonguequestionembarrassedsurprised smilewinkdouble winkcry


ยังกล้าๆกลัวๆอยู่ครับ..sad smile

#1 By :: KinG MoJi :: on 2007-11-05 17:20

VaR ชอบ Blog กว้างๆค่ะ big smile

#2 By VAR on 2007-11-05 18:07

เทส

#3 By Ripley on 2007-11-05 18:09

ไม่ทราบว่าคุณOatatoใช้บราวเซอร์ยี่ห้อไหน รุ่นอะไรอยู่ครับ(รวมทั้งคนส่วนใหญ่ในexteenด้วย) เดิมผมใช้ IE6 มาตลอดหลายปี แต่ไม่ชอบที่ตรงมันทำให้เห็นมีสีพื้นติดมากับพวกคำว่าPreviously Favoritesฯลฯ (ที่อยู่ในsidebar) วันนี้เลยโหลดหมาไฟรุ่นล่าสุดมาใช้ ปรากฏว่าปัญหาเรื่องแถบสีใต้คำเหล่านี้ก็หายไป และก็ยังทำให้เห็นไฟล์ต่างๆที่โหลดขึ้นมาได้อย่างคมชัดดีมาก ผมติดใจเลยครับ(แต่เวลาเข้าบล็อกคนอื่นบางคนเช่นของคุณgrammarmanนั้น ธีมบล็อกเปลี่ยนไปแบบเละตุ้มเป๊ะเลยครับ แต่บล็อกคนส่วนใหญ่ก็ดูเหมือนเดิมไม่มีปัญหาอะไร อาจจะมีเปลี่ยนไปบ้างตรงฟ้อนท์ในentry) แต่ปัญหาสำคัญที่เกิดกับบล็อกผมเมื่อใช้หมาไฟก็อยู่ตรงที่ว่าเวลาจะพิมพ์ข้อความในกล่องcommentนั้น ฟ้อนท์จะหดเหลือตัวเล็กมากชนิดที่แทบอ่านไม่รู้เรื่องเลยครับ โดยเฉพาะฟ้อนท์ไทยซึ่งเปลี่ยนทั้งขนาดและแบบตัวอักษร (ขณะที่พิมพ์อยู่นี้ผมต้องกลับมาใช้IE) ไม่ทราบว่าจะปรับให้ฟ้อนท์ไทยเวลาพิมพ์ในกล่องcommentนั้นมีขนาดใหญ่ขึ้นได้ยังไงคับ?

#4 By Ripley on 2007-11-05 19:06

ปัญหาอีกอย่างที่เกิดจากหมาไฟคือ ข้อความของคอมเม้นท์ที่ขึ้นหลังจากการโพสแล้วนั้น บางทีมันก็ยาวทะลุออกนอกตัวบล็อกเลยครับ อย่างเช่นที่คุณโอ๊ตเซ็ตสีฟ้อนท์ให้เป็นสีเขียวนี้ พอมันทะลุไปทับแบคกราวน์ที่เป็นรูปสนามหญ้าแล้วก็อ่านไม่รู้เรื่องเลยครับ แก้ไขยังไงดี????

#5 By Ripley on 2007-11-05 19:15

ไวมากๆๆ big smile

#6 By ตุ้มเป๊ะ on 2007-11-05 19:44

ตอนนี้ี้ผมใช้ FF เป็นหลัก เพราะมันกิน resource ของ
เครื่องน้อยกว่า แต่ก็ยังมีปัญหาเรื่องการตัดคำอยู่พอสมควร
ต้องรอเวอร์ชั่นใหม่ครับ ได้ยินว่าการตัดคำจะดีกว่านี้แน่นอน

แต่ถ้ามองในแง่ดี
มันก็ทำให้ผมเคาะคีย์ enter จัดบรรทัดเองได้เก่งขึ้นนะ

ส่วนปัญหาบรรทัดเกิน ใช้วิธีเอาเม้าส์ลากเพื่อ highlight
คำที่หายไป ก็แก้ได้แล้วครับ double wink

#7 By oatato on 2007-11-05 19:51

ทำแบบนี้ก็ดีเหมือนกันค่ะ
เด๋วลองไปทำดูบ้างดีกว่า

#8 By 貴寛・智寛・寛樹 on 2007-11-05 19:56

FFของผมเป็นเวอร์ชั่น 2.0.0.9 เพิ่งอัพเดตใหม่จากเว็บวันนี้เอง แต่คงไม่ใช่เวอร์ชั่นใหม่แบบที่คุณโอ๊ตว่าหรอกมั้ง เพราะก็มีปัญหาเรื่องฟ้อนท์เหมือนกันครับ wink

#9 By Ripley on 2007-11-05 20:32

อ้อ ผมมองเลยไปไกลถึง FF3 ครับ question

#10 By oatato on 2007-11-05 20:35

ให้ว่างๆให้ว่างๆก่อน จะทำมั่ง

ฝากกระจายข่าวถึงแก๊งค์เราด้วย เกี่ยวกับโปสเตอร์ใบล่าสุดที่ผมออกแบบ อยู่ในเอนทรี่ที่อัพอยู่นี่แหละ question

#11 By นายตุ้ย on 2007-11-06 00:22

^
^
แล้วไอ้แก๊งค์เราที่ว่าเนี่ยะ มันระหกระเหินไปอยู่ที่เว็บไหนแล้วหว่า cry

#12 By oatato on 2007-11-06 00:41

ผมว่ามันกว่างไปนะ ถ้าใช้จอขนาดธรรมดามันจะแสดง
ไม่เต็มหน้านะ

โชคดีที่ผมใช้จอ with big smile

#13 By แพนด้าญี่ปุ่น on 2007-11-06 07:46

ติดใจตรง ดูแล้วเทห์ แต่หมายถึงตัวบล๊อก ส่วนเจ้าของบล๊อก บลา ๆ ๆ ตรงนี้นี่ซ่อยนัยสำคัญอะไรไว้ป่าวครับ

จริง ๆ แล้ว ผมอาศัยความรู้จากคุณ ซาอิ และของคุณโอ๊ตตาโต กับความชอบใน wordpress มาทำบล๊อกแบบ sidebar ติดกันข้างเดียวนี่แหละครับ

#14 By เจ้าชายน้อย on 2007-11-06 15:07

^
^
ไม่มีนัยยะใด ๆ ครับ

แค่เกรงว่าถ้าเกิดชมคุณเจ้าชายน้อยตรง ๆ แล้วอาจทำให้
ตัวลอยไปไกลจนกลับมาอัพบล็อกไม่ทันต่างหาก

#15 By oatato on 2007-11-06 20:11

#commentform{
width:100%;
background:(#รหัสสี) url(urlภาพ) repeat top left;
float:left;
ผมพยายามใส่รูปที่กล่องcommentตามวิธีจากบล็อกๆหนึ่งที่ผมแปะมาให้ดูข้างบนนี่แหละ แต่ว่าลองยังไงภาพก็ไม่ขึ้นครับ มันผิดหรือว่าขาดตรงไหนอีกครับคุณOatatoembarrassed

#16 By Ripley on 2007-11-07 21:52

ู^
^
ดูแล้วก็น่าจะขึ้นนะครับ

ยกเว้นว่า url ของไฟล์รูปจะสะกดผิดครับ

#17 By oatato on 2007-11-07 23:02

url ของรูปสะกดไม่ผิดแน่นอนครับ เพราะผมใช้วิธีก็อปปี้มาจากเว็บรับฝากรูปอย่าง photobucketโดยตรงเลย ส่วนขนาดรูปที่ทำผมก็วัดมาเท่ากับขนาดกล่องคอมเม้นท์ในบล็อกผมเป๊ะๆเลย คือ กว้าง 672 สูง 315 พิ๊กเซลครับ sad smile

#18 By Ripley on 2007-11-07 23:57

ตอนนี้ยังไม่ได้ใส่รูปไปใน CSS ใช่ไหมครับ

เพราะใน CSS > #commentform ที่ผมไปแอบดู
ผมยังไม่เห็นบรรทัดที่เป็น background:url เลยล่ะ

#19 By oatato on 2007-11-08 00:14

ตอนนี้ยังไม่ได้ใส่ครับผม คือผมลองทำที่CSSหลายครั้งแล้ว แต่ทดสอบดูจากหน้า preview ภาพมันไม่ขึ้นซักที ก็เลยไม่กล้ากดsaveครับ

#20 By Ripley on 2007-11-08 00:26

ผมมีธีม halloween ที่ใส่ background ใน comment
หน้าตาจะเป็นแบบนี้ครับ

#commentform {
background:#000000;
border:1px dashed #CC9966;
float:left;
padding: 5px;
background:url(http://oatato.exteen.com/images/decor/halloween_comment.jpg);
}

ถ้าลองเอาไปแปะเลย ก็จะมี background จากไฟล์ในบล็อกผมไปโผล่แทน

ถ้ารูปขึ้นก็ค่อยเอาไฟล์ของคุณไปแปะแทน แล้วปรับ
ส่วนอื่นที่เหลือก็น่าโอเคนะครับ

#21 By oatato on 2007-11-08 00:32

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

#22 By Ripley on 2007-11-08 01:13

ใช่ครับ

ผมลองเอาธีมคุณ Ripley ไปแปะในเอ็นทรีนี้

http://oatato.exteen.com/20070910/test-area

มันก็ขึ้นนะครับ sad smile

#23 By oatato on 2007-11-08 09:31

หาเอ็นทรี่ไม่เจอ ค้นได้


กำลังโหลดข้อมูลในบล็อก

Recommend