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 (talkcontribs) 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 like
.page-Forum_Unique_Background_Specific_Page #content {
	background-image: url('http://whatever');
}
If 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 (#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 (talkcontribs) 09:29, 10 July 2017‎ (UTC). Please sign your posts with --~~~~!
  1. Monaco.css only applies to the Monaco skin.
  2. Monaco doesn't have an element with the ID content, so you'll have to pick a different element, maybe article. However, at the moment you're using page 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