วิธีใช้:แคสเคดดิงสไตล์ชีตส์
 | หน้านี้เป็นหน้าสารสนเทศ ซึ่งอธิบายวัตรที่ตั้งแล้วของชุมชนแก้ไขของบางแง่มุมของบรรทัดฐานและขนบธรรมเนียมของวิกิพีเดีย ทั้งนี้ ไม่ใช่นโยบายหรือแนวปฏิบัติของวิกิพีเดีย เพราะยังไม่ผ่านการพิจารณาอย่างถี่ถ้วนจากชุมชน |
User style เป็นโค้ดสไตล์ชีตหรือแคสเคดดิงสไตล์ชีตส์ ที่ใช้ในการตกแต่ง รูปแบบวิกิพีเดียสำหรับผู้ใช้แต่ละคน โดยปกติจะใส่ในหน้า monobook.css ของผู้ใช้ ซึ่งความสามารถส่วนนี้สำหรับผู้ที่เป็นสมาชิกวิกิพีเดียเท่านั้น.
ผู้ใช้สามารถเปลี่ยนลักษณะหน้าตาของวิกิพีเดีย (หลังจากล็อกอิน) ได้ตามต้องการ ไม่ว่าจะเป็นฟอนท์ สี พื้นหลัง หรือโลโก้ของวิกิพีเดีย โดยใช้แคสเคดดิงสไตล์ชีตส์ บันทึกไว้ในเพจย่อยของหน้าผู้ใช้ เช่นถ้า หน้าผู้ใช้ของคุณเป็น "ผู้ใช้:MyName"
ก็ให้สร้างหน้าใหม่ชื่อ "ผู้ใช้:MyName/monobook.css" และเขียนโค้ดสไตล์ชีต ไว้ในหน้านี้
หลังจากบันทึกแล้ว, คุณต้องล้างแคชของเบราว์เซอร์เสียก่อน จึงจะเห็นการเปลี่ยนแปลง ด้วยวิธีดังต่อไปนี้:
- ใน Mozilla/Safari/Konqueror: กด Shift ค้าง แล้วกด Reload (หรือ Ctrl-Shift-R)
- ใน IE: กด Ctrl-F5
- ใน Opera: กด F5
โปรดสังเกตว่าเทคนิคนี้ เป็นการใช้งานภายในวิกิพีเดีย และสไตล์ชีตที่ผู้ใช้เขียนขึ้น ถูกบันทึกไว้ในหน้าที่ผู้ใข้อื่น ๆ สามารถเข้าไปอ่านได้ และผู้ใช้ทุก ๆ คนที่ใช้เทคนิคนี้ ตกลงที่จะเผยแพร่โค้ดของตนออกไป ภายใต้สัญญา GFDL
หน้าตาของวิกิพีเดีย[แก้]
ตามปกติผู้ใช้ที่เป็นสมาชิกวิกิพีเดีย สามารถเปลี่ยนหน้าตา(skin)ของวิกิพีเดียได้หลากหลาย ตามต้องการ โดยการแก้ไขข้อมูลในหน้า"การตั้งค่าของฉัน" (หรือ "พิเศษ:Preferences" ในส่วนแทป"หน้าตา" และแทป"แกเจต") ซึ่งหน้าตาของวิกิพีเดียที่เลือกใช้กันส่วนใหญ่(ที่ตั้งไว้โดยปริยาย) ก็จะเป็นหน้าตาของวิกิพีเดียที่เรียกว่า แบบ"monobook"
แต่หากผู้ใช้คนใดต้องการเปลี่ยนหน้าตา(skin)แบบ"monobook"ที่แสดงอยู่ ให้แตกต่างออกไป เช่นเเปลี่ยนสี เปลี่ยนฟอนท์ ก็อาจทำได้ สองวิธีคือ ตั้งค่าในเบราว์เซอร์ และการสร้างหน้าย่อย monobook.css ของตนขึ้นมา (เช่น ผู้ใช้:MyName/monobook.css)
การสร้างหน้าย่อย monobook.css ส่วนตัว(ไว้เป็นหน้าย่อย-subpage ของหน้าผู้ใช้) เป็นการใช้เทคนิคที่เรียกว่า สไตล์ชีตหรือ Cascading Style Sheets ในการปรับเปลี่ยนหน้าตาของวิกิพีเดีย ซึ่งจะมีผลเฉพาะภายหลังจากล็อกอินด้วยชื่อ ที่ตนใช้เท่านั้น แต่ทำให้สามารถใช้หน้าตาของวิกิพีเดียตามต้องการได้ ไม่ว่าจะไปใช้คอมพิวเตอร์เครื่องอื่นใดอ่านวิกิพีเดีย (โดยไม่ต้องมาคอยตั้งค่าในเบราเซอร์ทุกครั้ง) นอกจากนี้ยังสามารถปรับเปลี่ยนเปลี่ยนหน้าตา(skin)ของวิกิพีเดียได้หลากหลายมากๆิ และการเปลี่ยนหน้าตานี้ก็ไม่มีผลต่อการแสดงผลของผู้ใช้ท่านอื่นๆ (ดูตัวอย่าง(ภาษาอังกฤษ))
โดยทั่วไปหน้าตา(skin)แบบ monobook ของวิกิพีเดียจะถูกกำหนดอยู่ใน 5 แห่ง (ลองคลิกเข้าไปศึกษาโค้ดได้) คือ
- main.css
- MediaWiki:Common.css
- มีเดียวิกิ:Monobook.css
- หน้าย่อยส่วนตัวชื่อ monobook.css (เช่น ผู้ใช้:MyName/monobook.css - ยังไม่ได้สร้างขึ้นเมื่อเริ่มเป็นสมาชิกวิกิพีเดีย)
- การตั้งค่าในเบราว์เซอร์
การสร้างหน้าย่อยส่วนตัวชื่อ monobook.css (เช่น ผู้ใช้:MyName/monobook.css) ทำให้เราสามารถแก้ไขค่าต่างๆที่กำหนดไว้สำหรับหน้าตาแบบ monobook ได้ตามต้องการ เพียงแค่สร้างหน้าย่อยส่วนตัวชื่อ monobook.css ขึ้นมา ต่อมาในหน้า"แก้ไข" ใส่โค้ดที่ต้องการลงไป และกด"ดูตัวอย่าง" หน้าตาของวิกิพีเดียก็จะเปลี่ยนไป คุณสามารถแก้ไขและดูตัวอย่างไปเรื่อยๆ จนได้หน้าตาของวิกิพีเดียตามที่ต้องการแล้วจึงกด"บันทึก"
ค่าต่างๆ ที่สามารถกำหนดได้[แก้]
ตัวอย่างค่าต่างๆ ที่สามารถกำหนดได้ โดยการใช้เทคนิคแบบสไตล์ชีตใน monobook.css
- column-content
- content
- firstHeading
- bodyContent
- contentSub
- p-cactions
- p-personal
- p-logo
- p-navigation
- p-search
- p-tb
- p-lang
- footer
- f-poweredbyico
- f-list
ตัวอย่างสไตล์ชีต[แก้]
- ไม่แสดงโลโก้ของวิกิพีเดีย
# p-logo { display: none }
- ไม่แสดงโลโก้ของวิกิพีเดีย และเลื่อนกล่องข้อความซ้ายขึ้นไปแทนที่
# p-logo { display: none }
# column-one { padding-top: 0; }
- เปลี่ยนโลโก้ของวิกิพีเดียเป็นภาษาอังกฤษ (หรือเปลี่ยน url ได้ตามต้องการ ไปที่รูปใดๆในวิกิพีเดีย)
# p-logo a {
background: url (http://upload.wikimedia.org/wikipedia/en/b/bc/Wiki.png)
35% 50% no-repeat !important; }
- เอาพื้นหลังที่เป็นรูปหนังสือออก และเปลี่ยนพื้นหลังวิกิพีเดียเป็นสีเขียว
คุณสามารถเปลี่ยนพื้นหลังเป็นสีอื่นๆได้ โดยใช้เลขฐาน16 ตั้งแต่ #000000 ถึง #ffffff
body { background: #99ffff; }
- แสดงฟอนท์ตัวหนังสือให้ใหญ่ขึ้นเป็น120%
body, #globalWrapper { font-size: 120% !important; }
- ไม่แสดงเครื่องหมายสัญญลักษณ์หน้าชื่อผู้ใช้
li#pt-userpage { background: none }
- เปลี่ยนเครื่องหมายหน้าชื่อผู้ใช้เป็นรูปอื่น (หรือเปลี่ยน url ได้ตามต้องการ ไปที่รูปใดๆในวิกิพีเดีย)
li#pt-userpage { background:
url(http://upload.wikimedia.org/wikipedia/th/thumb/b/be/WikiBotany_Year.png/120px-WikiBotany_Year.png) }
- เปลี่ยนเครื่องหมายหน้าลิสต์ไปเป็นรูปอื่น (หรือเปลี่ยน url ได้ตามต้องการ ไปที่รูปใดๆในวิกิพีเดีย)
ul { list-style-image: url("http://upload.wikimedia.org/wikisource/th/f/f5/Sb1.gif") }
- เปลี่ยนสีอักษรในป้ายบอกทาง
#p-navigation .pBody a { color: blue; }
- เปลี่ยนฟอนท์-ขนาดอักษรในป้ายบอกทาง
#p-navigation .pBody a { font-family: Microsoft Sans Serif;font-size: 110%; }
- เปลี่ยนสีป้ายบอกทาง
คุณสามารถเปลี่ยนพื้นหลังเป็นสีอื่นๆได้ โดยใช้เลขฐาน16 ตั้งแต่ #000000 ถึง #ffffff
#p-navigation .pBody { background: #ffffaa; }
- เปลี่ยนขอบกรอบข้อความต่างๆเป็นแบบโค้งมน (แสดงผลตามต้องการเฉพาะในไฟร์ฟอกซ์)
#p-cactions ul li, #p-cactions ul li a {
-moz-border-radius-topleft: 1em;
-moz-border-radius-topright: 1em;
}
#content {
-moz-border-radius-topleft: 1em;
-moz-border-radius-bottomleft: 1em;
}
div.pBody {
-moz-border-radius-topright: 1em;
-moz-border-radius-bottomright: 1em;
}
ข้อมูลภายนอก[แก้]
อ่านรายละเอียดเพิ่มเติมได้ที่
และดูผลงานการตกแต่งรูปแบบวิกิพีเดีย(และโครงการที่เกี่ยวข้อง)ที่สวยงามแปลกตา และน่าสนใจโดยผู้ใช้ท่านอื่น ๆได้ที่