วิธี Post ให้ปรากฏ HTML code ลงใน Blogspot เป็นตัวอย่างเพื่อผู้อ่านจะได้คัดลอกไปใช้ [How to show HTML/java codes in blogspot posts ]

อยากจะ Post HTML code ใน Blogger กรณี Modify Template จะได้แสดงเป็นตัวอย่างโค้ดที่เพิ่มหรือแก้ไข Template ตามที่ต้องการ เคยลอง Post โค้ด ตรง ๆ ผลออกมามันไม่แสดง โค้ดที่เราต้องการที่จะให้มันแสดง จึงต้องมีขั้นตอนวิธีดังนี้

1. ไปที่ Dashboard > การออกแบบ > แก้ไข HTML (อย่าลืมกดปุ่มเพื่อ Save Template เดิมไว้ก่อนเด้อเผื่อมีปัญหาจะได้กู้กลับคืนได้ง่าย)

2.ค้นหาบรรทัดนี้

]]></b:skin>
3. แล้วเพิ่มโค้ดดังต่อไปนี้เหนือบรรทัดนั้น

pre
{
background:#efefef;
border:1px solid #A6B0BF;
font-size:120%;
line-height:100%;
overflow:auto;
padding:10px;
color:#000000 }
pre:hover {
border:1px solid #efefef;
}
code {
font-size:120%;
text-align:left;
margin:0;padding:0;
color: #000000;}
.clear { clear:both;
overflow:hidden;
}
แล้วก็ Save Template ซะ

4. แล้วก็เอา HTML code ที่ต้องการจะ Post ไปแปลงให้เรียบร้อยก่อนที่ Link นี้
    Sriraksat   หรือที่  quick-escape หรือเว็ปอื่น ๆ ที่บริการแปลงโค้ดฟรี

5. ไป Post บทความ > แก้ไข HTML แล้ว เปิด tag <pre>
    แทรกโค้ดที่ถูกแปลงได้จากข้อ 4 เข้าไป
    แล้วก็ปิด tag </pre>

    ดังรูปตัวอย่าง
   

3 comments:

  1. ยอดเยี่ยมครับ

    ReplyDelete
  2. ขอบคุณมากๆครับ หามานาน

    ReplyDelete