All Code+Icon รวมโค้ด+สีแต่งบล็อก

  ได้เก็บรวบรวม Code ที่ใช้ในการแต่งบล๊อกที่เราเคย 
ใช้เป็นประจำจากบล๊อกคุณป้าชมพร คุณกึ่งยิง ป้ามด บล๊อกคุณไหม และจากเพื่อนๆ 
ใน Bloggang แนะนำบ้าง แล้วเราก็เอามาปรับใช้ในบล๊อกของเรา
 ถ้าจะเป็นประโยชน์บ้างก็ยินดี ลิงค์ไปไว้ใช้ อย่าลืม!..ให้เครดิต จขบ.ดังกล่าวด้วยนะคะ 

ไอคอนน่ารัก

   

  

  

  

  

  

  

  

  







      

ไอค่อนจิ๋ว

12
     

13

       

14

    




      


         

  

โค้ดสีแต่งบล็อก

เครดิต..นำมาจาก Bloggang : zairill

  ที่มาจากเว็บสี       https://xn--code-3jovd.plus.in.th/

ที่มาจากเว็บ https://xn--code-3jovd.plus.in.th/

Snow #FFFAFA	GhostWhite #F8F8FF	WhiteSmoke #F5F5F5	Gainsboro #DCDCDC
FloralWhite #FFFAF0	OldLace #FDF5E6	Linen #FAF0E6	AntiqueWhite #FAEBD7
PapayaWhip #FFEFD5	BlanchedAlmond #FFEBCD	Bisque #FFFAF0	PeachPuff #FFDAB9
NavajoWhite #FFDEAD	Moccasin #FFE4B5	Cornsilk #FFF8DC	Ivory #FFFFF0
LemonChiffon #FFFACD	Seashell #FFF5EE	Honeydew #F0FFF0	MintCream #F5FFFA
Azure #F0FFFF	AliceBlue #F0F8FF	lavender #E6E6FA	Lavender Blush #FFF0F5
MistyRose #FFE4E1	White #FFFFFF	Black #000000	DarkSlateGray #2F4F4F
LightSlateGray #778899	Gray #BEBEBE	LightGray #D3D3D3	MidnightBlue #191970
CornflowerBlue #6495ED	DarkSlateBlue #483D8B	SlateBlue #6A5ACD	MediumSlateBlue #7B68EE
LightSlateBlue #8470FF	NavyBlue #000080	DimGrey #696969	SlateGrey #708090
MediumBlue #0000CD	RoyalBlue #4169E1	Blue #0000FF	DodgerBlue 1E90FF
DeepSkyBlue #00BFFF	SkyBlue #87CEEB	LightSkyBlue #87CEFA	SteelBlue #4682B4
LightSteelBlue #B0C4DE	LightBlue #ADD8E6	PowderBlue #B0E0E6	PaleTurquoise #AFEEEE
DarkTurquoise #00CED1	MediumTurquoise #48D1CC	Turquoise #40E0D0	Cyan #00FFFF
LightCyan #E0FFFF	CadetBlue #5F9EA0	MediumAquamarine #66CDAA	Aquamarine #7FFFD4
DarkGreen #006400	DarkOliveGreen #556B2F	DarkSeaGreen #8FBC8F	SeaGreen #2E8B57
MediumSeaGreen #3CB371	LightSeaGreen #20B2AA	PaleGreen #98FB98	SpringGreen #00FF7F
LawnGreen #7CFC00	Green #00FF00	Chartreuse #7FFF00	MedSpringGreen #00FA9A
GreenYellow #ADFF2F	LimeGreen #32CD32	YellowGreen #9ACD32	ForestGreen #228B22
OliveDrab #6B8E23	DarkKhaki #BDB76B	PaleGoldenrod #EEE8AA	LtGoldenrodYello #FAFAD2
LightYellow #FFFFE0	Yellow #FFFF00	Gold #FFD700	LightGoldenrod #EEDD82
Goldenrod #DAA520	DarkGoldenrod #B8860B	RosyBrown #BC8F8F	IndianRed #CD5C5C
SaddleBrown #8B4513	Sienna #A0522D	Peru #CD853F	Burlywood #DEB887
Beige #F5F5DC	Wheat #F5DEB3	SandyBrown #F4A460	Tan #D2B48C
Chocolate #D2691E	Firebrick #B22222	Brown #A52A2A	DarkSalmon #E9967A
Salmon #FA8072	LightSalmon #FFA07A	Orange #FFA500	DarkOrange #FF8C00
Coral #FF7F50	LightCoral #F08080	Tomato #FF6347	OrangeRed #FF4500
Red #FF0000	HotPink #FF69B4	DeepPink #FF1493	Pink #FFC0CB
MediumVioletRed #C71585	VioletRed #D02090	Magenta #FF00FF	Violet #EE82EE
Plum #DDA0DD	LightPink #FFB6C1	PaleVioletRed #DB7093	Maroon #B03060
Orchid #DA70D6	MediumOrchid #BA55D3	DarkOrchid #9932CC	DarkViolet #9400D3
BlueViolet #8A2BE2	Purple #A020F0	MediumPurple #9370DB	Thistle #D8BFD8

