Group Blog
 
 
พฤษภาคม 2554
1234567
891011121314
15161718192021
22232425262728
293031 
 
12 พฤษภาคม 2554
 
All Blogs
 
code แต่ง blog เบื้องต้น

สวัสดีค่ะ








กลัวลืม code แต่ง blog ก็เลย copy มาเก็บไว้ค่ะ


เพื่อนคนไหนสนใจก็นำไปใช้เลยนะค่ะ












รวม code แต่งบล็อก














ลบพื้นหลังและลบกรอบสีขาว
<style>table {background-color: transparent;border-style: none;border-spacing: none;}td {border: none;border-color: none;background: none;}</style>





เปลี่ยนรูปพื้นหลัง
<style>body{background-attachment: fixed;background-image:url(URL ของรูป);}</style>





เปลี่ยนสีและแบบ Font
<style>body, ul, li, p{font:bold MS Sans Serif;font-size:10pt;color:โค้ดสี;}</style>





เปลี่ยนตัวหนังสือให้ใหญ่และ Font
<style>p b font {font:bold 13px MS Sans Serif;}</style>





เปลี่ยนสี Link
<style>A:link{color:โค้ดสี Link;text-decoration:none;}
A:visited{color:โค้ดสีที่คลิกแล้ว;text-decoration:none}
A:hover{color:โค้ดสีที่ลากผ่าน;text-decoration: none;}</style>





เปลี่ยน Bullet (จุดกลมๆที่อยู่หน้า Group Blog)
<style>ul{list-style: ;list-style-image: url(URL ของรูป);}</style>





เปลี่ยน Title Bar (แถบสีฟ้าที่อยู่บนและล่างสุด)
<script language="Javascript">
var tt = 0;
var FMess = new Array("ข้อความที่ 1","ข้อความที่ 2","ข้อความที่ 3")
function FTitle()
{
document.title = FMess[tt]
tt = (tt < (FMess.length -1)) ? tt + 1 : 0;
setTimeout('FTitle()',700);
}
FTitle();
</script>





ทำให้รูปไม่มีกรอบ
<style>img {border: none;}</style>





เปลี่ยน Cursor
<body style="cursor:url(URL ของรูป ไฟล์ .ani หรือ .cur)">





เปลี่ยนสี Scrollbar (แถบลากขึ้นลงด้านขวามือ)
<STYLE> body { scrollbar-3d-light-color:โค้ดสี; scrollbar-arrow-color:โค้ดสี; scrollbar-3d-light-color:โค้ดสี; scrollbar-arrow-color:โค้ดสี; scrollbar-base-color:โค้ดสี; scrollbar-dark-shadow-color:โค้ดสี; scrollbar-face-color:โค้ดสี; scrollbar-highlight-color:โค้ดสี; scrollbar-track-color:โค้ดสี; scrollbar-shadow-color:โค้ดสี; }</STYLE>





เปลี่ยนรูปเรารักในหลวง (Login ท้ายชื่อใน Comment)
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="//www.bloggang.com/images/smile.gif") {document.images[i].src="URL ของรูป"}</script>





จำนวนผู้ชมออนไลน์
<script type="text/javascript" src="//fastonlineusers.com/on4.php?d=URL บล็อคของคุณ"></script> : Users Online





ใส่รูปภาพ
<img src="URL ของรูป" "border=0">





ใส่รูปภาพพร้อมคำพูด
<img src="URL ของรูป" alt="ข้อความที่ต้องการ">





ใส่รูปให้กล่อง Comment
<style type=text/css>textarea{width:300;height:200;background:url(URL ของรูป);color=โค้ดสีเวลาพิมพ์; font-family : MS Sans Serif; font-size:14pt; }</style>





ส่งอีเมล์
<a href="mailto:ที่อยู่อีเมล์ของคุณ">ส่งอีเมล์</a>
หรือใส่รูป

<a href="mailto:ที่อยู่อีเมล์ของคุณ"><img src="URL ของรูป"></a>





เปลี่ยน Logo Bloggang
<script>ldocument.images[0].src="URL ของรูป"; document.images[0].width =0 ; document.images[0].height =0</script>





ทำ Link
<a href ="URL Link">ข้อความที่ต้องการ</a>





ทำ Link เปิดหน้าใหม่
<a href =URL Link target=_blank>ข้อความที่ต้องการ</a>





ทำรูปให้กับ Link
<a href="URL Link"><img src="URL ของรูป"></a>
ทำรูปให้กับ Link (เปิดหน้าใหม่)

<a href="URL Link" target=_blank><img src="URL ของรูป"></a>





เปลี่ยน Now Here
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="//www.bloggang.com/images/now.gif") {document.images[i].src="URL ของรูป"}</script>

