นโยบายการจัดการความรู้ มหาวิทยาลัยสงขลานครินทร์ 1.ให้ใช้เครื่องมือการจัดการความรู้ผลักดัน คุณภาพคน และกระบวนทำงาน 2.ส่งเสริมการแลกเปลี่ยนประสบการณ์การทำงาน จากหน้างาน 3.ส่งเสริมให้มีเวทีเรียนรู้ร่วมกัน
อ่าน: 1451
ความเห็น: 0

การเปลี่ยนเว็บเป็นสีขาวดำ เพื่อไว้อาลัย "ในหลวง รัชกาลที่ 9" [C]

เปลี่ยนเว็บเป็นสีขาวดำ เพื่อไว้อาลัย "ในหลวง รัชกาลที่ 9"

หลังจากทราบข่าวจากสำนักพระราชวังเรื่องพระบาทสมเด็จพระปรมินทรมหาภูมิพลอดุลยเดช สวรรคต ได้มีการไว้อาลัยจากหน่วยงานทั้งภาครัฐและเอกชน โดยให้มีการแต่งกายชุดดำไว้ทุกข์ 1 ปี ตามประเพณีที่ได้มีการปฏิบัติกันมา รวมถึงเว็บไซต์หน่วยงานต่าง ๆ ทั้งของทางราชการและเอกชนได้มีการปรับเปลี่ยนให้เป็นสีขาวดำ เพื่อเป็นการไว้อาลัยด้วยเช่นกัน

จึงขอรวบรวมวิธีการปรับเปลี่ยนเว็บไซต์ให้เป็นสีดำประเภทต่าง ๆ ตามวิธีการที่ได้รวบรวมมาได้ ดังนี้

1. หากเว็บของเรามี Base ไฟล์ css ให้เปิดขึ้นมาแล้วนำ Code ลงไปตามด้านล่าง

img {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray; /* IE 6-9 */
}
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray; /* IE 6-9 */
}

2. หากเว็บของเราไม่มี Base css ให้นำ Code ตามด้านล่างนี้ลงไปในส่วนของ <head> ทุกหน้าในเว็บ
*ข้อสังเกตจะมีการใช้ tag <style></style> ด้วย

<style>
img {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray; /* IE 6-9 */
}
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray; /* IE 6-9 */
}
<style>

3. หากเป็นการใช้เว็บไซต์สำเร็จรูป ในที่นี้จะยกตัวอย่าง CMS ที่มีการใช้งานแพร่หลาย คือ joomla และ wordpress

3.1 หากใช้ joomla 1.5
สามารถใช้วิธีการดังข้อที่ 1 โดยนำ code ไปใส่ไว้ที่ css ที่เราได้ทำการเรียกใช้ Template นั้น ๆ เป็นค่าเริ่มต้น โดยมีวิธีการดังนี้
1. ไปที่่เมนู Extensions -> Template Manager


2. จากตัวอย่าง Template ที่ใช้คือ JA_Edenite ให้กดคลิกเข้าไป


3. กดที่ Edit CSS



4.ไฟล์ที่จะเพิ่ม code ชื่อ template.css กดเลือกจากนั้นไปคลิกที่ Edit เพื่อแก้ไข


5. นำ Code ไปใส่ที่ตำแหน่งล่างสุด จากนั้นกดปุ่ม Save


3.2 หากใช้ joomla 2.5/3.x
1. สามารถใช้วิธีการดังข้อที่ 1 โดยนำ code ไปใส่ไว้ที่ css ที่เราได้ทำการเรียกใช้ Template นั้น ๆ เป็นค่าเริ่มต้น โดยมีวิธีการดังนี้
1.1 ไปที่เมนู Extensions -> Template Manager


1.2 จากตัวอย่าง Template ที่ใช้คือ Target ให้กดคลิกเข้าไป


1.3 เข้าไปที่ Folder css ไฟล์ที่จะเพิ่ม code ชื่อ style.css


1.4 นำ Code ไปใส่ที่ตำแหน่งล่างสุด จากนั้นกดปุ่ม Save


