Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

搜索 | 用户支持

防范以用户支持为名的诈骗。我们绝对不会要求您拨打电话或发送短信,及提供任何个人信息。请使用“举报滥用”选项报告涉及违规的行为。

Learn More

Can I use BOTH a default pattern and custom image background in Firefox Color (custom theme creator)?

  • 3 个回答
  • 0 人有此问题
  • 1 次查看
  • 最后回复者为 Austin

more options

Is there a way to enable using both a default pattern as well as a custom image for the background on Firefox Color? I really want to enable both but it is making me choose one or the other. Please help me do this or enable the ability to do so.

Is there a way to enable using both a default pattern as well as a custom image for the background on Firefox Color? I really want to enable both but it is making me choose one or the other. Please help me do this or enable the ability to do so.

被采纳的解决方案

You can add a custom background image beneath the Firefox Color pattern with the following userChrome.css (wallpaper.jpg located in the same folder):

#navigator-toolbox::before {
  background: url("wallpaper.jpg") !important;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  content: "";
}
html[sizemode="normal"] #navigator-toolbox::before {
  border-radius: 10px;
}
#navigator-toolbox {
  background-color: unset !important;
}
定位到答案原位置 👍 0

所有回复 (3)

more options

选择的解决方案

You can add a custom background image beneath the Firefox Color pattern with the following userChrome.css (wallpaper.jpg located in the same folder):

#navigator-toolbox::before {
  background: url("wallpaper.jpg") !important;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: -1;
  content: "";
}
html[sizemode="normal"] #navigator-toolbox::before {
  border-radius: 10px;
}
#navigator-toolbox {
  background-color: unset !important;
}
more options

Could you explain how to get to the userchrome.css file and also how would I align the custom image toward the top of the image and fixed to the right corner like I can in Firefox Color?

more options

Nevermind, thank you so much. I got it fully working perfectly with your code and a little tweaking help with ChatGPT. Here is the exact code that worked for me to place an image in the top right corner with no repeat and have a fully functioning toolbar:

#navigator-toolbox::before {
  background: url("wallpaper.jpg") no-repeat top right fixed !important;
  width: 300px !important; /* Set the width to 100 pixels */
  height: 95px !important; /* Set the height to 100 pixels */
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 0 !important;
  content: "";
}

#navigator-toolbox {
  background-color: #943022 !important;
  z-index: 10 !important;

}

NOTE: the 1's in front of the navigator-toolbox are actually hashtags # Thanks so much man much appreciated.

由cor-el于修改