Theme อิสระ - เมนูซ้าย, ขวา เปลี่ยนไม่ได้ค่ะ





ทำกรอบรอบๆบล็อค
<script language="JavaScript1.2">
if (document.all)
document.body.style.cssText="border:10 ridge โค้ดสี"
</script>





ข้อความต้อนรับ
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
alert("ข้อความที่จะทักทาย")
// End -->
</script>





ข้อความบอกลา
<Script Language="VBScript"> Sub Window_onUnLoad() alert("ข้อความที่ต้องการ") End Sub </Script>





เปลี่ยนสีตัวหนังสือ
<font color="โค้ดสี">ข้อความที่ต้องการ</font>





ลูกเล่นเมื่อเปลี่ยน Webpage
<="Page-Enter" content="RevealTrans (Duration=3, Transition=23)">
<="Page-Exit" content="RevealTrans (Duration=2, Transition=23)">





จำนวนผู้ชมทั้งหมด
<center><script src="//fastwebcounter.com/secure.php?s=ใส่ URL บล็อค ของคุณที่นี่ค่ะ"></script></center>





กรอบนับ 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:โค้ดสี double 3px; padding:20"> <legend align=center><img src=URL ของรูป> Comment No. ' + i + ' <img src=URL ของรูป> </font></legend>';document.getElementById( i ).innerHTML = beforeHtml + originalHtml;}</script>





ส่งหลังไมค์
<a href ="URL หลังไมค์" target='_blank'> ส่งหลังไมค์ที่นี่</a>

หรือใส่รูป

<a href ="URL หลังไมค์" target='_blank'><img src="URL ของรูป" border=0></a>





โค้ดทำกรอบและเปลี่ยนคำให้กับ Submit และ Reset
<script>
document.forms.reply.Submit.value = "Submit";
document.forms.reply.Reset.value = "Reset";
document.forms.reply.Submit.style.width = 100;
document.forms.reply.Reset.style.width = 100;
document.forms.reply.Submit.style.height = 30;
document.forms.reply.Reset.style.height = 30;
document.forms.reply.Submit.style.backgroundColor = "black";
document.forms.reply.Reset.style.backgroundColor = "black";
document.forms.reply.Submit.style.color = "#e65c7c";
document.forms.reply.Reset.style.color = "#e65c7c";
document.forms.reply.Submit.style.border = "3px double #e65c7c";
document.forms.reply.Reset.style.border = "3px double #e65c7c";
</script>

Submit = เปลี่ยนเป็นคำที่ต้องการแทน Submit
Reset = เปลี่ยนเป็นคำที่ต้องการแทน Reset
100 = ความยาวของกรอบ
30 = ความสูงของกรอบ
black = สีพื้นหลังที่ต้องการ
#e65c7c = สีตัวอักษรที่ต้องการ
3px double #e65c7c = ขนาด, ชนิด, และสีกรอบที่ต้องการ
ชนิดกรอบจะมี solid, inset, outset, groove, ridge, dashed, dotted, หรือ double





โค้ดเช็คข้อความหลังไมค์
ต้อง Login ที่ Bloggang ก่อนค่ะ ถึงจะเช็คข้อความหลังไมค์ได้
<a href ="//www.pantip.com/cafe/krazip/index.php" target=_blank>เช็คข้อความหลังไมค์</a>

หรือใส่รูป

<a href="//www.pantip.com/cafe/krazip/index.php" target=_blank><img src="URL ของรูปที่ต้องการ" border="0"></a>





โค้ดเปลี่ยนรูปตรง Rss Feed
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="//www.bloggang.com/images/icon_rss.png") {document.images[i].src="URL ของรูปที่ต้องการ"}</script>





โค้ดเปลี่ยนรูปตรง My FriendFlock
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="//www.bloggang.com/images/icon_network_mini1.gif") {document.images[i].src="ใส่ URL ของรูปที่ต้องการเปลี่ยน"}</script>





โค้ดเปลี่ยนรูปตรง ฝากข้อความหลังไมค์
<script>iLength = document.images.length; for(i=0;i<iLength;i++) if(document.images[i].src=="//www.bloggang.com/images/message.gif") {document.images[i].src="ใส่ URL ของรูปที่ต้องการเปลี่ยน"}</script>



code ใส่ background



เปลี่ยนรายละเอียดที่ต้องการ ตรงข้อความ สีชมพู

คำสั่งที่ใส่ใน script จะแสดงผลทุกบล็อก
คำสั่งที่ใส่ที่ช่องรายละเอียดตอนสร้างบล้อก จะแสดงเฉพาะที่บล็อกนั้น



โค๊ด bg แบบ fixed ไม่ให้ bg เลื่อนลงตาม scroll bar


