ทำภาพพื้นหลัง หรือ background
นักเรียนคงสังเกตุว่า blog วิชามีรูปพื้นหลัง หน้าตาเป็นเครื่องคอมพิวเตอร์ครับนี้ก็เป็นงานที่เราจะทำในเรื่องนี้ครับ
ก่อนเริ่ม ต้องมีรูปที่จะทำ background จาก website ก่อนนะครับ
อย่างรูปที่ผมใช้มาจาก http://image.fg-a.com/0_bk_5.gif ครับ
1. ที่หน้า blog ก็ click ไปที่ "ปรับแต่ง" (บนขวา ครับ)
2. ต่อที่ "แก้ไข HTML" ครับ
3. ปกติ การแก้ไข HTML อาจสร้างอันตรายต่อ blog ทั้ง blog ได้ จึงนิยมบันทึกตัวต้นฉบับไว้ก่อน โดยเลือก "ดาวน์โหลดแม่แบบฉบับเต็ม"
4. แต่ที่เราจะแก้ไข เป็นเพียงจุดเล็ก ๆ คงไม่สร้างอันตรายอะไร ก็จะข้ามกันบันทึกตัวต้นฉบับไปก็ได้ครับ
5.กด Ctrl+F เพื่อค้นหาคำสั่งว่า "background:$bgcolor" ครับ
เมื่อเจอแล้ว ก็พิมพ์ค่า (จะ copy มาก็ไวดีครับ) URL ที่มี รูป ที่จะนำมาใส่ background
งานมีแค่นี้เอง แต่ .... แต่ อย่าเพิ่ง click คำสั่ง "บันทึกแม่แบบ" นะ... click ปุ่ม "แสดงตัวอย่าง" ก่อนนะ เกิดการเปลี่ยนแปลง
ที่ต้องการหรือเปล่า
หากมีปัญหา ให้เลือก "ล้างข้อมูลการแก้ไข" ก็จะคืน HTML code กลับไปสู่สภาพก่อนหน้าจะพิมพ์เพิ่มเติม แล้วลองแก้ไขใหม่
โชคดีครับ
ลองทำแล้วนะคะ ตอนแรกหา background.... ที่อาจารย์ว่าไม่เจอค่ะ
ตอบลบเลยเปลี่ยน template ใหม่ แล้วเจอ แต่ก็มีปัญหา หลังจากใส่ background ใหม่
แล้วไม่มันสวยอ่ะค่ะ เดี๋ยวจะลองปรับปรุงแก้ไขต่อไปนะคะ
อาจารย์ค่ะ ปูทำแล้วนะคะ แต่เหมือนกันบล็อกปูมันจะไม่ transparency ค่ะ มันเลยไม่เห็น background ที่เปลี่ยนค่ะ จะเห็นแต่ขอบด้านข้างค่ะ แล้วก็ปูปรับแก้ไข shoutbox แล้วนะคะ
ตอบลบเปลี่ยน background ใหม่แล้วค่ะ ยังไม่ค่อยถูกใจเท่าไหร่
ตอบลบจะพยายามค้นหาต่อไปค่ะ
อาจารย์ค่ะ ปูปรับcode อีกรอบนะคะ ลองแวะไปดูด้วยค่ะ
ตอบลบทีแรกจะเปลี่ยน template ใหม่เลย มันฟ้องว่า gadget ที่มีอยู่จะหายหมดเลยต้องเปลี่ยนใจค่ะ ขี้เกียจทำใหม่
เพิ่งแวะไป เห็นแต่ pooka ครับ ทำไงดี
ตอบลบหลาย ๆ ครั้งที่ผมทำโปรแกรมอยู่ ใช้เวลากับมันนานถึงนานมาก ที่จริงงานก็เสร็จแล้ว แต่ในใจคิดว่า ขออีกนิดหนึ่ง อีกนิดนึง แล้วเจ้า นิดนึงที่ว่า มันก็ทำให้โปรแกรมผมหายไปต่อหน้าต่อตา
ตอบลบหวังว่า ปัญหาของ อ. ปู คงเป็นเรื่องเล็กน้อยนะครับ หรือหากเป็นเรื่องไม่เล็กน้อย แต่คงไม่ท้อนะครับ
สวัสดีค่ะคุณครู
ตอบลบไม่ได้มัวแต่เลี้ยงลูกนะคะ
ตอนกลางวันทำเสร็จแล้วแต่ยังไม่ทันบันทึกแม่แบบ
ไฟพายัพก้อดับไปซะก่อน เนตเจ๊ง
ตอนนี้เอาการบ้านกลับมาทำที่บ้านเรียบร้อยแล้วนะคะ
อาจจะดูยาก ไว้จะมาปรับแก้อีกทีค่ะ ถ้าหากได้รูปที่ถูกใจกว่านี้ค่ะ
อาจารย์ค่ะ ขยายความหน่อยค่ะ เห็นแต่ pucca หมายความว่ายังไงค่ะ ไม่เห็นตัวอักษรเลย หรือว่ามันเห็น pucca ชัดไป หรือ...
ตอบลบแต่หนูว่ามันก็พออ่านได้อยู่นาาาา
อาจารย์ค่ะ ที่หนูเคยลองเสนอให้อาจารย์ fix background นะคะ ก่อนอื่นก็ต้องขอบคุณพี่เก๋ค่ะที่แนะนำคำสั่งให้ค่ะ โดยปูไปดูที่ blog ของครูดาวที่ทำ link ไปยัง background สวย ๆ ค่ะ จะเห็นว่าที่ link จะมีคำสั่งอยู่ค่ะ หลังจากใส่ค่ะ url ของ background ก็เพิ่มคำสั่งดังนี้นะคะ
ตอบลบ(http://ที่อยู่ของรูปค่ะ);background-position: center; (กำหนดตำแหน่งการวางภาพของ background ค่ะ
background-repeat:no-repeat; (กำหนดว่าจะเล่นรูปซ้ำหรือไม่ ถ้าภาพเล็ก คำสั่งนี้ต้องเอาออกค่ะ
background-attachment: fixed; ส่วนคำสั่งสุดท้ายนี้เป็นการ fix ภาพหลังไม่ให้มันเคลือนไปตามบทความค่ะ
หวังว่าคงจะมีประโยชน์กับเพื่อน ๆ คนอื่นด้วยนะคะ
การแก้ไข code html เป็นส่วนที่ผมกลัว และ ปอดมากที่สุดครับ จึงจะเห็นได้ว่า ความรู้ที่ผมเอามาแลกเปลี่ยน จะเลี่ยงส่วนนี้มากที่สุดเท่าที่จะทำได้ หากต้องทำจะแก้เพียงเล็ก ๆ น้อย ๆ ครับ
ตอบลบทำแล้วครับ
ตอบลบ