COLORCODES #FFFFFF #FFCCFF #FF99FF #FF66FF #FF33FF #FF00FF #CCFFFF #CCCCFF #CC99FF #CC66FF #CC33FF #CC00FF #99FFFF #99CCFF #9999FF #9966FF #9933FF #9900FF #66FFFF #66CCFF #6699FF #6666FF #6633FF #6600FF #33FFFF #33CCFF #3399FF #3366FF #3333FF #3300FF #00FFFF #00CCFF #0099FF #0066FF #0033FF #0000FF #FFFFCC #FFCCCC #FF99CC #FF66CC #FF33CC #FF00CC #CCFFCC #CCCCCC #CC99CC #CC66CC #CC33CC #CC00CC #99FFCC #99CCCC #9999CC #9966CC #9933CC #9900CC #66FFCC #66CCCC #6699CC #6666CC #6633CC #6600CC #33FFCC #33CCCC #3399CC #3366CC #3333CC #3300CC #00FFCC #00CCCC #0099CC #0066CC #0033CC #0000CC #FFFF99 #FFCC99 #FF9999 #FF6699 #FF3399 #FF0099 #CCFF99 #CCCC99 #CC9999 #CC6699 #CC3399 #CC0099 #99FF99 #99CC99 #999999 #996699 #993399 #990099 #66FF99 #66CC99 #669999 #666699 #663399 #660099 #33FF99 #33CC99 #339999 #336699 #333399 #330099 #00FF99 #00CC99 #009999 #006699 #003399 #000099 #FFFF66 #FFCC66 #FF9966 #FF6666 #FF3366 #FF0066 #CCFF66 #CCCC66 #CC9966 #CC6666 #CC3366 #CC0066 #99FF66 #99CC66 #999966 #996666 #993366 #990066 #66FF66 #669966 #666666 #996666 #663366 #660066 #33FF66 #33CC66 #339966 #336666 #333366 #330066 #00FF66 #00CC66 #009966 #006666 #003366 #000066 #FFFF66 #FFCC66 #FF9933 #FF6633 #FF3333 #FF0033 #CCFF33 #CCCC33 #CC9933 #CC6633 #CC3333 #CC0033 #99FF33 #99CC33 #999933 #996633 #993333 #990033 #66FF33 #66CC33 #669933 #666633 #663333 #660033 #33FF33 #33CC33 #339933 #336633 #333333 #330033 #00FF33 #00CC33 #009933 #006633 #003333 #000033 #FFFF00 #FFCC00 #FF9900 #FF6600 #FF3300 #FF0000 #CCFF00 #CCCC00 #CC9900 #CC6600 #CC3300 #CC0000 #99FF00 #99CC00 #999900 #996600 #993300 #990000 #66FF00 #66CC00 #669900 #666600 #663300 #660000 #33FF00 #33CC00 #339900 #336600 #333300 #330000 #00FF00 #00CC00 #009900 #006600 #003300 #000000

COLORNAMES AliceBlue AntiqueWhite Aqua Aquamarine Azure Beige Bisque Black BlanchedAlmond Blue BlueViolet Brown BurlyWood CadetBlue Chartreuse Chocolate Coral CornflowerBlue Cornsilk Crimson Cyan DarkBlue DarkCyan DarkGoldenRod DarkGray DarkGreen DarkKhaki DarkMagenta DarkOliveGreen Darkorange DarkOrchid DarkRed DarkSalmon DarkSeaGreen DarkSlateBlue DarkSlateGray DarkTurquoise DarkViolet DeepPink DeepSkyBlue DimGray DodgerBlue Feldspar FireBrick FloralWhite ForestGreen Fuchsia Gainsboro GhostWhite Gold GoldenRod Gray Green GreenYellow HoneyDew HotPink IndianRed Indigo Ivory Khaki Lavender LavenderBlush LawnGreen LemonChiffon LightBlue LightCoral LightCyan LightGoldenRodYellow LightGrey LightGreen LightPink LightSalmon LightSeaGreen LightSkyBlue LightSlateBlue LightSlateGray LightSteelBlue LightYellow Lime LimeGreen Linen Magenta Maroon MediumAquaMarine MediumBlue MediumOrchid MediumPurple MediumSeaGreen MediumSlateBlue MediumSpringGreen MediumTurquoise MediumVioletRed MidnightBlue MintCream MistyRose Moccasin NavajoWhite Navy OldLace Olive OliveDrab Orange OrangeRed Orchid PaleGoldenRod PaleGreen PaleTurquoise PaleVioletRed PapayaWhip PeachPuff Peru Pink Plum PowderBlue Purple Red RosyBrown RoyalBlue SaddleBrown Salmon SeaGreen SeaShell Sienna Silver SkyBlue SlateBlue SlateGray Snow SpringGreen SteelBlue Tan Teal Thistle Tomato Turquoise Violet VioletRed Wheat White WhiteSmoke Yellow

