Forum:Help needed for main page templates

Hello I am currently in the middle of updating the Selena Wiki. I was looking at other wikis such as this one for instance that has an attractive yellow-colored box. I copied and past all the information here on my parent wiki but as you can see there's a problem, its blank. How can I get what I see on the Jak & Daxter Wiki on the Selena Wiki? Best, Jona yo!  Selena 4Ever  20:42, August 28, 2012 (UTC)


 * It's not enough to copypaste the template. You also need the CSS. Look at the template's source code and you'll see all those CSS classes whose names start with "va-portal-". You need those as well. They're in w:c:jakanddaxter:MediaWiki:Common.css. --
 * So I would need to copypaste the following codes from the link you provided? Okay, but to where? Best, Jona yo!  Selena 4Ever  21:05, August 28, 2012 (UTC)

Take a look at the cheatsheet, please! --
 * Even though that page does not tell me step-by-step, I have copied the code into the highlighted one and saved it. I guess it will take some time before it will show on the main page. Best, Jona yo!  Selena 4Ever  21:23, August 28, 2012 (UTC)
 * It's not working =( Jona yo!  Selena 4Ever  22:15, August 28, 2012 (UTC)


 * Yes, it does:




 * MediaWiki:Wikia.css is fine, but I wouldn't have copypasted everything if I was you. You only need the stuff that starts with "va-portal-" and maybe not even all of that. The rest is just clutter.


 * You should in any case do a little fine tuning to the class "va-portal-section-body":


 * The yellow background color and the gray foreground color of your wiki have too little contrast. You might want to remove the background-color or set the foreground color to black. --
 * Done! But where would I need to post this on my wiki? Jona yo!  Selena 4Ever  22:35, August 28, 2012 (UTC)

Okay. Let's start over. You need the stuff that starts with "va-portal-". Forget what I said earlier about maybe not needing everthing. Let's just say - for the sake of simplicity - that you need all of this:

And you should edit "va-portal-section-body".

You could either remove the background-color:

Or add a foreground-color:

--


 * Alright done! So how long does it take? Best, Jona yo!  Selena 4Ever  22:49, August 28, 2012 (UTC)


 * Hard to tell. I would recommend purging the page and reloading it. That way you'll see the results right away. The easiest way is to install the PurgeButton gadget. Then pick "Refresh" from the "Edit" dropdown button and you should see the latest version in a matter of moments. --
 * Alright done! BTW can you stick around just in case it doesn't work? Jona yo!  Selena 4Ever  23:10, August 28, 2012 (UTC)


 * It's 1:00 am in my timezone. My next reply may take a while :) --
 * Ouch okay =) Best, Jona yo!  Selena 4Ever  00:18, August 29, 2012 (UTC)

This is still not working can anybody look into this and see why? Best, Jona yo!  Selena 4Ever  13:19, August 29, 2012 (UTC)


 * Be a little more specific please. The template as such looks fine. Do you have a problem using it? --
 * Yes the main page does not look like this. Best, Jona yo!  Selena 4Ever  13:50, August 29, 2012 (UTC)


 * No, it doesn't. Is it supposed to? Your wiki has a different color palette than w:c:jakanddaxter:. If you leave the template as is, it won't fit. You might want to get rid of all that yellow in the template. Or use this as an opportunity to rethink your wiki's palette. Either way: You will have to make some design choices. --
 * I'm wiling to do whatever it takes to get it looking like theirs. Jona yo!  Selena 4Ever  14:11, August 29, 2012 (UTC)
 * There are three things, I'd recommend then:
 * Learn the basics of CSS - if you haven't already done so.
 * Use Firefox with the Firebug extension. You will be able to click on any element on the page and choose "Inspect with Firebug" from the context menu. That'll show you all the CSS rules that are applied to that element and allow you to modify them without actually editing the page or the stylesheet. That's great for testing things out.
 * Get in contact with the maker(s) of the main page of w:c:jakanddaxter:. They'll know the ins and outs of their design better than anyone and might be able to help you with the details.

Never mind I will never learn how to do that. Do you know how to add another row here? I would like to add another box to the right so it won't be so empty. Best, Jona  talk 2 me  16:39, August 29, 2012 (UTC)
 * Check the page! I've added another panel at the bottom right. --
 * Thank you! But do you know how to move the main page? For an example, the main page seemed to have moved sightly to the right. Best, Jona  talk 2 me  16:50, August 29, 2012 (UTC)
 * The left column was set to 55% and the right to 45%. It said so in w:c:selenaquintanilla:Template:Main_Page_subpanel --
 * That page doesn't exist. Would you mind fixing it for me? Jona  talk 2 me  17:00, August 29, 2012 (UTC)
 * The page exists. I mistyped the link though. It's corrected now. --
 * I would have to rest them to 0%? Jona  talk 2 me  17:06, August 29, 2012 (UTC)

I've already set the width' to 50%. Leave them as they are. --
 * Ok, btw one more thing how can I shrink the size of this template to 55%? Jona  talk 2 me  17:25, August 29, 2012 (UTC)
 * Set the width to 55%. --
 * I'm sorry but that link you keep linking to me is too complex for me to understand. So where would I have to place the width in the template? Jona  talk 2 me  17:52, August 29, 2012 (UTC)
 * I'm sorry as well. If you don't want to learn anything and if I have to do absolutely everything for you, then this thread has come to an end. --
 * The link you provided does not help me at all, all I see is "try it yourself" umm what am I supposed to do there its a simple how to website for beginners its more of a complex how to website for advanced users. So I'm not sure how you expect me to learn from a level where I do not understand. Jona  talk 2 me  14:58, August 30, 2012 (UTC)

Actually I did start with the W3Schools tutorial and found it very useful at the time. But to each his own. There must be plenty of good CSS tutorials out there. If not millions. These are the first two hits I got when I googled for CSS for beginners: Both seem pretty good to me. --
 * 1) http://www.htmldog.com/guides/cssbeginner/
 * 2) http://www.codeproject.com/Articles/771/CSS-For-Beginners