This Forum has been archived

Visit Discussions


I will admit, as i have admitted before, that i am terrible (horrid) at CSS and making templates. I was just wondering how you other people learned how to be so proficient at it. If you have any tips, hints or pointers, that would be great. Scimatt16 03:06, July 20, 2011 (UTC)

To be honest, I'm self-taught. Several years back, I wanted to get involved in wiki work for the MMORPG I was playing at the time, Everquest 2. The top project, EQ2i, was template heavy even then; in order to be an asset to that community, I had to not only become proficient in the use of rather complex templates, but how to modify them for different variables as well.
My advice is to look at some of the bigger projects out there, and just start examining what they use. Pull the code into your sandbox, and mess with it a bit. Experiment, take notes on anything you want to be sure to remember, and don't hesitate to ask questions. If a template element intrigues you, feel free to dig through its history to determine who added the code, find the user, and leave a message on his or her talk page. This is how most template and skin designers I've talked to have learned what they know. -- Heaven's Agent 03:57, July 20, 2011 (UTC)
I'm also self-taught - what I've picked up is from disconstructing and reconstructing existing templates. The lightside/darkside template that I've just created is based directly off the Dragon Age rivalry, freindship scale - although I used none of the same coding I just had a look at how they had it set up. Alexsau1991 (talk page) 20px 09:53, July 20, 2011 (UTC)
Thank you for the advice! I just have a couple of questions at this point in time, regardingthis template. I know that it is not a SWTOR template, but i could really use the help none the less. My First question is how do i make the text size for the headers the same size (preferably the bio info). My second questions is how do i get the physical appearance and other info headers to be the same length as the bio info one. Finally, how do i change the colour in the headers? Thank you for your help Scimatt16 16:30, July 20, 2011 (UTC)
The trouble you're experiencing with the text size might be a result of utilizing percentage values in the font-size style parameter. When you utilize a percentage in embedded tables such as this infobox, the style references the most recent font size, rather than the default for the wiki project. This can generally be avoided by utilizing specific values instead of percentages; wiki code recognizes both pixel and point sizes, and they can be utilized in the format {{font size}}px and {{font-size}}pt respectively.
The reason you're seeing different row width for the Physical Appearence and Other Info headers is that the table the table they are embedded in has two columns, while their table is only in a single column; a second column exists to the right with nothing inside it, thereby creating the excess space. It's kind of hard to explain with words, but you'll need to insert colspan="2" in the line prior to the table's start. It'll probably just be easier to demonstrate, and let you look at the differences in the history for this one, which you can see here. I hope that helps. -- Heaven's Agent 04:08, July 21, 2011 (UTC)
Thanks for your help so far Heaven. I was wondering what in the template was causing the other info header on this page to become a third column. Thanks Scimatt16 21:09, July 21, 2011 (UTC)
You're missing a line break ( |- ) before the cell containing the "Other Information" header; one should be placed just after the closing parenthesis of the #if statement for the "ecolor" parameter. As a result, the header is being tacked onto the end of the same row as the previous parameter, rather than being created in a new row entirely:
{{ #if:{{{ecolor|}}} |
{{!}} valign="top" {{!}} '''Eye Color'''
{{!}} valign="top" {{!}} {{{ecolor|}}}
! class="infoboxsubheading" colspan="2" width:300px style="background: #{{#if:F14800|F14800|000000}}" {{!}} '''Other  Information'''
Alternatively, the line break can be placed within the #if statement, so that if the parameter is not defined, excess breaks won't be present within the infobox. -- Heaven's Agent 21:38, July 21, 2011 (UTC)
Thank you soooo much Heaven for the help (praises the ground Heaven stands on). I finally got it to work! I might finally be learning how to do this! Scimatt16 22:16, July 21, 2011 (UTC)
Community content is available under CC-BY-SA unless otherwise noted.