Line น่ารักๆ



 














 

โค๊ด HTML กำหนด ขนาดของตัวอักษร

font size=6

font size=5

font size=4

font size=3

font size=2

font size=1

  เพื่อสะดวกกับการนำไปใช้จะต้องปรับปรุงแก้ไขเสมอๆ

ปล.ก่อนนำโค๊ดไปใช้ ต้องลบ จุด* ออกทุกจุดก่อนค่ะ

fieldset box 

คือกรอบที่เห็นใส่ code อยู่นี้ สามารถเปลี่ยนค่า
ได้ตามใจชอบ
เช่น-font color
- สีของกรอบ
ขนาดความ width="200"
ความสูง height="60"
หรือ - bgcolor สีของแบบกกราว
-ความหนาของกรอบ 2px
-ชนิดของกรอบ dotted, dashed, solid, groove, ridge,
inset, outset, double

fieldset box มีหลายแบบ เรียงลำดับตามความง่าย 

1 Code กล่อง

<*fieldset>ใส่รายละเอียดที่นี่<*/fieldset>

2 แบบ Title 

Title

<*legend><*/legend>Title<*/fieldset>ใส่รายละเอียดที่นี่<*/fieldset>

3 ใส่กรอบสีแดง 

Codeใส่กรอบสีแดง

<*fieldset style="border:1px solid #A0522D; padding:24;">
<*legend align="left"><*font color="#A0522D">
Title Codeใส่กรอบสีแดง<*/font>
<*/legend><*font color="#0000cc">
<*p align="center"> <*font color=green>
ใส่รายละเอียดที่นี่<*/font>
<*/p><*/font><*/fieldset>

4 ขยายได้ตามข้อความ

<*center><*table style="border: 1px solid #FF0000;"cellpadding="5" cellspacing="10"><*tr> <*td><*center> ใส่รายละเอียดที่ <*/center><*/td><*/tr><*/table><*/center>

ใส่รายละเอียดที่

5 กรอบเส้นคู่

.ใส่ข้อความ

. <*TABLE width="200" bgcolor="#FFF0cc"><*tr> <*td align="center" height="60" style="border- color:#688E23; border-width:6px; border-style:double;"> <*FONT color="#688E23" size="3"> .ใส่ข้อความ <*/FONT><*/td><*/tr><*/TABLE>

*ถ้าเราต้องการใส่กรอบให้รูป เราลบสีข้อความออก
<*FONT color="#FFB6C1 " size="3">ใส่ข้อความ<*/FONT>
ออกไป

นอกจากกรอบเส้นคู่ border-style:double แล้ว
เราสามารถเลือกกรอบต่อไปนี้ได้อีก
-ชนิดของกรอบ dotted, dashed, solid, groove, ridge,
inset, outset, double

//////////

---

การใส่แบกกราวBGในบล๊อก 


การใส่ BG.มีหลายแบบมีโค๊ดเฉพาะแบบนั้นเช่น
-ใส่แบบมีรูป
แบบมีรูปอยู่กับที่หรือแบบเคลื่อนที่
-ใส่รูป อยู่มุมซ้าย หรือตรงกลาง หรือมุมขวา จะให้อยู่มุมบน
หรือมุมล่างก็ได้
-ใส่แบบสีๆ

วิธีนำไปวางได้สองวิธี
-วิธีแรกนำไปวางที่ Script area วิธีนี้มีผลทุกบล๊อก
ถ้าไม่ต้องการให้มีผลทุกบล๊อกต้องลบออก
-วธีที่สองใส่ที่ช่องรายละเอียดพร้อมกับการเขียนบล๊อกใหม่
มีผลเฉพาะบล๊อกนั้นบล๊อกเดียว
ถ้าเขียนบล๊อกใหม่ก็เปลี่ยนแบกกราวใหม่


การใส่รูปเป็น BG ในบล๊อค ตามที่เราต้องการ
เช่นใส่ตรงกลาง,ใส่บน,บนซ้าย,บนขวา,
หรือใส่มุมล่าง,ล่างซ้าย,ล่างขวาเป็นต้น

ใส่สี แบบ Code สี #FFB6C1
และแบบชื่อของสีเช่น red,green ป็นต้น

color="#FFB6C1"size="3"
color="red"size="3"

ส่วนขนาด size="3" เป็นขนาดของ font ที่เราจะให้
ตัวหนังสือเล็กหรือใหญ่


left bottom ส่วนที่กำหนดมุมในการวางรูป

top - แถวบน

left top - :ซ้ายบน

right top - ขวาบน



center bottom - กลางล่าง

right bottom - ขวาล่าง

right bottom - ซ้ายล่าง



center - แถวกลาง

bottom - แถวล่าง

right - มุมขวา

left - มุมซ้าย



1ใส่แบบธรรมดา

Codeธรรมดา

<*style>body{background-image:url("http// XXX");}
<*/style>

2.ใส่ bg แบบ fixed 

Codeแบบ fixed

