เปลี่ยนพื้นหลังแท็บใหม่ของ Firefox


22

ฉันมักจะใช้ชุดรูปแบบตัวเข้มหรือชุดรูปแบบมืดเริ่มต้นที่มาพร้อมกับ Firefox และฉันไม่ชอบสีพื้นหลังเริ่มต้นที่เป็นสีขาวเมื่อฉันเปิดแท็บใหม่ มีการเพิ่มที่ฉันใช้ที่ให้ฉันปรับแต่งแท็บใหม่ แต่ตอนนี้มันหายไปกับ Firefox 57 ...

ดังนั้นฉันจะเปลี่ยนพื้นหลังของแท็บใหม่ได้อย่างไร


ธีมสีเข้มสำหรับ Firefox overdodactyl.github.io/ShadowFox
Josh Habdas

คำตอบ:


28

ฉันคิดว่านี่อาจสนใจคนอื่นเช่นกัน จนถึงตอนนี้ฉันรู้ว่ามีแอดออนสองสามตัวที่จะทำสิ่งนั้นและวิธีที่จะทำโดยไม่ใช้แอดออน (ดูเหมือนว่าพวกมันส่วนใหญ่จะหายไปทุกวัน) ที่นี่เราไปกันแล้ว:

  1. ปรับแต่ง about: newtab (โปรดดูจุดที่ 3 ด้านล่าง)

    นี่เป็นส่วนเสริมเฉพาะสำหรับงานมันไม่เพียง แต่ให้คุณเปลี่ยนสีพื้นหลัง แต่ยังเลือกภาพพื้นหลังและปรับขนาดและจัดตำแหน่งตามที่คุณชอบ ... ดี!

  2. มีสไตล์ (โปรดดูจุดที่ 3 ด้านล่าง)

    มีสไตล์เป็นส่วนเสริมด้วยฟังก์ชั่นที่กว้างขึ้น มันช่วยให้คุณปรับแต่ง Firefox เองตราบเท่าที่จัดการ / ติดตั้งธีมและสกินสำหรับเว็บไซต์ยอดนิยมมากมายเช่น Google, Facebook, YouTube และอื่น ๆ อีกมากมาย ... ฉันคิดว่ามันเกินความจริงถ้าคุณต้องการมันสำหรับงานที่เรากำลังทำอยู่ .

  3. ทั้งสองอย่างข้างต้นจะทำงานกับ Firefox 57 เนื่องจากข้อ จำกัด ที่เพิ่มขึ้น Stylus พร้อมหน้าแท็บใหม่ของ Firefox 57 แสดงข้อความนี้:

    เพื่อเป็นการป้องกันความปลอดภัยเบราว์เซอร์ห้ามไม่ให้ส่วนขยายมีผลกระทบต่อหน้าเว็บในตัว (เช่น chrome: // version, หน้าแท็บใหม่มาตรฐานของ Chrome 61, about: addons และอื่น ๆ ) รวมถึงหน้าส่วนขยายอื่น ๆ แต่ละเบราว์เซอร์ยัง จำกัด การเข้าถึงแกลเลอรีส่วนขยายของตัวเอง (เช่น Chrome เว็บสโตร์หรือ AMO)

    ดังนั้นปล่อยให้ addons กันและทำให้มือของเราสกปรก!

    คุณอาจตัดสินใจว่าไม่ต้องการใช้ addon สำหรับสิ่งนี้ในกรณีนี้นี่คือสิ่งที่ต้องทำ:

    • เขียนabout:profilesในแถบที่อยู่ของ Firefox และเลือกการOpen Folderติดต่อของ "รูทไดเร็กทอรี" ของโปรไฟล์ผู้ใช้ที่คุณต้องการปรับแต่ง (โดยปกติจะมีเพียงอันเดียว);

    • โดยขณะนี้โฟลเดอร์รากรายละเอียดควรมีการเปิดสร้าง (ถ้ามันไม่ได้เป็นปัจจุบันยัง) โฟลเดอร์ใหม่ที่ชื่อว่าchrome;

    • สร้าง (หากยังไม่มีอยู่) ไฟล์ใหม่ที่มีชื่อuserContent.css อยู่ในchromeโฟลเดอร์และใส่รหัสต่อไปนี้ลงไป:

      @-moz-document url("about:newtab") {  
          body {
              background-color: #000000 !important;
          }
      }

    หากคุณสามารถเล่นปาหี่ด้วย CSS คุณอาจเพิ่มรหัสบางอย่างเพื่อตั้งค่าภาพพื้นหลังหากคุณต้องการ (ฉันแนะนำให้วางภาพในโฟลเดอร์เดียวกันด้วย CSS)

    คุณอาจต้องรีสตาร์ท Firefox เพื่อทำการปรับแต่ง

    เครดิตสำหรับจุดสุดท้ายนี้ไปที่DIENER_


3
สำหรับการทำสิ่งเดียวกันกับabout:blankหน้าFirefox คุณสามารถอ้างถึงคำถามและคำตอบอื่น ๆ นี้: superuser.com/questions/603218//
danicotra

3
คะแนนโบนัส (ถ้าทำได้) สำหรับวิธีการใช้งานร่วมกับ Firefox 57+
japzone

อัปเดตความคิดเห็น: ตรวจสอบให้แน่ใจว่าคุณไม่พลาดส่วนเสริม Firefox ที่ใหม่และยอดเยี่ยมนี้: Tabliss ใช้งานได้ดี! (สำหรับChromeเช่นกัน)
danicotra

อีกหนึ่ง WebExtension ที่ดีสำหรับ FF เพื่อให้บรรลุวัตถุประสงค์ที่นี่: New Tab Override
danicotra

1
ไม่ทำงานใน Firefox 67
Vladimir Jovanović

7

เปิดabout:configและเปลี่ยนค่าbrowser.display.background_colorเป็นสีที่คุณเลือก ฉันใช้ # 595959 (สีเทากลาง)

สิ่งนี้ใช้ได้กับแท็บเปล่าหรือ "Firefox Home"

น่าเสียดายที่การเปิดแท็บอย่างรวดเร็วหรือเมื่อเบราว์เซอร์ทำงานหนักจะยังคงเป็นผลจากแสงแฟลชสีขาว

หากคุณไม่รู้วิธีใช้ about: config โปรดอ่านhttps://support.mozilla.org/en-US/kb/about-config-editor-firefox


ไม่ทำงานใน Firefox 67
Vladimir Jovanović

สิ่งนี้ใช้ได้กับฉันใน Firefox 67.0.4 (64 บิต) บน Arch Linux อย่างไรก็ตามการแก้ปัญหาไม่เหมาะเนื่องจากแฟลชสีขาวดังอธิบายในคำตอบ
Casey Jones

1
ทำงานใน Firefox 71
Edwin

2

ฉันต้องบอกว่าวิธีแก้ปัญหาที่ @danicotra ใช้งานได้กับแท็บใหม่แม้กับ Firefox 57 อย่างไรก็ตามในระหว่างการโหลดหน้าเว็บแฟลชเปล่าจะยังคงทำให้สายตาคุณไหม้

นี่คือข้อเสนออื่น ๆ ของเนื้อหาสำหรับคุณ~/.mozilla/firefox/xxxxxxxx.default/chrome/userContent.cssซึ่งทำให้มืดลงอีกสองสามแห่ง แต่จะไม่สามารถแก้ปัญหาแฟลชเปล่าขณะโหลด

/* https://userstyles.org/styles/90565/firefox-adjust-white-flash-when-opening-new-tab */
/* https://userstyles.org/styles/142191/remove-new-tab-flash */
@-moz-document url-prefix(about:preferences), url-prefix(about:blank), url-prefix(about:newtab) {
  html, body, #newtab-customize-overlay {
    background: #303030 !important;
    color: #b2b2b2 !important;
  } 
}