<style>body{background-attachment: fixed;background-image:url(//..........);}</style>






โค๊ด bg ด้านซ้ายของบล็อก

<style>body {background-image:url("……ใส่ URLของภาพที่จะใช้……") ;background-position:left ;background-repeat:repeat-y ;background-attachment : fixed;background-color: "……ใส่สีพื้นหลัง……";}</style>






โค๊ด bg ด้านขวาของบล็อก

<style>body {background-image:url("……ใส่ URLของภาพที่จะใช้……") ;background-position:right ;background-repeat:repeat-y ;background-attachment : fixed;background-color: "……ใส่สีพื้นหลัง……";}</style>






โค๊ด bg line หัวบล็อก

<style>body {background-image:url("……ใส่ URLของภาพที่จะใช้……") ;background-repeat : repeat-x ;background-attachment : fixed; background-color: "……ใส่สีพื้นหลัง……";}</style>






โค๊ด bg line ใต้บล็อก

<style>body {background-image:url("……ใส่ URLของภาพที่จะใช้……") ; background-position:bottom ;background-repeat : repeat-x;background-attachment: fixed;background-color: "……ใส่สีพื้นหลัง……";}</style>






โค๊ด bg เป็นรูปภาพเดียวทั้งหน้า

<style>Body{background-image:url(http:XXX);background-position: center (bottom left..etc..);background-repeat: no-repeat;background-attachment: fixed;background-color:color code;}</style>






โค๊ด bg โดยใช้สี

<style>body{background:color code}></style>




 



โค๊ด bg โดยไล่เฉดสี (gradient)

<body style="filter:progid:DXImageTransform.Microsoft.Gradient(endColorstr='color code 1', startColorstr='color code 2', gradienttype=0);">

gradienttype 0 ไล่สีตามแนวนอน
gradienttype 1 ไล่สีตามแนวตั้ง







โค๊ด bg แบบ tile

<style>body{background-image:url(URLของภาพ);}</style>


 



โค้ดใส่กรอบและรูปภาพให้กล่องคอมเม้นท์



เปลี่ยนรายละเอียดที่ต้องการ ตรงข้อความ สีชมพู
นำโค๊ดไปจัดที่โปรแกรม notepad ก่อนนำไปใส่ที่ script area นะค่ะ



<style>
textarea{
width: 300;
height: 200;
background: url(URL ของรูปที่ต้องการ);
color: โค้ดสีเวลาพิมพ์ข้อความ;
font-family: MS Sans Serif;
font-size: 15pt;
border: double 5px โค้ดสีกรอบที่ต้องการ;}
input{
background: โค้ดสีพื้นหลังตรงที่จะพิมพ์ชื่อ;
color: โค้ดสีเวลาพิมพ์ชื่อ;
border: double 2px โค้ดสีกรอบตรงที่จะพิมพ์ชื่อ;}
</style>





ขอบคุณ



เครดิตจาก //www.tlcthai.com/webboard/view_topic.php?table_id=1&cate_id=154&post_id=64474





Create Date : 12 พฤษภาคม 2554
Last Update : 22 มิถุนายน 2554 19:57:07 น. 19 comments
Counter : 10276 Pageviews.

 
อรุณสวัสดิ์ครับ

ขอบคุณสำหรับการแบ่งปันนะครับ









โดย: กะว่าก๋า วันที่: 12 พฤษภาคม 2554 เวลา:6:25:38 น.  

 
ป้าแก่กำลังอยากได้เลยค่ะ

ขอจิ๊กเอาไปใช้บ้างนะคะ จุ๊บซักที


โดย: pa-kae-laew วันที่: 12 พฤษภาคม 2554 เวลา:8:05:37 น.  

 
ขอบคุณงาม ๆ ค่ะ โค้ดบางอย่างหาไม่เจอซะที มาเจอที่บล้อกคุณ GUNPUNG นี่เอง


โดย: i'm not superman วันที่: 12 พฤษภาคม 2554 เวลา:8:51:42 น.  

 

เป็นประโยชน์เน๊าะน้องก้อย



โดย: อุ้มสี วันที่: 12 พฤษภาคม 2554 เวลา:8:51:53 น.  

 
น อนฺตลิกฺเข น สมุทฺทมชุเฌ น ปพฺพตานํ วิวรํ ปวิสฺส
น วิชฺชตี โส ชคติปฺปเทโส ยตุรฏฺฐิตํ นปฺปสเหยฺย มจฺจุ

ไม่ว่าบนท้องฟ้า ไม่ว่าท่ามกลางสมุทร ไม่ว่าในหุบเขา
ไม่มีแม้สักแห่งเดียว ที่คนเราอาศัยอยู่แล้ว จะหนีพ้นความตายได้

มีความสุขกับทุกวันดี ๆ ของชีวิต ตลอดไป...นะคะ





โดย: พรหมญาณี วันที่: 12 พฤษภาคม 2554 เวลา:11:38:19 น.  

 
ขอเอาโค้ดสั่งลา ไปใช้มั่งดีก่า

ฮ่าๆ

คุณก้อยยยยยยยยย

ตะดึ่งตึง


โดย: มนุษย์ต่างดาว..ผมยาว..ปากหวาน... (เป็ดสวรรค์ ) วันที่: 12 พฤษภาคม 2554 เวลา:11:49:57 น.  

 


โดย: เกศสุริยง วันที่: 13 พฤษภาคม 2554 เวลา:0:03:55 น.  

 
กำลังเปิดblogใหม่ ขอแอดไว้เป็นตย.นะคะ


โดย: แม่มินนี่ วันที่: 13 พฤษภาคม 2554 เวลา:15:11:33 น.  

 
ขอบคุณมากๆเลยค่ะ


โดย: วัวป่าหลงเงาจันทรา วันที่: 13 พฤษภาคม 2554 เวลา:15:32:51 น.  

 
ขอบคุณสำหรับความรู้ทั้งหมดนะคะ...

เหมาะกับมือใหม่มาก ๆ เลยค๊า...+++


โดย: เฟิร์นข้าหลวง วันที่: 14 พฤษภาคม 2554 เวลา:18:42:24 น.  

 
ขอบคุณมากค่ะ
น่าสนใจมากสำหรับมือใหม่
ขอให้มีความสุขนะคะ



โดย: ธารน้อย วันที่: 16 พฤษภาคม 2554 เวลา:0:28:42 น.  

 
สอนวิธีใส่ปฏิทินหน่อยได้ไหมคะ


โดย: ปอ (กระต่ายสามขา ) วันที่: 19 พฤษภาคม 2554 เวลา:9:08:11 น.  

 
ดีมากๆ เลยคะ สำหรับ code ต่างๆ ที่ให้ไว้ ส่วนตัวแล้วอยากให้ blog ดูดีมีราคา.. แต่เพราะคำว่าขี้เกียจจึงไม่มีอะไรก้าวหน้าเลย ...แม้กรพทั้งบทความใน blog


โดย: duck_rice (duck_rice ) วันที่: 24 พฤษภาคม 2554 เวลา:22:26:53 น.  

 
สวัสดีค่ะ
กำลังอยากเปลี่ยนรูปที่ข้อความหลังไมค์อะ โค๊ดใส่ไม่ครบอะปล่าว!

ใช้อันข้างบนมันขึ้นอันใหม่เลย
ทำไงดีค่ะ


โดย: Hi Aoy วันที่: 22 มิถุนายน 2554 เวลา:14:52:27 น.  

 


โดย: Gunpung วันที่: 22 มิถุนายน 2554 เวลา:19:28:00 น.  

 
รายงานผล ทำได้แล้วจ้า
ขอบคุณมากที่แวะมาบอก


โดย: Hi Aoy วันที่: 23 มิถุนายน 2554 เวลา:13:20:09 น.  

 
โอ้ว
ขอบคุณมากเลยค่ะ
หามานานวิธีเปลี่ยนรูปตรงพวก Rss Feed
มาบล็อคนี้มีทุกโค้ดที่อยากเปลี่ยนรูปเลยค่ะ


โดย: หนูลีลี วันที่: 14 กันยายน 2554 เวลา:9:04:37 น.  

 
ขอทำตามนะคะ ขอบคุณมากค่ะ


โดย: น้ำอุ่นดิน วันที่: 22 ตุลาคม 2554 เวลา:1:04:24 น.  

 
ขอโต๊ตไปใช้นะคะ
ขอบคุณจ้ะ


โดย: เมษาโชดดี วันที่: 13 กันยายน 2560 เวลา:18:18:04 น.  

ชื่อ :
Comment :
  *ใช้ code html ตกแต่งข้อความได้เฉพาะสมาชิก
 

Gunpung
Location :
สงขลา Thailand

[ดู Profile ทั้งหมด]

ฝากข้อความหลังไมค์
Rss Feed
Smember
ผู้ติดตามบล็อก : 13 คน [?]




ยินดีที่ได้รู้จัก เพื่อนๆในโลกไซเบอร์ค่ะ
ONLINE Visitors Instagram

ขอสงวนสิทธิ์ในการนำรูปภาพ ข้อความ
ใน Blog Gunpung ไปเผยแพร่
โดยไม่ได้รับอนุญาตนะค่ะ

Friends' blogs
[Add Gunpung's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.