โค้ดแต่งบล็อกง่ายๆ

ข้อแนะนำสำหรับการตกแต่ง blog

1.
การใช้ code ต่างๆ ที่เกี่ยวข้องกับรูปภาพ เช่น เปลี่ยนโลโก้ เปลี่ยน
background จะต้องใช้ url ของรูปภาพนั้นๆ
หากท่านต้องการใส่รูปจากเครื่องของท่านเอง จะต้อง upload
รูปของท่านไว้ที่เว็บที่ให้บริการรับฝากรูปก่อน ตัวอย่างเช่นเว็บ //photobucket.com/ และ //www.freeimagehosting.net ส่วนการใส่รูปประกอบใน blog แบบไม่ได้พิมพ์ code html เอง สามารถทำได้โดย เลือก ซึ่งอยู่สุดท้ายของ tool จัดการข้อความในหน้าเขียน blog นะคะ

2.
code ต่างๆ ที่เป็น java script จะต้องใส่ไว้ที่ส่วน script area
เท่านั้น สำหรับ stylesheet สามารถใส่ได้ที่ script area และช่องเขียน blog

3.
หากเกิดปัญหาจากการใส่ code html หรือ script ต่างๆ เช่น
ใส่แล้วทำให้การแสดงผลของ blog ผิดเพี้ยนไป หรือไม่แสดงผล แสดงว่า code
ที่ใส่ผิดพลาด ให้นำ code นั้นออก และตรวจสอบ code ให้ถูกต้อง
ก่อนทดลองใส่เพื่อทดสอบการแสดงผลแต่ละคำสั่งใหม่อีกครั้ง

Code Hot Hit !

1.เปลี่ยน background (จะต้องเลือก theme เป็น Theme อิสระ)

<style>body{background-image:url("//...........url ของรูปที่คุณต้องการเอามาใช้....");}</style>

2. code ที่ทำให้ background ติดอยู่กับที่ไม่เคลื่อนไปไหน

<style>body{background-attachment: fixed;}</style>


3. เปลี่ยนโลโก้ bloggang (จะต้องเลือก theme เป็น Theme อิสระ)

<script>document.images[0].src = "//...........url ของโลโก้ bloggang ที่ต้องการจะ ใส่ ... "</script>

4. ใส่เพลงใน blog
4.1 แบบที่แสดง control และต้องกด play เพื่อฟังเพลง

<EMBED ALIGN="CENTER" SRC=".......url ของเพลงที่คุณต้องการ...." HEIGHT="60" WIDTH="280" AUTOSTART="FALSE" VOLUME="50%" MASTERSOUND></EMBED>

4.2 แบบที่ซ่อน control โดยเมื่อเปิดหน้าเว็บจะได้ยินเสียงเพลงเลย

<EMBED SRC=".......url ของเพลงที่คุณต้องการ...." HIDDEN="true" AUTOSTART="true"LOOP=" ใส่จำนวนรอบที่ต้องการให้เปิด" MASTERSOUND></EMBED>

ทั้งนี้วิธีการใส่เพลงเพิ่มเติม สามารถดูได้ที่ blog ของ คุณรำเพย ค่ะ

5. แก้ bullet หน้าหัวข้อให้เป็นรูปอื่น

<style>ul{list-style-image: url('//...........url ของรูปที่คุณต้องการเอามาใช้....');}</style>

6. ทำให้มีกรอบและตัวเลขตรงส่วน comment

<script>HTML
= document.body.innerHTML; CommentCount = 0; var reg = new RegExp("--
Comment", "gm"); while(reg.test(HTML)) CommentCount++; CommentCount--;
for(i=1; i<=CommentCount; i++){ originalHtml =
document.getElementById( i ).innerHTML; beforeHtml = '<fieldset
style="border: #1A669F solid 1px; padding:4"> <legend align=center style="border: #1A669F solid 1px; padding:2; background: #FFCC66"> <font color=#1A669F size=-1>คห.ที่ ' + i + ' ที่แวะมาตอบ blog</font></legend>'; document.getElementById( i ).innerHTML = beforeHtml + originalHtml; }</script>

* ส่วนสีแดงคือส่วนที่สามารถเปลี่ยนแปลงได้
* code จาก คุณกึ่งยิงกึ่งผ่าน และ คุณรำเพย


7. ใส่รูปให้กล่อง comment

<STYLE

type="text/css">textarea{width:450;height:240;background:url("http:
ของรูป");color="blue"; font-family : tahoma; font-size:20pt;}
</STYLE>

8. ตกแต่งตัวหนังสือและเปลี่ยนสี font

<style>body, ul, li, p{font: normal "MS Sans Serif",Tahoma;font-size:10pt;color:black;}</style>

* ส่วนสีแดงคือส่วนที่สามารถเปลี่ยนแปลงได้
* สำหรับตารางสีดูได้ที่บล๊อกของคุณ ป้ามด ค่ะ

Create Date : 26 พฤศจิกายน 2554 Last Update : 26 พฤศจิกายน 2554 16:50:59 น. Counter : 2415 Pageviews.		1 comments
Share Tweet