Fixing GAGs New Style: Changing Colors and Fonts via Browser Plugin

I like the more modern look of the new GAG style, but I don't agree with everything they changed. While I have no problem with the purple colour, I don't think it fits well with the other ones. Some fonts are just way too big and it looks like they forgot change a couple of things. So I adjusted it a bit to my liking.

Fixing GAGs new style: Changing colours and fonts via browser plugin.

Cascading Style Sheets (CSS) are used to add style to websites. You don't need to know how they work, it's enough to know that we can use them to change the look and feel of GAG. To edit these CSS files, we need a browser plugin called "Stylish". You can find it here:

Chrome: https://chrome.google.com/webstore/detail/stylish/fjnbnpbmkenffdnngjfgmeleoegfcffe?hl=en

Firefox: https://addons.mozilla.org/en-US/firefox/addon/stylish/

If you use another browser then you have to check yourself if the plugin exists or if there are any alternatives. This does NOT work on your mobile devices.

So, once you have installed the plugin you will find a new icon in your top right bar.

Click on it and choose "Manage styles". Chrome users choose on the left side "Write new style", Firefox users will find it on the bottom. You can find my modified style which we will use here:

Chrome: http://pastebin.com/qfHTSFEu

Firefox: http://pastebin.com/pLJEM31x

So, what does it change?

- Navigation bar colour

- Navigation bar menu colour

- Navigation bar mouseover colour

- Footer colour

- New posts button font

- Feed question title font size

- Question post font size

- Sidebar polls font size

- Recommended questions font size

- Alerts colors

- iBar font

- Invite box size

Even if you have no clue how CSS works, just looking at the code should make it pretty obvious on what we do. You choose a certain part of the website and tell it what to do. In our case it's almost only colours and font size. So if you don't like my colour choice, then you can just go to the specific part in the code and replace it with your own. If you wanna add other parts of the website, you have to find out the html class name or ID with your browser developer tools. But I won't go into detail on that now.

So, all you have to do is copying the style and pasting it in stylish. Give the style a name, save and you're done. If you use Chrome then you also have to specify the domain of the website. On the bottom, choose "URLs on the domain" and enter "www.girlsaskguys.com". Once saved, you can open GAG and if the style is active then you see that the Stylish plugin icon is coloured. Without active style, it's just grey.

That's it, GAG should now look like on my first screenshot. Depending on your screen resolution, you might wanna change the size of the invite box. To do this, change "max-height: 500px;" at the beginning of the stylesheet (row 3 or 4 depending on your browser). 500px should be good for FullHD, if you have a 1440p screen you might wanna increase it to 800. If you have problems or want something else changed, just ask in the comments.

(Please note that this might not work anymore should GAG make changes on the website or it overwrites them so you won't see it.)


9|3
18|5

Join the discussion

0/2500

Submit

What Girls Said 18

  • 25d

    I used to do that but stopped when I realize that I'll have to make changes to my CSS whenever they update it on their end. I once made my homepage look like this

    https://i.imgur.com/tP5NrZi.png

    https://i.imgur.com/DVCukE8.png

    0|1
    0|0
    • 25d

      That's why I don't go overboard with it and just fixed the little things that bothered me and some others. Not doing a complete restyle

      Yours definitely doesn't hit my taste haha

    • Show All
    • 24d

      Yeah there are a few things I don't like but I think they'll figure it out eventually

    • 24d

      Yeah... they could start with my changes lmao.

      I'm surprised they actually featured this myTake

  • 25d

    I'm wayyyy too lazy to do any of this

    0|1
    0|0
  • 25d

    I GaG from my phone. Sooo this doesn't help me.

    0|2
    0|0
  • 25d

    Very detailed and cool! I'll have to look into all of this since I don't know much about computers, but awesome that you wrote this.

    0|1
    0|0
  • 25d

    I love ALLLL OF THIS. Finally, GOOOOD Changes Here, dear.
    Too Long for me to Read, @Yumix, No Time right now, but I can See at Least you put a Lot of Love into it. xx

    0|1
    0|0
  • 25d

    nice

    0|1
    0|0
  • 25d

    Pretty cool, dude :)

    0|1
    0|0
  • 4d

    informative

    0|1
    0|0
  • 25d

    Interesting, it just doesn't mean much to me because I only use gag on my phone.

    0|1
    0|0
    • 25d

      But on the phone they didn't change much other than the navigation bar colour? and with the minimalistic mobile design I think it's less of aproblem

  • 25d

    cool. you always have good fixes :)

    0|1
    0|0
  • 25d

    Cool <3

    0|1
    0|0
  • 25d

    *distant cries from phone users*

    Send help

    0|1
    0|0
  • 25d

    I am seeing computer programming thingy and my mind just went off
    I am supposed to do it by myself now? XD
    I absolutely hate those stuff man

    0|2
    0|0
    • 25d

      lol no... you should click on install, copy paste my code, save and be happy. or let me do it for you haha

    • Show All
    • 25d

      no need to change anything if it doesn't bother you

    • 25d

      it does :/

  • 25d

    lol omg you have too much time on your hands young man, when i logged on i just went ooo theyve changed it and to me being sooo much older with probably worse eyesight i was actually grateful for the impression of brightness!! haha maybe they are trying to attract us older ones on here hence making seeing things more clearly a bit easier? and you may well laugh now my friend but your time will come... xxxxx

    0|1
    0|0
    • 25d

      haha it's not much work so didn't take much time... :P

      hmm have you ever tried some glasses? lol

    • Show All
    • 25d

      hmm... should eye notice a loss in eye sight I'll go laser them as long as it's not too bad... so I don't have to deal with that bs :P

    • 25d

      i was going to laser mine until my sister had it done and apparently the smell of your own burning eye ball is more than you can take but you have to wait it out and then go through having the other one done aswell hahaha

  • 25d

    Well done! 👏👏👏

    0|1
    0|0
  • 25d
    0|3
    0|0
  • 25d

    I have no idea how to use that but respect bcs you have a real brain for computers

    0|1
    0|0
    • 25d

      it's really just opening 2 links, clicking once install, copy paste the text, save and done lol

  • 25d

    Woooow. Respect.

    0|1
    0|0

What Guys Said 5

  • 25d

    Nice work. I study HTML5. It's a lot of fun experimenting with some simple codes to make websites look totally different. Keep it up. Programming and other computer-related professions are most desired. High salaries.

    0|1
    0|0
  • 25d

    DUDE. YOU...

    Dude, I owe you a beer, NAY two!

    0|1
    0|0
  • 24d

    Thanks - I must do a bit tweaking

    0|1
    0|0
  • 25d

    I hate this pinterest look. It's not "modern" it just looks like pinterest came over and had sex with the website.

    0|1
    0|0
  • 25d

    You could just create your own theme for people to download instead of having them paste your code in.

    0|0
    0|0
    • 25d

      I don't know, the only export function in the settings was for the code. didn't look any further.
      It's just a few clicks and really simple, shouldn't be much of a problem for those who wanna change it

    • Show All
    • 25d

      meh they removed the update function on myTakes, so can't really put it in anymore... if someone has problems doing that extra step then I'll make it

    • 25d

      but I expect GAG to change things soon anyway

Loading...