Custom Alignment and Backgrounds Through Greasemonkey

Question

I'm trying to implement something in greasemonkey and it is giving me a fair bit of trouble as I can't get it to work.

I frequently use Wolfram Alpha (http://wolframalpha.com) for a lot of things. They have recently updated the home page with a new style. There are settings that you can edit on this page (http://www.wolframalpha.com/homesettings.html)

As you would expect when you clear cookies you loose these settings. What I would like to do is have a greasemonky script that sets the background to what ever I like (which will stay also regardless of the state of your cookies).

It would also be cool if this background was displayed the whole way through Wolfram Alpha (ie when you make queries too eg. http://www.wolframalpha.com/input/?i=stack+overflow )

The other thing I'm trying to implement but I'm struggling is to force the results pages to be left aligned so that the browser window can be smaller.

If anyone could help me with this it would be appreciated, I have tried to do it my self but I'm unsure how to get it to work.

Answer 1

If you just want to change the appearance of the site, then you are better off using Stylish (https://addons.mozilla.org/en-US/firefox/addon/2108/).

Then you just create simple style rules using ordinary CSS. For example, install stylish, then "write a new style" (right-click on the stylish icon, in the lower -right).

Paste in this code:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("wolframalpha.com")
{
    body, #home-background
    {
        background-image:   url(http://www.voyageurquest.com/blog/uploaded_images/dogs-712780.jpg) !important;
    }

    #content
    {
        left:               0 !important;
        margin:             0 1em !important;
    }

    #resources 
    {
        visibility:         hidden;
    }

    #nav 
    {
        margin:             0 auto !important;
        padding-left:       0 !important;
    }
}

.
Voilà, the background is more-or-less permanently changed, and the search results are more left-aligned.

Note that this is one good use for the !important flag.

There are also a mess of stylish scripts for many sites at: userstyles.org (Sorry, I'm only allowed 1 hyperlink.)