Comment on Tutorial: Skins

  1. samjohnsson Sun 30 Dec 2012 03:10PM UTC

    Purple clockwork gears

    Hi!

    You can indeed use background images hosted on another site, but there are some foibles to our CSS Sanitizer that I should point out.

    To put an image in a site skin behind all elements on a page:
    #outer {
    background: url(http://archiveofourown.org/images/skins/textures/tiles/brown-twill.jpg);
    }

    To put an image behind the text in a workskin:
    #workskin {
    background: url(http://archiveofourown.org/images/skins/textures/tiles/brown-twill.jpg);
    }

    Three things to note:

    • It's important to include the full address in the url, including the http://.
    • The link must end .jpg.png, or .gif.
    • The file name can't have any punctuation other than hyphens and the period before the file type. Spaces in the file name (even if the link has %20 for the space) will render the code invalid.

    If you have any questions, you can always send us a Support ticket!

    Best,
    Sam J.
    AO3 Support

    Comment Actions

    1. VirensSerpens Sun 30 Dec 2012 03:37PM UTC

      Cool though my question was if there was a way to upload the background image to this site. I already have it hosted on imageshack and using it right now. But to share a skin, I saw somewhere that images cannot be hosted externally.

      Comment Actions

      1. samjohnsson Sun 30 Dec 2012 03:45PM UTC

        Purple clockwork gears

        Hi again!

        Ah, apologies - what I get for replying Before Caffeine! Currently, no, we don't have on-archive image hosting, even for images used in skins. If your skin does get approved for use, one of the Front End team would contact you for a copy of the image.

        Best, Sam J.

        Comment Actions

        1. VirensSerpens Wed 16 Jan 2013 03:36AM UTC

          I can appreciate the lack of caffeine. Sorry for the late response, real Life caught up with me.

          Comment Actions