@-moz-document url(chrome://browser/content/browser.xul)
{

  browser[type="content-primary"]
  {
    background: #303030 !important;
    color: #b2b2b2 !important;
  }
}

@-moz-document url(chrome://browser/content/browser.xul)
{

  browser[type="content-primary"], tabbrowser tabpanels, #appcontent > #content
  {
    background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed !important;
    color: #b2b2b2 !important;
  }
}

@-moz-document url(about:blank),
               url(about:preferences),
               url(about:config),
               url(about:newtab)
{
  #newtab-window,
  html,
  body, 
  #newtab-customize-overlay 
  {
    background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed;
    color: #b2b2b2 !important;
  }
}

html>body {
  background: #303030 !important;
  color: #b2b2b2 !important;
}

2
วิธีแก้ปัญหาที่ใช้งานได้เกือบสำหรับ flash เปล่าreddit.com/r/firefox/comments/6s2l0w/…แต่องค์ประกอบสีขาวบางอย่างอาจยังคงกะพริบขณะกำลังโหลดหน้า
Psychoslave

0

ตกลงขึ้นอยู่กับคำตอบจาก psychoslave และ danicotra ฉันหาวิธีแก้ปัญหาที่เหมาะกับฉัน (เป้าหมายของฉันคือการมีภาพพื้นหลังในหน้าแท็บใหม่ที่ฉันตั้งไว้about:blank) วิธีแก้ปัญหาของ Psychoslave เปลี่ยนไปโดยทั่วไปทุกหน้าของ Firefox ที่ฉันไม่ต้องการ แต่ด้วยจุดเริ่มต้นของรหัสของฉันฉันสามารถที่จะเข้าใจได้ว่ามีurl-prefixส่วนใดบ้างที่ทำให้เป็นไปได้ทั้งหมด

  1. สร้างchromeโฟลเดอร์ในรูทโปรไฟล์ของคุณ
  2. สร้างuserContent.cssและวางรหัสนี้:
/* https://userstyles.org/styles/90565/firefox-adjust-white-flash-when-opening-new-tab */
/* https://userstyles.org/styles/142191/remove-new-tab-flash */
@-moz-document url-prefix(about:blank), url-prefix(about:newtab) {
  html, body, #newtab-customize-overlay {
    background: url("konachan-steins-gate-s.jpg") no-repeat center center fixed !important; 
    background-size: cover !important;
  } 
}

(สำหรับสีพื้นหลังบนแท็บใหม่ให้ใช้browser.display.background_colorกับรหัสสีฐานสิบหกและคุณสามารถปล่อยสิ่งนี้ทั้งหมด)

  1. คัดลอกรูปภาพถัดจากuserContent.cssไฟล์ (FF ไม่ได้ใช้พา ธ สัมบูรณ์ที่อื่นสำหรับฉัน)
  2. ในabout:configตั้งtoolkit.legacyUserProfileCustomizations.stylesheetsเป็นtrueFF จริงๆอนุญาตให้ปรับแต่งนี้

ฉันยืนยันว่าใช้งานได้กับ Windows 10, Firefox 72.0.2

ใหญ่ขอบคุณที่จะร่วมสมทบอื่น ๆ ดังกล่าวข้างต้นและหัวข้อนี้เมื่อ Reddit


-1

ฉันชอบตัวเลือกของ psychoslave แต่ถ้าคุณไม่ต้องการเปลี่ยนพื้นหลังของ google หรือพื้นหลังของไซต์เหล่านั้นสิ่งที่ใช้พื้นหลังเริ่มต้นของเบราว์เซอร์เปลี่ยนสามบรรทัดสุดท้ายดังนี้:

#root{   background: #303030 !important;   color: #b2b2b2 !important; } 

และนี่คือรหัสเต็มคัดลอกมาจากคำตอบของ psychoslave

>     /* https://userstyles.org/styles/90565/firefox-adjust-white-flash-when-opening-new-tab
> */ /* https://userstyles.org/styles/142191/remove-new-tab-flash */ @-moz-document url-prefix(about:preferences), url-prefix(about:blank),
> url-prefix(about:newtab) {   html, body, #newtab-customize-overlay {
>     background: #303030 !important;
>     color: #b2b2b2 !important;   }  }
> 
> @-moz-document url(chrome://browser/content/browser.xul) {
> 
>   browser[type="content-primary"]   {
>     background: #303030 !important;
>     color: #b2b2b2 !important;   } }
> 
> @-moz-document url(chrome://browser/content/browser.xul) {
> 
>   browser[type="content-primary"], tabbrowser tabpanels, #appcontent >
> #content   {
>     background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed
> !important;
>     color: #b2b2b2 !important;   } }
> 
> @-moz-document url(about:blank),
>                url(about:preferences),
>                url(about:config),
>                url(about:newtab) {   #newtab-window,   html,   body,    #newtab-customize-overlay    {
>     background: #1B1B1B url("chrome://global/skin/media/imagedoc-darknoise.png") repeat fixed;
>     color: #b2b2b2 !important;   } }
> 
> #root {   background: #303030 !important;   color: #b2b2b2 !important; }
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.