ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comความรู้ทั่วไปAmazonวิธีแต่ง astore ให้สวยกว่า AOM ไปเลย
หน้า: [1] 2 3 ... 13   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: วิธีแต่ง astore ให้สวยกว่า AOM ไปเลย  (อ่าน 44276 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
qwert001
ก๊วนเสียว
*

พลังน้ำใจ: 49
ออฟไลน์ ออฟไลน์

กระทู้: 298



ดูรายละเอียด เว็บไซต์
« เมื่อ: 04 มิถุนายน 2008, 13:42:02 »




แต่ง astore แบบรูปข้างบนนี้ผมใข้เวลา 4 นาที!!!

จริงๆแล้วมันก็ไม่ได้มีอะไรยากนะครับ






ขั้นที่ 1 แค่จัดหน้าโดยแก้ css


โค๊ด:
/* PAGE STYLE */
body {
      margin:auto;
      padding:0px;
      background:#FFFFFF;
      color:#000000;
      min-width:auto;
      font-family:'Verdana', sans-serif;
      font-size:9pt;
      font-weight:500;
      line-height:12pt;
      text-decoration: none;
margin-top:190px;
text-align:center;
background-image:
url('http://i129.photobucket.com/albums/p209/arnon001/tem2-1.jpg');
background-position: 50% 0%;
background-repeat: repeat-x
 
}

/* MAIN PAGE AREA */
#mainwrap {
      float:right;
}
#wrap {
       margin:0 auto;
       text-align:left;
}
#main {margin-top:90px;
      width:530px;
     
      overflow:hidden;
 border-style: solid;
border-left-width: thin;
border-top-width: thin;
border-bottom-width: thin;
border-right-width: thin;
border-color: #00FFFF;

}
div#header {
      background:#206BA2;
      padding:6px 24px 4px;
      margin:0;
      vertical-align:middle;
}
a#mainheadertitle {
      padding:0px;
      font-family:serif;
      font-size:15pt;
      font-weight:normal;
      line-height:1.5em;
      color:#FFFFFF;
      margin:0px;
      text-align:left;
      vertical-align:middle;
      text-decoration:none;
}
a#mainheadertitle:hover {
      text-decoration:underline;
}
td#mainheaderlogo {
      padding:5px;
}
img#mainlogo {
      padding-right:5px;
}
div#mainsubheader {
      background:#F2F2F2;
      padding:10px 24px;
      vertical-align:middle;
}
div#contentsubheader {
      width:482px;
      overflow:hidden;
}
div#subheaderlinks {
      float:right;
      text-align:right;
}
div#subheadertitle {
      font-size:12pt;
      font-weight:bold;
}
div#contenterror {
      background:#FFFFFF;
      padding:14px 24px;     
}
span.currentpage {
      font-weight:bold;
}

span.error {
      font-weight:bold;
}

/* SIDEBAR */
#sidebar {
      float:left;
      width:200px;
      overflow:hidden;
}
#sidebar ul {
      margin-bottom:0;
}
#sidebar h3, #sidebar p {
      padding:0 10px;
}

/* GENERAL SIDEBAR WIDGET STYLES */
ul#widget,ul.widget li.widget {
      margin:0;
      padding:0;
      list-style:none;
}
li.widget {
      float:left;
      width:200px;
      margin-bottom:0px;
}
ul#widget div {
      background:#FFFFFF;
}
ul#widget h3 {
      font-family:'Verdana', sans-serif;
      font-size: 10pt;
      font-weight: bold;
      color:#FFFFFF;
      margin:0px;
      padding:4px 15px 4px;
      text-align:left;
background-image:
url('http://i537.photobucket.com/albums/ff332/qecera/tab.jpg');

}





code css ด้านบนนี้ใส่ตรง Global ครับ



ขั้นที่ 2 ก็เอารูปภาพไปใส่เป็น Background ครับ
ทีนี้จะแต่งยังไงก็อยู่ที่จินตนาการครับ ลองดูภาพประกอบ



จากภาพแสดงให้เห็นว่าจริงๆแล้วก็เป็นเพียงการจัดหน้าเวบธรรมดา
แล้วเอา Background มาซ้อนครับ

วิธีการใส่ Background ก็คือ เอา url รูป background ไปใส่ตรงบรรทัดที่ 16 ใน css ครับ
ส่วนตรงหัวข้อ Search ที่เป็นสีดำๆ ก็เอา url รูปไปใส่ตรงบรรทัดรองสุดท้ายของ css ครับ




แค่นี้เองครับ การทำไม่ยากหรอกครับ มันยากตรงที่ทำยังไงให้มันออกมาดูลงตัว ให้ดูดี


