วันพุธที่ 14 พฤษภาคม พ.ศ. 2557

การเปลี่ยน icon bookmark ของ firefox

คราวที่แล้วเราได้รู้วิธีเปลี่ยน Icon Bookmark ใน Chrome ไปแล้ว
คราวนี้เรามาดูวิธีการเปลี่ยน Icon Bookmark ใน Firefox กัน

การเปลี่ยน Icon Bookmark ของ Firefox นั้นง่ายกว่า Chrome มาก
Firefox นั้นมีไฟล์ userChrome.css(ไม่ได้มีมาโดย default)
ซึ่งสามารถใช้ปรับแต่ง userInterface ได้
ทำให้ใน Firefox สามารถเปลี่ยนได้ทั้งรูป Icon และรูป Folder ใน Bookmark โดยมีวิธีดังนี้

การเปลี่ยนรูป Icon

1) C:\Users\Your_Username\AppData\Roaming\Mozilla\Firefox\Profiles\Your_Profile_Folder
หรือสามารถเปิดใน Firefox ได้ที่เมนู ช่วยเหลือ>ข้อมูลการแก้ไขปัญหา ในหัวข้อ แอปพลิเคชั่นพื้นฐาน กดที่ปุ่ม แสดงโฟลเดอร์
2) สร้าง Folder ชื่อ chrome และสร้างไฟล์ userChrome.css ในนั้น
3) เปิดไฟล์ userChrome.css และใส่

/* First line of userChrome.css must be this: */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* Custom favicon for this bookmark */
.bookmark-item[label="BOOKMARK_NAME_HERE"] image {
width:0!important;
height:0!important;
padding: 0 0 16px 16px !important;
background:url(BASE_64_STRING_HERE)!important;
}

แก้ไข BOOKMARK_NAME_HERE เป็นชื่อ Bookmark ที่ต้องการแก้ไข Icon
แก้ไข BASE_64_STRING_HERE เป็นรหัสรูปภาพ Icon ที่ต้องการใส่แทนอันเก่าที่เข้ารหัสซึ่งสามารถเข้ารหัสได้ที่ นี่
โดยให้ copy หลังจาก src="copy ตรงนี้" />
4) สำหรับคนที่ต้องการทำให้ Icon ไม่แสดงชื่อสามารถทำได้โดยเพิ่ม code ต่อจากอันเก่าดังนี้

/* Hide the text of this bookmark */
.bookmark-item[label="BOOKMARK_NAME_HERE"] {
margin-right: 0px !important; width: 22px !important;
}
.bookmark-item[label="BOOKMARK_NAME_HERE"] > .toolbarbutton-text {
 display: none !important;
}
.bookmark-item[label="BOOKMARK_NAME_HERE"] image {
 margin-left: 4px !important;
}
แก้ไข BOOKMARK_NAME_HERE เป็นชื่อ Bookmark ที่ต้องการแก้ไข Icon
5) restart Firefox เมื่อเปิดมาก็จะเห็นว่า Icon เปลี่ยนไปแล้ว

การเปลี่ยนรูป Folder

จะคล้ายๆเปลี่ยนรูป Icon โดยต้องเข้าไปแก้ไขในไฟล์ userChrome.css
โดยเพิ่ม code เข้าไปดังนี้

#personal-bookmarks .bookmark-item[container][label="Folder Name"],
#bookmarksMenuPopup .bookmark-item[container][label="Folder Name"],
appmenu_bookmarksPopup .bookmark-item[container][label="Folder Name"]{
list-style-image:url('folder-icon.png')!important;
-moz-image-region:auto!important;
}

โดยเปลี่ยน Folder Name ให้เป็นชื่อ Folder ที่ต้องการเปลี่ยนรูป Icon
และเปลี่ยน folder-icon.png เป็นที่อยู่ไฟล์รูปที่้เราต้องการใช้
หรือสามารถฝากรูปไว้ที่เว็บแล้วใช้เป็น url แทนก็ได้
จากนั้น restart Firefox

Credit:
http://www.tersetechtips.com/how-to-change-firefox-bookmark-icons-favicons-without-extensions-or-addons/
https://support.mozilla.org/th/questions/974594

ไม่มีความคิดเห็น:

แสดงความคิดเห็น