2. สามารถติดตั้ง plugin ที่ใช้สำหรับเปลี่ยนเว็บไซต์เป็นสีขาวดำได้ทันที โดยมีวิธีการดังนี้
2.1 ดาวน์โหลดได้จาก https://goo.gl/PwMu6a
2.2 ทำการติดตั้ง plugin ให้เสร็จเรียบร้อย
2.3 หลังจากติดตั้ง plugin แล้ว ให้ไปทำการ Enable plugin ให้ไปที่เมนู Extension -> Plugin Manager-> System - EXT Custom JS/CSS


2.4 ทำการปรับสถานะให้เป็น Enabled จากนั้นกดปุ่ม Save


 
3.3 หากใช้ wordpress
1. สามารถใช้วิธีการดังข้อที่ 1 โดยนำ code ไปใส่ไว้ที่ css ที่เราได้ทำการเรียกใช้ Theme นั้น ๆ เป็นค่าเริ่มต้น โดยมีวิธีการดังนี้
1.1 ไปที่เมนู Appearance -> Editor


1.2 จากตัวอย่าง Theme ที่ใช้คือ Sparkling ไฟล์ css ที่จะเพิ่ม Code ชื่อ style.css นำ Code ไปใส่ที่ตำแหน่งล่างสุด จากนั้นกดปุ่ม Update File



2. สามารถติดตั้ง plugin ที่ใช้สำหรับเปลี่ยนเว็บไซต์เป็นสีขาวดำได้ทันที โดยมีวิธีการดังนี้
2.1 ดาวน์โหลดได้จาก https://goo.gl/2LQwFK
2.2 ทำการติดตั้ง และ Active plugin
2.3 วิธีเซ็ตค่า % ให้ไปที่เมนู Settings -> WP Easy Grayscale


2.4 แล้วใส่ตัวเลขค่า % ได้ตามใจชอบ แล้วกด Save Changes


ข้อแนะนำเพิ่มเติม
- วิธีการเพิ่ม Code ในไฟล์ CSS ของเว็บไซต์สำเร็จรูปเป็นการแก้ไขผ่าน Backend ของระบบก่อนทำการแก้ไขต้องตรวจสอบให้แน่ใจก่อนว่ามีสิทธิ์แก้ไขผ่านเว็บไซต์ได้หรือไม่ หากไม่มีสิทธิ์ในการแก้ไขผ่านเว็บไซต์ ให้ทำการเพิ่มสิทธิ์ของ Folder template ในระบบเสียก่อน
- นอกเหนือจากการเพิ่ม Code CSS ผ่านทาง Backend ของระบบแล้ว ยังสามารถเพิ่ม Code ได้ผ่านช่องทางอื่น ๆ เช่น Control Panel ของระบบ Web Hosting ซึ่งสามารถเข้าไปจัดการไฟล์ได้เช่นกัน
- ชื่อไฟล์ css ที่ใช้สำหรับปรับแต่งของแต่ละ template ในเว็บไซต์สำเร็จรูปบางครั้งชื่อที่ตั้งอาจจะแตกต่างไปจากนี้ ขึ้นอยู่กับผู้พัฒนา template แต่ส่วนใหญ่จะตั้งชื่อเพื่อสื่อให้ชัดเจน เช่น template.css, theme.css หรือ style.css

ปัญหาที่พบ
- วิธีการดังกล่าว ยังไม่รองรับ IE10, IE11

ที่มา
http://pantip.com/topic/35698513
http://joomlachannel.com/2016-10-13-12-14-17.html
http://www.tannysoft.com/content/wordpress-easy-grayscale

หมวดหมู่บันทึก: เรื่องทั่วไป
สัญญาอนุญาต: ซีซี: แสดงที่มา-ไม่ใช้เพื่อการค้า-อนุญาตแบบเดียวกัน Cc-by-nc-sa
สร้าง: 23 ตุลาคม 2559 18:04 แก้ไข: 18 สิงหาคม 2560 14:19 [ แจ้งไม่เหมาะสม ]
ดอกไม้
สมาชิกที่ให้กำลังใจ: Ico24 บิวตี้ และ Ico24 โอ๋-อโณ.
สมาชิกที่ให้กำลังใจ
 
Facebook
Twitter
Google

บันทึกอื่นๆ

ความเห็น

ไม่มีความเห็น
คุณต้องทำการเข้าระบบก่อนแสดงความเห็น