A ribbon for anything you like for every website

Hi all,

Here’s a little something I’ve been working on. My problem was I wanted the ability to have one of those banners in the corner of my site, and be able to link to whatever made sense. I’d only seen those GitHub ones, but I wanted something generic.

By including a div, an a tag, and a script, it adds all the styles needed and bam, a nice link in the corner. Take a look at my CSS Minifier site linking to GitLab, but best of all, the banner in the corner of the Glitch app links to the “Remix” page using some of the nice blues/purples/pinks from your fish! (Feel free to suggest better shades though!)

I’d love some suggestions on what attributes I should add that could be customised on each site and I hope it is useful for someone.

5 Likes

This is pretty cool! Nice work :sparkles:

1 Like

Great work, Andy! That’s a great way to get people remixing.

1 Like

Nice work!

I’d just like to point out that it extends out of the horizontal window, adding scroll to pages that wouldn’t otherwise have sideways scrolling. Not a major problem, and easily fixable with a bit of CSS, but I’m not sure that that should be the default behaviour.

Also, it should be fixed horizontally (if that’s possible) for sites that are horizontally based, so that it doesn’t end up sitting oddly in the middle of the page as people scroll. There should be at least be options to fix it horizontally or vertically (although, I assume data-position="sticky" would already fix it vertically).

Sorry for any assumptions I may have made there, haven’t tested it much, just had a look at the links you provided.

(P.S. the banner @ https://cssminifier.com/ prevents the JPG Optimiser button being clicked.)

Apart from that, it’s awesome.