ทุกคนทำได้อยู่แล้วครับ... Cheesy




รูปตัวอย่าง Background ของผมครับ



« แก้ไขครั้งสุดท้าย: 24 กันยายน 2008, 09:48:59 โดย qwert001 » บันทึกการเข้า

mahatang
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 45
ออฟไลน์ ออฟไลน์

กระทู้: 1,857



ดูรายละเอียด เว็บไซต์
« ตอบ #1 เมื่อ: 04 มิถุนายน 2008, 13:44:23 »

ขอบคุณครับ แล้วจะลองทำดู
บันทึกการเข้า

คุณป้าขา
เจ้าแม่ปราบเกรียน
Administrator
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 68
ออฟไลน์ ออฟไลน์

กระทู้: 3,682



ดูรายละเอียด เว็บไซต์
« ตอบ #2 เมื่อ: 04 มิถุนายน 2008, 13:44:35 »

 Shocked Shocked Shocked โหววววววววววววววว
บันทึกการเข้า

guy852
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 28
ออฟไลน์ ออฟไลน์

กระทู้: 3,090



ดูรายละเอียด เว็บไซต์
« ตอบ #3 เมื่อ: 04 มิถุนายน 2008, 13:52:19 »

 Cheesy เดียวผมใส่ระบบอัพโหลด css กับรูปก่อน  Grin
บันทึกการเข้า

khonthai
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 53
ออฟไลน์ ออฟไลน์

กระทู้: 2,303



ดูรายละเอียด
« ตอบ #4 เมื่อ: 04 มิถุนายน 2008, 14:02:35 »

โอ้วววววววววววว สุดยอดเลยครับ เดี๋ยวลองทำดูมั่ง Cool
บันทึกการเข้า
EThaiZone
เจ้าพ่อโลลิค่อน
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 321
ออฟไลน์ ออฟไลน์

กระทู้: 12,517



ดูรายละเอียด เว็บไซต์
« ตอบ #5 เมื่อ: 04 มิถุนายน 2008, 14:05:15 »

คนขายเทมของ astore จะตกงานก็คราวนี้แหละ  Tongue
บันทึกการเข้า

qwert001
ก๊วนเสียว
*

พลังน้ำใจ: 49
ออฟไลน์ ออฟไลน์

กระทู้: 298



ดูรายละเอียด เว็บไซต์
« ตอบ #6 เมื่อ: 04 มิถุนายน 2008, 14:11:29 »

ขอโทษคนขายเทม astore ด้วยนะครับ ผมไม่ได้จะลบหลู่
แต่ก็คงไม่กระทบอะไรเพราะคนขายเขาต้องมีเทคนิคและฝีมือมากกว่านี้อยู่แล้ว
 Smiley
« แก้ไขครั้งสุดท้าย: 04 มิถุนายน 2008, 14:13:04 โดย qwert001 » บันทึกการเข้า

payu
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 125
ออฟไลน์ ออฟไลน์

กระทู้: 1,887



ดูรายละเอียด
« ตอบ #7 เมื่อ: 04 มิถุนายน 2008, 14:11:58 »

คนขายเทมของ astore จะตกงานก็คราวนี้แหละ  Tongue

จริง จริง
บันทึกการเข้า

workshop
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 68
ออฟไลน์ ออฟไลน์

กระทู้: 1,131



ดูรายละเอียด
« ตอบ #8 เมื่อ: 04 มิถุนายน 2008, 14:16:21 »

ขอบคุณครับ Smiley
บันทึกการเข้า

torrentlive.net/signup.php?refer=workshop Refer เวปบิท (ยังเปิดรับอยู่)
tradeya
Verified Seller
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 186
ออฟไลน์ ออฟไลน์

กระทู้: 1,110



ดูรายละเอียด
« ตอบ #9 เมื่อ: 04 มิถุนายน 2008, 14:20:52 »

เห็นแล้วก็เอาไปลองทำด่วน  Grin Grin
บันทึกการเข้า

siamman
บุคคลทั่วไป
« ตอบ #10 เมื่อ: 04 มิถุนายน 2008, 14:21:48 »

คนขายเทมของ astore จะตกงานก็คราวนี้แหละ  Tongue
Smiley ผมว่าคงไม่กระทบมากมายหรอก เพราะบางคนหลายคนที่รู้วิธี แต่ก็อยากซื้อเวลา ยอมจ่ายดีกว่าเสียเวลาคิดหน้าตาหรือเวลามานั่งทำโฟโต้ช๊อป
บันทึกการเข้า
น้องบิ้ว
Verified Seller
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 190
ออฟไลน์ ออฟไลน์

