Optimal Pic Size for Wiki Page Backgrounds?

jpdact

Hi all! This is my first post here and I'm excited to finally access this part of our gaming community. On to business...

I am an HTML noob - like ZERO experience. What little I've managed to accomplish was due in no small part to the FAQ's and this fine forum. I've got most of the content I want in my wiki but now I'm trying to snazz it up a bit like add a background behind the pages similar to what's found in "this month's featured campaign":http://www.obsidianportal.com/campaigns/cthulhusupremusest. In my case it will look like parchment paper. I've been able to get a picture to display using _div_ tags but it's only displaying as one small, fixed pic. I've also managed to make it not repeat but the size is still a challenge. Can any of you experienced developer-types offer some friendly advice?

Thanks in advance for your help and feel free to check out my 80% completed campaign "Majeria":http://www.obsidianportal.com/campaigns/majeria!

Best,
Jonathan

gaaran

Hey JP, welcome to the forums! If you're looking to put in backgrounds, you can check out my "campaign":http://www.obsidianportal.com/campaigns/melekar and view my source code if you like to show you the tags. I've found that 730px is an optimal width to leave a small border on either side of the background. depending on what you're going for, you'll either want to create a 730px wide, tileable background, or use the div style tags "background-repeat:no-repeat" to make it either whatever length you want, or a fixed size. If you need to edit images, GIMP is a pretty great free photoshop clone, that's not too hard to use (imo). Hope that helps, and if you have more questions please ask, everyone here will be happy to help out.

arsheesh

Welcome jpdact. Well Gaaran about covered it. A couple of things I would add just by way of a clarification is that what you see on Franksirmarco's campaign (the featured campaign) is a single background image, another image used as a header, and then text which has been formatted to allow for margins. The code for adding a background image looks something like this:




The code for providing margins for the text that will sit above the background image looks something like this:


Insert your text here


Once you've finished writing text content make sure you close the initial textile and background div tags like so:




To be able to accomplish what Gaaran has done with old paper, or what I have done "here":http://www.obsidianportal.com/campaign/age-of-legends/wikis/campaign-setting with roughed up parchment, you will need to create multiple images: a top, a middle and a bottom. You will also need make the middle image into a tileable image, and then fade the edges of the top and bottom images where they will join the center image. For something like this you will definitely need to have access to a graphics program such as Photoshop or GIMP (which you can download for free "here":http://www.gimp.org/), and the HTML formatting is more complex as well, but you can figure out the basic template by checking out the code that Chainsaw has offered for "Large Parchment":http://www.obsidianportal.com/campaign/sanction/wikis/templates-and-tools. On the other hand, if you really like the parchment template that he has already provided you may want to just to save yourself some time and go with that. Anyway, you can always ask Gaaran or myself if you need any more help with the specifics.

Cheers,
-Arsheesh

jpdact

Hi Gaaran,

Thank you very much for the quick reply. Needless to say your wiki is unreal and the campaign looks awesome! I greatly appreciate the advice; I've gone ahead and resized the pic to 730 and we'll see if that works. Forgive me, but i wanted to clarify one comment you made. I've already used the

jpdact

Hi arsheesh,

Wow, you guys are FAST! I posted my last comment just as you were posting yours. i think that will answer all the questions I have. I can't thank you both enough - I really appreciate it!

Many Thanks,

Jonathan, DM of "Majeria":http://www.obsidianportal.com/campaigns/majeria