Forum:Unique Background Specific Page
ShoutWiki — express yourself and be heard!
Jump to navigation
Jump to search
Forums: Index → Community help
Looking to find a way to give specific pages a unique background image that's different than the wiki's default background image. Preferably by just dropping in a Template to the page(s) in question.
—The preceding unsigned comment was added by HAEwiki (talk • contribs) 07:20, 9 July 2017 (UTC). Please sign your posts with --~~~~
!
- CSS rather than templates would be the way to do it. Each page body has a class named after the page. For example, this page body has a class
page-Forum_Unique_Background_Specific_Page
. Spaces, slashes, colons, and any other characters that cannot be in a class name are changed to underscore. That means you could potentially have more than one page body with the same class name. You probably don't want to apply the background to the entire page body, but rather only the content (i.e., not sidebars, etc.). So for this page, that would be something likeIf you insist that it has to be a template, then you'd have to run some JavaScript site-wide to detect the template on any page, then alter the DOM (.page-Forum_Unique_Background_Specific_Page #content { background-image: url('http://whatever'); }
#content
) on-the-fly with a background image. In either case, you might need to check (which I haven't) that#content
exists in all skins. Some classes and IDs can be different in different skins. --Saftzie (talk) 19:22, 9 July 2017 (UTC) - Also, allowing anyone to specify something that alters the CSS of a page, potentially like your template idea, forces a pretty big security vulnerability on your users. You'd need to make sure your JavaScript is really well written and accepts images only from trusted servers. --Saftzie (talk) 19:36, 9 July 2017 (UTC)
- ((Not quite sure how to reply using this format)) I'll try the former idea out first since it definitely sounds like I'd be best not using templates.
- trying
- .page-Imperial_Union_of_Planets #content {
- background: url('http://images.shoutwiki.com/tal-diann/9/91/IUOPflagBANNER.jpg') 0px 0px no-repeat;
- background-attachment: fixed;
- background-Size: 100% 200%;
- color: white;
- background-color: black;
- background-position:center;
- }
- for this page: s:w:tal-diann:Imperial Union of Planets
- and clearly I'm doing something wrong as it is not showing. I'm not all that sure what I'm looking for to find the page specific code.
- —The preceding unsigned comment was added by HAEwiki (talk • contribs) 09:29, 10 July 2017 (UTC). Please sign your posts with
--~~~~
!
- Monaco.css only applies to the Monaco skin.
- Monaco doesn't have an element with the ID
content
, so you'll have to pick a different element, maybearticle
. However, at the moment you're usingpage
for the "default" background, so that's the one you should probably use for consistency.
- --Saftzie (talk) 16:10, 10 July 2017 (UTC)
Article seems to-do what I was looking for, I'll experiment from there. Thank you. :D