<*style>body{background-attachment:fixed;background-image:url("http// XXX");}<*/style>

3 bg แบบเลื่อนตามสกอบาร์ 

Codeเลื่อนลงตาม scroll bar

<*style>body{background-attachment: none;background-
image:url("http// XXX");}<*/style>

4.ใส่ bg ภาพเดียวทั้งหน้า+สี attachment

ใส่ bg ภาพเดียวทั้งหน้า+สี

<*style>Body{background-image:url(https://i256.photobucket.com/albums/hh172/sundakib27/
105_mansank.jpg);background-position:bottom left;
background-repeat:no-repeat;background-attachment:
fixed;background-color:#CCFFFF;}<*/style>

5 ใส่บีจี แบบมุมposition ไม่เลื่อน

Code .BG มุมใดมุมหนึ่ง

<*style>Body{background-image:url(https://i256.photobucket.com/albums/hh172/sundakib27/
105_mansank.jpg);background-position:bottom left;
background-repeat:no-repeat;background-attachment:
fixed;background-color:#CCFFFF;}<*/style>

Left bottom เราสามารถเปลี่ยนได้ จะเปลี่ยนเป็น ::
right top / left top / center / right bottom /left bottom 


6.ใส่ bg โดยใช้สีอย่างเดียว

Code bg สี

<*style>body{background-color:#8B0000;}
<*/style>

7 code ที่ทำให้ background+สี เคลื่อนตามเม้าท์

Code bgสีเคลื่อนตามเม้า

<*style type="text/css"><*!--body{background:url(/////) repeat fixed center top;background-color:#EFE7E5;}--><*/style>

///////


8 code ใส่ BG โดยไล่เฉดสี (gradient) 

BG ไล่เฉดสี

<*body style="filter:progid:DXImageTransform.Microsoft.Gradient
(endColorstr='#///สีที่ 1///',startColorstr='#///สีที่ 2///',
gradienttype=0);">

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

9 Codeลบกรอบขาว

Code ลบกรอบขาว

<*style>table {background-color: transparent;border-style: none;border-spacing: none;}TD {border:none;border-color: none;background: none;}<*/style>

---

Code ที่เกี่ยวข้อง

1 Code mouse hi5,Blog,myspaces,diary

มี 2 แบบ

Code cursor

1.<*style>body{cursor:url("////////");}<*/style>

2.
<*style type="text/css">body {cursor: url(//////////); }
<*/style>

2 Code โลโก หรือHead blog

Codeโลโก

<*p align=center><*img src="ใส่ภาพ/"><*/p>

ใส่โลโก วางที่ช่องสโลแกน ให้อยู่ ซ้าย ขวา ก็เปลี่ยน ที่center

เข้าไปที่ปรับแต่งบล๊อก เลือกใส่ช่อง
ตั้งชื่อ Slogan ของ Blog

โค๊ด <*p align=center><*img src="ใส่ภาพHead blog/"><*/p>

ก่อนนำไปวางลบจุด ดอกจัน * ออกก่อน



3.ใส่รูปเรียงแบบมีสกอร์

Codeใส่รูปเรียง

<*DIV align=left style=' color: #666600; background-color: #666600; border: solid 2px black; width:300px; height:400px; overflow: scroll; '>
1-------
2-------
<*/DIV>

Code ใส่รูป หรือข้อความ เช่น Code นาฬิกา

<*DIV align=left style='color:#663300; background-color: #FFFFFF; border: solid 1px black;width:300px;height:80px;overflow:scroll;'>
///ใส่ข้อความ ///
<*/DIV>

     

4.ใส่กรอบให้รูปเล็กเรียง

Codeใส่รูปเล็กเรียง

<*table border="0"align="center"><*tbody><*tr>
<*td align="center" valign="middle" style="border:1px solid #BC8F8F "><*img src="//////"border="0"/><*/td>
<*td align="center"valign="middle"style="border:1px solid #BC8F8F ">

<*img src="///////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F ">

<*img src="////////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F">

<*img src="////////"border="0"/><*/td><*td align="center"valign="middle" style="border: 1px solid#BC8F8F ">

<*img src="/////"border="0"/><*/td><*/tr><*/tbody><*/table>

เอารูปมาใส่ในช่อง"////////" และเอาจุด*ออกก่อน
เลื่อนทุก<*img src="////////".....ให้ติดกันก่อนให้เรียงเป็นแถว
แล้วนำไปวางในช่องรายละเอียด .ดังตัวอย่าง.

5 ใส่รูปให้ TOP 

Codeใส่รูปTOP

<*center><*a href="#top"><*img src=https://www.bloggang.com/data/c/chomporn/picture/1295892909.gif><*/a><*/center>

6.สกอบาร์ อยากใส่สีอะไรที่โค๊ดสี# มี 2 แบบ

Codeใส่สกอบาร์

<*STYLE type="text/css"><*!-- BODY { scrollbar-face-color:WHITE; scrollbar-arrow-color:#e36b7d; scrollbar-highlight-color:#e36b7d; scrollbar-3dlight-color:WHITE; scrollbar-shadow-color:WHITE;scrollbar-darkshadow-color:#e36b7d; } --><*/STYLE>
<*style type="text/css"><*!--html, body { scrollbar-base-color:#F0DF39;scrollbar-arrow-olor:#F0DF39;}--><*/style>

7 ทำข้อความมีสีเหลือบ

<*div style="filter:shadow(color=#ccffcc direction=800); position:relative;width:100%;"><*font color="#006600">สีที่นำไปใช้กับข้อความเหลือบ<*/font>
<*/div>

สีที่นำไปใช้กับข้อความเหลือบ

8ใส่ข้อความ,ใส่โค๊ดสี หรือใส่รูปวิ่ง

Codeใส่รูปวิ่ง

<*marquee width="600"scrollamount="3"scrolldelay="80"><*font color="#F5F5DC" style="font-size:24px">**ใส่ข้อความที่เราต้องการ ใส่ข้อความที่เราต้องการ **<*/font><*/marquee>

**ใส่ข้อความที่เราต้องการ ใส่ข้อความที่เราต้องการ **

9 border แบบต่างๆ 

Border แบบต่างๆ

style:solid , style: double, style:dashed style: ridge ,style: groove

border แบบต่างๆ กรอบ solid กรอบdouble กรอบdashed กรอบdotted กรอบridge กรอบ inset กรอบoutset กรอบgroove

10. Bullet คือรูปจุดกลมๆที่แสดงอยู่หน้าGroupblog

Code Bullet

Code
<*style>ul{list-style: ;list-style-image: url(http:ของ รูป bullet);}<*/style>

11. ใส่สี+ใส่รูป หน้าชื่อ group blog

Code หน้าชื่อ group blog

ความจริงรูปพวกนั้นไม่ใช่ bullet สังเกตดูจะเห็น bullet เดิมยังมีอยู่
วิธีทำคือ เข้าไปจัดการที่ group blog แล้วกดเปลี่ยนชื่อของ group blog นั้น 

---

ใส่รูปเข้าไปข้างหน้า ใช้คำสั่งนี้ได้เลย
<*img src=URLของรูป border=0>

---

ใส่ สีอะไร ก็ใส่คำสั่งสีเข้าไปข้างหน้าข้อความ
<*font color="#ff69b4"size="3">ใส่ข้อความ<*/font>

12. เปลี่ยนรูปอมยิ้ม (log in) ท้ายชื่อ

Code อมยิ้ม

ข้อนี้ไปเอามาจากบล็อกของคุณ ชาเขียว หารูปที่ต้องการมาแทนอมยิ้มอันเก่า แล้วใส่ url ของรูปเข้าไป

Code

<*script>iLength = document.images.length; for(i=0;i<*iLength;i++) if(document.images
[i].src=="https://www.bloggang.com/images/smile.gif") {document.images[i].src="https://ของรูปที่ต้องการ"}<*/script>

copy code ไปใส่ในช่อง script

13. Code Wrist Band เรารักในหลวง

Code Wrist Band

script ของ wrist band เพื่อนๆส่งมาให้ป้ามดจาก https://thaiblogger.org

Code มุมซ้าย
<*script type="text/javascript" src="https://thaiblogger.org/webbands/weloveourking_left.js"><*/script>

Code มุมขวา
<*script type="text/javascript" src="https://thaiblogger.org/webbands/weloveourking_right.js"><*/script>

นำโค้ดใส่ที่ช่อง script เป็นรูป wristband เรารักในหลวงคาดที่หัวมุมบล็อกด้านบน ให้เลือกซ้าย และขวา

*******


โค้ดใส่กรอบ+รูปให้กล่องเม้นท์

<*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>

โค้ด ให้ข้อความหรือรูปภาพ ที่คอมเม้นท์ อยู่ตรงกลาง


<*style>div.comment{text-align: center;}<*/style>

******



14. สร้าง link

Code Link

<*a href =URLของเว็บที่ต้องการ///// target=_blank><*img src=URL///ของรูปที่ทำลิงค์//// link border=0<*/a>

สร้างรูปให้ link โดยใส่คำสั่งรูปต่อท้ายเข้าไป

15. สร้างรูป-อักษร เคลื่อนที่
Code 1

Code วิ่งๆๆ

ใส่รูปหรือข้อความให้เคลื่อนที่ (Marquee)
การเคลื่อนที่มีหลายแบบ
เปลี่ยนทิศทางการเคลื่อนที่ ที่ direction
และเปลี่ยนความเร็วที่ scrollamount

<*marquee>ใส่ข้อความวิ่งตรงนี้<*/marquee>

Code 2
***

Code วิ่งๆๆ

<*marquee direction=right scrollamount=1>
ใส่ข้อความตรงนี้ <*/marquee>


ใส่ข้อความตรงนี้

Code 3

Code วิ่งๆๆ

<*marquee><*img src=ใส่รูป><*/marquee>

Code 4

Code วิ่งๆ

<*marquee direction=right scrollamount=1>
<*img src=ใสรูป><*/marquee>

Code Code ใส่ข้อความหรือรูปวิ่งๆ5

Codeวิ่งๆๆ

<*marquee direction=right scrollamount=2>
<*img src="https://images.antifluff.com/download.php?file=q25gm4ny2yj1tymuyqiw.gif"> ยินดีต้อนรับทุกท่าน<*/marquee>


ยินดีต้อนรับทุกท่าน

Code 6

Codeวิ่งๆ

<*marquee direction=up style="filter:wave(add=0,lightstrength=75, phase=1, strength=1,freq=2);color:#4682B4"><*center>
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่<*/marquee>

ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่
ใส่ข้อความหรือรูปที่นี่

---

**********

Code 7

Codeใส่สองอย่างวิ่งๆๆ

<*marquee width=350 height=250 direction=up scrollamount=1><*center>ใส่ข้อความ และรูปที่นี<*/center><*/marquee>

ใส่ข้อความและรูปที่นี

*scrollamount=1 มีระดับความเร็วตามตัวเลข 1.2.3.4.ฯ
วิ่งช้าสุดคือ1 น้อย ค้อยเร็วขี้นๆ ตามตัวเลข 2-3-4 ที่เพิ่มขึ้น

17. วิธีคัดลอกรูปจากที่อื่นมาใส่อัลบั้มหรือไว้ใช้

Codeคัดลอกรูป

1.) การนำ URL รูปมาทำเป็น background มาใส่ในช่อง background image URL

1.1 จะไปหา URL ได้จากไหน ง่ายๆ ถ้าเพื่อนๆ เล่นอินเตอร์เน็ตแล้วไปเจอรูปที่ถูกใจ ก็คลิกขวาที่ที่รูปนั้น แล้วเลือก Properties
แล้วก๊อปปี้ URL ใน Properties ก่อนออกคลิกที่ save ก่อน
นำมาใส่ที่โค๊ด

<*img src="//////////">
1.2 จากนั้น Copy URL ค่ะ
<*img src="https://hi5.kapook.com/images_bg/images_05.jpg">

1.3 เมื่อได้ URL แล้วก็นำมามาที่ Background Image URL เท่านี้ก็เสร็จแล้วค่ะ

18.โค๊ดรูปกล่องคอมเม้น:-ดังนี้ 

แล้วนำไปวางที่ Script area

Codeใส่กล่องคอมเม้น

<*style type=text/css>textarea{width:413;height:376;background:url
("////URLของรูป/////");color=blue;font-family:KodchiangUPC; font-size:17pt;}<*/style>

19. Code กรอบที่นำมาจากคุณParadijs

โค๊ดที่เรายังไม่มี และนำมาจากบล๊อกคุณไหม

1

กรอบใส่รูป <*table border="0"cellspacing="2" cellpadding="2" width="" align="center"style="border: 1px ridge#A0522D"><*tbody><*tr><*td align="center" valign="middle" style="border:1px ridge #FFA6D1"><*img src=" ////////"border="0"><*/td><*/tr><*/tbody><*/table>

2

เพื่อป้องกันหน้าบล็อคยืด จากการที่เพื่อนๆ ใส่รูป ใน Comment ใหญ่เกินไป ใส่โค้ดนี้ ไว้ที่ Script Area ค่ะ <*style>div.comment{overflow: auto; width: 380px; height: auto;}<*/style>

3.โค้ดทำกรอบให้กับ Group Blog, All Blogs, Friends' blogs, Links, และ Emotions

<*style>li a {display: block;padding: 5px 5px 5px 5px;border: 1px ใส่ชนิดของกรอบ ใส่โค้ดสีกรอบ;background- image:url(ใส่ URLรูป);text-decoration: none;width: 180px;}<*/style> <*style>li a:hover {display: block;padding: 5px 5px 5px 5px;border: 1px ใส่ชนิดของกรอบ ใส่โค้ดสีกรอบ;background- image:url(ใส่ URLรูป);text-decoration: none;width: 180px;} <*/style> <*style>fieldset{border: 3px ใส่ชนิดของกรอบ;padding: 5px 5px 5px 5px;border-color : ใส่โค้ดสีกรอบ;}<*/style> <*tr><*td><*/tr><*/table>

20.กรอบรอบนอกของบล๊อก 

<*script language="JavaScript1.2"> if (document.all) document.body.style.cssText="border:15 inset green" <*/script> นำไปใส่ที่Script area

////////////////ต่อจากตอนที่ 1////////////////


21.นำโค๊ดมาให้ทดลองทำ

กรอบตัวอย่างสามารถทำเองได้

Code กรอบทำเอง

Code กรอบทำเอง

<*table border="2"cellspacing="16"cellpadding="10"width="100%"align="center"style="background-image: url('///๑////')"><*tbody><*tr><*td align="center"valign="middle"style="background-image: url('//////๒////')"><*table border="1"cellspacing="5"cellpadding="5"width="100%"align="center"style="background-image:url('////๓//////')"><*tbody><*tr><*td align="center"valign="middle">

ใส่ข้อความ

<*/td><*/tr><*/tbody><*/table><*/td><*/tr><*/tbody><*/table><*/font>

รูปที่นำมาใส่ มี ๓ รูป

รูปที่('///๑////') - รูปกรอบเช่นรูปวิบๆ แบบ gif
'https://6.share.photo.xuite.net/lam1112/1699a0d/4212433/168698940_x.jpg'

รูปที่('//////๒////') - รูปเช่นรูปเพชร
'https://g.udn.com.tw/community/img/PSN_PHOTO/winnie777777/f_4817975_1.gif'

รูปที่('////๓//////') - รูปสีพื้นเป็นแบกกราว
'https://www.colourlovers.com/img/DEFFB3/228/161/Minty.png'

22.วิธีลดขนาดรูป gif

ลดขนาดรูป

ใส่ขนาดตัวเลขที่ต้องการเพื่อลดขนาดรูป
โดยกำหนดขนาดลดลงตามสัดส่วนของรูป

<*center><*img src=http:XXX width=400 height=300><*/center>




23.Codeป้องกันไม่ให้มีกรอบสีน้ำเงินที่รูป

ป้องกันกรอบสีน้ำเงิน

<*style>img {border:none;}<*/style>

โค้ดนี้จะมีผลกับทุกๆรูป 

ต่อไปเมื่อเราใส่โค้ด หริอใส่รูป
ก็ไม่ต้อง ใส่ border=0 อีกต่อไป
ใช้แค่ <*img src=//////////.> 



24.โค้ด ที่ทำให้ข้อความหรือรูปภาพ ที่เพื่อนๆคอมเม้นท์ ให้อยู่ตรงกลาง

<*style>div.comment{text-align: center;}<*/style> นำไปวางที่ Script area

25.โค๊ดใส่ข้อความพร้อมรูป 1-9 จากบล๊อกคุณพีช

1 .โค้ดใส่ข้อความกำกับภาพ โค้ด.... <*img src="http:รูป" alt="...ข้อความ..."/>

2. โค๊ดด้านซ้ายของรูป <*img src="http:รูปภาพ" align=right hspace=10> ข้อความ <*br clear=right>

3.ใส่ข้อความกำกับด้านซ้ายบรรทัดบนของรูปภาพ <*img src="http:รูปภาพ" align="top"> ข้อความที่ต้องการ

4.ใส่ข้อความด้านขวาของรูป <*img src="http: รูปภาพ" align=left hspace="10" vspace="10"/> ใส่ข้อความ <*br clear=left>

5. ภาพอยู่ด้านขวา และมีรูปอยู่ใต้ข้อความภาพด้านซ้าย โค้ด...... <*img src="https://xxxxxxx" align=right hspace=10>  ใส่ข้อความ <*img src='https://xxxxxxx'> <*br clear=right>

6.ภาพด้ายซ้ายหนึ่งรูป และด้านขวาสองรูป โดยมีข้อความระหว่างกลาง <*src="https://xxxxxxx" align=left hspace=10> <*img src='https://xxxxxxx'> ใส่ข้อความ <*img src='https://xxxxxxx'> <*br clear=left>

7.โค้ดใส่ข้อความกำกับทางด้านขวาบรรทัดล่างของรูป <*img src="http:รูปภาพ" align="bottom">  <*img src='https://xxxxxxx'> <*br clear=right>

8. ใส่ข้อความด้านขวา <*img src="http:รูปภาพ" align="left"> ข้อความ <*br clear="left">

9 .ใส่ข้อความทางด้านซ้ายของรูป โค้ด....... <*img src="http:รูปภาพ" align=right>

ใส่ไว้ที่ต่างๆ Left= จัดภาพไว้ด้านซ้ายของตัวหนังสือ(ตัวหนังสืออยู่ขวา) Right= จัดภาพไว้ด้านขวาของตัวหนังสือ(ตัวหนังสืออยู่ซ้าย) Top = ตัวหนังสืออยู่บรรทัดบนของภาพ Middle= ตัวหนังสืออยู่บรรทัดกลางของภาพ Bottom = ตัวหนังสืออยู่บรรทัดล่างของภาพ hspace สำหรับระยะห่างแนวนอน และ vspace สำหรับระยะห่างแนวตั้ง

ขอแสดงความยินดี กับเพื่อนด้วยค่ะ

Code
<*TABLE width="250" bgcolor="#FFF0cc"><*tr>
<*td align="center" height="60" style="border-
color:#688E23; border-width:6px; border-style:double;">
<*FONT color="#688E23" size="3">
<*img src="https://i123.photobucket.com/albums/o301/
myicon-2007/mcom141.gif"align= left hspace=10>
ขอแสดงความยินดีกับเพื่อนด้วยค่ะ
<*br clear=right>
<*/FONT><*/td><*/tr><*/TABLE>

<*TABLE width="250" bgcolor="#FFF0cc"><*tr>
<*td align="center" height="60" style="border-
color:#688E23; border-width:6px; border-style:double;">
<*FONT color="#688E23" size="3">
<*img src="https://i123.photobucket.com/albums/o301/
myicon-2007/mcom141.gif"align="center">
ขอแสดงความยินดี
กับเพื่อนด้วยค่ะ
<*br clear=right>
<*/FONT><*/td><*/tr><*/TABLE>


26.วิธีเปลี่ยน Title ของ Bloggang

<*script>window.document.title="ใส่ข้อความที่ Title ของ Bloggang ตามใจชอบ.";<*/script> นำไปวางที่ Script area

27.โค้ด Blockquote

จัดข้อความยาวๆให้สวยงาม  อ่านได้ง่ายๆโดยจัด ระยะเว้นวรรคหน้าหลังให้เท่าๆกัน <*blockquote>ใส่รายละเอียดที่นี่<*/blockquote>

28.Code เปลี่ยนสี font ของ link

<*style>A:hover{color:#F5F5DC;text-decoration: none;position: relative;left: 4px; top:4;}A:link{color:#20B2AA;text-decoration:none;}A:visited{color: #CD5C5C;text-decoration:none;<*/style>

โค้ดสีแต่งบล็อก

เครดิต..นำมาจาก Bloggang : zairill

  ที่มาจากเว็บสี       https://xn--code-3jovd.plus.in.th/

   ที่มาจากเว็บสี       https://xn--code-3jovd.plus.in.th/

#FFFFFF	#FFFFCC	#FFFF99	#FFFF66	#FFFF33	#FFFF00
#FFCCFF	#FFCCCC	#FFCC99	#FFCC66	#FFCC33	#FFCC00
#FF99FF	#FF99CC	#FF9999	#FF9966	#FF9933	#FF9900
#FF66FF	#FF66CC	#FF6699	#FF6666	#FF6633	#FF6600
#FF33FF	#FF33CC	#FF3399	#FF3366	#FF3333	#FF3300
#FF00FF	#FF00CC	#FF0099	#FF0066	#FF0033	#FF0000

#CCFFFF	#CCFFCC	#CCFF99	#CCFF66	#CCFF33	#CCFF00
#CCCCFF	#CCCCCC	#CCCC99	#CCCC66	#CCCC33	#CCCC00
#CC99FF	#CC99CC	#CC9999	#CC9966	#CC9933	#CC9900
#CC66FF	#CC66CC	#CC6699	#CC6666	#CC6633	#CC6600
#CC33FF	#CC33CC	#CC3399	#CC3366	#CC3333	#CC3300
#CC00FF	#CC00CC	#CC0099	#CC0066	#CC0033	#CC0000

#99FFFF	#99FFCC	#99FF99	#99FF66	#99FF33	#99FF00
#99CCFF	#99CCCC	#99CC99	#99CC66	#99CC33	#99CC00
#9999FF	#9999CC	#999999	#999966	#999933	#999900
#9966FF	#9966CC	#996699	#996666	#996633	#996600
#9933FF	#9933CC	#993399	#993366	#993333	#993300
#9900FF	#9900CC	#990099	#990066	#990033	#990000

#66FFFF	#66FFCC	#66FF99	#66FF66	#66FF33	#66FF00
#66CCFF	#66CCCC	#66CC99	#66CC66	#66CC33	#66CC00
#6699FF	#6699CC	#669999	#669966	#669933	#669900
#6666FF	#6666CC	#666699	#666666	#666633	#666600
#6633FF	#6633CC	#663399	#663366	#663333	#663300
#6600FF	#6600CC	#660099	#660066	#660033	#660000

#33FFFF	#33FFCC	#33FF99	#33FF66	#33FF33	#33FF00
#33CCFF	#33CCCC	#33CC99	#33CC66	#33CC33	#33CC00
#3399FF	#3399CC	#339999	#339966	#339933	#339900
#3366FF	#3366CC	#336699	#336666	#336633	#336600
#3333FF	#3333CC	#333399	#333366	#333333	#333300
#3300FF	#3300CC	#330099	#330066	#330033	#330000

#00FFFF	#00FFCC	#00FF99	#00FF66	#00FF33	#00FF00
#00CCFF	#00CCCC	#00CC99	#00CC66	#00CC33	#00CC00
#0099FF	#0099CC	#009999	#009966	#009933	#009900
#0066FF	#0066CC	#006699	#006666	#006633	#006600
#0033FF	#0033CC	#003399	#003366	#003333	#003300
#0000FF	#0000CC	#000099	#000066	#000033	#000000

ขอขอบคุณ เวปบล็อกจากคุณป้าชมพร  

และให้เครดิตกับที่มาแหล่งข้อมูล

โค๊ดจากคุณกึ่งยิง, ป้ามด ,คุณ Paradijs,คุณsomjadean100

ยินดีให้ลิงค์ไปที่บล๊อกของคุณ!

https://www.bloggang.com/mainblog.php?id=chomporn&month=19-08-2011&group=23&gblog=76