ตัวอย่างการเปลี่ยน ภาพส่วนหัวของ blog

ลองทำตัวอย่างการเปลี่ยน ภาพส่วนหัวของ blog มาแล้วครับ ดังที่เห็นด้านบนของ blog นี้ครับ

ขั้นตอนการจัดการแบบเคร่าๆ  นะครับ

1.ผมได้เริ่มออกแบบขนาดภาพไว้ที่  914 pixel x 147 pixel ชื่อไฟล์ว่า hd_blog2.jpg แล้วนำไฟล์ที่ได้

2. upload  ไปไว้มรพื้นที่เก็บไฟล์อัลบั้มใน blog ของผมเอง

3. ไปเมนู ประวัติ > ตกแต่งหน้าประวัติของคุณ

4. ตรงตำแหน่ง "CSS ที่ตกแต่งมาเอง : " ใส่  Code ไว้ดังด้านล่างนี้ครับ

div#title{padding: 
font-size: medium;
color:#0254c4;
background:#d4dff7;  
background-image:url("http://share.psu.ac.th/file/suriya.k/hd_blog2.jpg");    
background-repeat:no-repeat;  
background-position:center center;  
height:147px;
width:914px;
}

div#title span {display:none;} 

body{background:#d4dff7;
background-image: url("");
background-repeat:repeat;}

5. สิ่งที่ต้องเปลี่ยนอย่างง่ายๆ คือ ตรงตำแหน่งชื่อรูปที่โหลดขึ้นไปในไฟล์อัลบั้ม โดยที่เราต้องไป copy link ของไฟล์ภาพที่ต้องการนำมาเป้นส่วนหัวของ blog ในกรณีนี้ภาพผมอยู่ที่ http://share.psu.ac.th/file/suriya.k/hd_blog2.jpg แต่ถ้าเป็นภาพของท่าน ก็เอาตำแหน่ง link ของท่านมาแก้ตรงนี้ครับ

6. กดปุ่มบันทึกเก็บ เสร็จแล้วก็กลับมาดูผลงานที่ได้ครับ จบ

เอาเป้นว่าลองทำกันเล่นๆ นะครับ เผื่อบางวันอาจคิดเรื่องเล่าไม่ออกก้มาคิดว่าจะตกแต่งหน้า blog ยังไงแทนก็ได้ครับ อิอิ แล้วอย่าลืมเอามาบอกันบ้างนะครับ จะตามไปให้คะแนน เอ้ย! ไม่ใช่ ตามไปชื่นชมครับ