Wednesday, 16 October 2013

Add custom background to firefox New Tab


Download this tutorial in pdf formatIf you are a Mozilla Firefox user then you might be aware of New Tab page in Firefox which shows your recently visited web pages as 3x3 grid of tiles. But the Backgroud of this page is White. You can change the background of New Tab Page to whatever image you want. You can also change the Background of Firefox Homepage (about:home).
Here is the Screen shot of New Tab Page after applying Custom Background to New Tab Page:

Getting Started

To Add custom Background to Firefox New Tab and Homepage we will require a firefox addon called Stylish.

Okay, Now that you've downloaded Stylish, let's add custom background to firefox New Tab page

Step 1

Open firefox and go to tools--> Add-Ons tab (or Press Ctrl+Shift+A).

Step 2

Now you can see in the left pane, "User Styles", Click on "User Styles" tab.

Step 3

In the Right pane there is a button "Write New Style", click on it. Name it whatever you want and in the code window paste the following codes:
/*wallpaper for the about:newtab*/@-moz-document url("about:newtab"){#newtab-scrollbox{background:url("file:///c:/panda.jpg") no-repeat !important; background-size:100% !important;} }

Replace "file:///c:/panda.jpg" with the location of the image you want to use.
Save it! Done!

You can also change the HomePage (about:home) background too. To change Home Page background add the following codes:
/*wallpaper for the about:newtab and about:home*/@-moz-document url("about:newtab"), url("about:home") {/*for the new tab page*/#newtab-scrollbox {background : url("file:///c:/panda.jpg") no-repeat !important; background-size : 100% !important; } /*for homepage*/body{background: url("file:///c:/panda.jpg") no-repeat !important; background-size :100% !important;} #launcher {background-color : rgba(0,0,0,0.8) !important;}}

Home Page screen shot:

Now Save it! Done!

Check this out: tutorials


Post a Comment


Twitter Delicious Facebook Digg Stumbleupon Favorites More