Support Does anyone know

. . . of a way to use Google Chromes custom CSS for individual sites? For instance, if multiple sites have the same css class, for this example we'll say html, and I'd like to change something solely for that site, like the background, it would then change that for every site that has the same class.

Is there perhaps a way to attach a custom css file to a specific site? Like telling Chrome, "Okay, every time this page loads use this css instead, but only for this page."

It's kind of bugging me.

 

I use Stylish on Firefox, which has a Chrome equivalent. It's really designed for smaller tweaks so if you're re-writing entire stylesheets you might need something a little more powerful (or not, thinking about it, it could work), but you can set it to target only one specific site.

For example, if I wanted to change the default font on KHV (which I do because I have an unhealthy love for the Ubuntu font):

Code:

@-moz-document domain("kh-vids.net") {
    body { font-family: "Ubuntu" !important; }
}

That uses the Firefox code, though, since I use Firefox. Taking a look at the Chrome equivalent, it actually has a UI option to target only specific sites...

​

If you're doing this for a lot of sites it can get messy, but this is what I use. I mostly only do little tweaks, though. Side note that you should always remember to use the !important rule when overriding styling on the page.

 

I've always been curious: what exactly does this do? We have it in some of our additional.css codes, but I've never known what it does.

I mean, I know it overrides from your sentence there, but if you don't have !important, what happens?

 

This is more of a CSS discussion but forum systems like Xenforo or vB will often have main stylesheets that control much of the CSS for the site. Let's say this code is in one of those stylesheets:

Code:

h3 { color: white; }

However, they'll usually provide you with a stylesheet to add all of your changes. This prevents you from editing the base stylesheets, which is really helpful when doing upgrades or edits. In vB (last I used it) it was additional.css and in Xenforo, extra.css. Let's say you added this to extra.css:

Code:

h3 { color: blue; }

You now have two h3 color codes that are conflicting. In order to give one priority, you can use the !important declaration.

Code:

h3 { color: blue !important; }

That ensures that your h3 blue code will override the white. If you didn't have it, the two codes would conflict, and the white code would take precedence, usually.

Because Nights would be re-writing a lot of the website's declarations, he needs to use the !important declaration in most cases to make sure his code works.

 

I tried it, but instead of using the specify domain for mozilla, I used Chromes 'webkit'. It threw out all the personalized code (or it just wasn't parsing it right). Rather, when I put the code into Stylish without the domain specification, it shows up for all Xenforo sites, and any site using that specific classification (like 'html' for example). It's a lot easier to access than Custom CSS, and I like that. I also like the ability to create multiple stylesheets instead of just the one. However, it still doesn't solve the problem of locking the custom code to one specific site. I'll check and see if there is a code for domain specification for Chrome using 'webkit'.

Thanks for the help though ^^ and my new favorite extension.

 

Did you try using the 'Applies to' box? I just wrote the following (in Chrome) for KHV as a test:

Code:

#logo { background-image: none !important; background-color: red !important; }

Set it as:

Code:

Applies to | URLs on the domain | kh-vids.net

And it didn't effect any other XF site I visit. I'm not sure what webkit code(s) you're using, if you share them I can help a bit more (if you want, feel free to send them to me privately if you don't want to share them with the whole planet).

 

Ah, that worked ^^ Thank you so much Misty. I didn't even notice that feature. That's exactly what I wanted. As for the webkit, I was simply trying to replace (wasn't hoping for much) moz with webkit in the domain specification code you showed me. This is fine though, it works like a charm ^^

Thanks for all the help ^^