กระทู้: 3,627



ดูรายละเอียด
« ตอบ #11 เมื่อ: 04 มิถุนายน 2008, 14:22:17 »


ขอโทษคนขาย astore ด้วยนะครับ ผมไม่ได้จะลบหลู่
แต่ก็คงไม่กระทบอะไรเพราะคนขายเขาต้องมีเทคนิคและฝีมือมากกว่านี้อยู่แล้ว
 Smiley

สอนดีแล้วคับเพื่อนๆจะได้ทำเป็นด้วยคับ อิอิ Cry Cry Cry
รูปแบบ css เหมือนๆกันคับ จะต่างกันตรงทำ blackground อะ
ตอนนี้  กำลังเปลี่ยนไปทำอย่างอื่นที่แทน แหะๆ Cheesy
บันทึกการเข้า
youcanberich
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 124
ออฟไลน์ ออฟไลน์

กระทู้: 2,804



ดูรายละเอียด
« ตอบ #12 เมื่อ: 04 มิถุนายน 2008, 14:23:58 »

แบบนี้คุณ qwert001
คนขายเทมของ astore จะตกงานก็คราวนี้แหละ  Tongue

จริง จริง

ตามนั้น สวยมากๆ ทำอยู่ทุกวันยังไม่ได้แบบนี้เลย  Cry
บันทึกการเข้า

ColdMoney
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 200
ออฟไลน์ ออฟไลน์

กระทู้: 12,623



ดูรายละเอียด เว็บไซต์
« ตอบ #13 เมื่อ: 04 มิถุนายน 2008, 14:25:05 »

ขอบคุณครับ แหล่มเลย  Cry
บันทึกการเข้า

janistar
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 30
ออฟไลน์ ออฟไลน์

กระทู้: 1,950



ดูรายละเอียด เว็บไซต์
« ตอบ #14 เมื่อ: 04 มิถุนายน 2008, 14:28:53 »

เยี่ยมค่ะ เด๋วว่างๆ ลองทำ ตอนนี้ง่วงทั้งว่น งานการไม่ได้ทำเลย  Smiley
บันทึกการเข้า

ฉันไม่มีตัวตน
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 65
ออฟไลน์ ออฟไลน์

กระทู้: 4,817



ดูรายละเอียด
« ตอบ #15 เมื่อ: 04 มิถุนายน 2008, 14:32:55 »

ขอบคุณคร้าบบบบ
บันทึกการเข้า
goldsaber
ก๊วนเสียว
*

พลังน้ำใจ: 26
ออฟไลน์ ออฟไลน์

กระทู้: 294



ดูรายละเอียด
« ตอบ #16 เมื่อ: 04 มิถุนายน 2008, 14:42:19 »

โอ้....ขอบคุณหลาย ๆๆๆๆๆ
บันทึกการเข้า

barbies55
Verified Seller
เจ้าพ่อบอร์ดเสียว
*

พลังน้ำใจ: 417
ออฟไลน์ ออฟไลน์

กระทู้: 11,535



ดูรายละเอียด เว็บไซต์
« ตอบ #17 เมื่อ: 04 มิถุนายน 2008, 14:50:51 »

ขอบคุณมากๆสำหรับเคล็ดวิิชาค่ะ
แต่ฝีมือการแต่งแบคกราวน์ของท่าน งามแต้ๆ
บันทึกการเข้า

รับทำเทมเพลท รับโมเทมเพลทให้เข้ากับสคริปต์ต่างๆ


On the Internet, Never One Know You are a Dog.
ผ้าขี้ริ้วห่อทองย่อมเป็นทองฉันใด เอาทองเปลวมาห่อขี้ก็ยังเป็นขี้ฉันนั้น
wat007
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 148
ออฟไลน์ ออฟไลน์

กระทู้: 1,179



ดูรายละเอียด เว็บไซต์
« ตอบ #18 เมื่อ: 04 มิถุนายน 2008, 14:51:25 »

 Grin  ขอบคุณนะครับ
บันทึกการเข้า

pingza
Newbie
*

พลังน้ำใจ: 1
ออฟไลน์ ออฟไลน์

กระทู้: 72



ดูรายละเอียด
« ตอบ #19 เมื่อ: 04 มิถุนายน 2008, 14:59:00 »

ขอบคุณคร๊าฟฟ  Smiley Smiley
บันทึกการเข้า

หน้า: [1] 2 3 ... 13   ขึ้นบน
พิมพ์