You can Customize your Game Page Description area and posts with some HTML and CSS knowledge. If you want to include background graphics along with buttons and thumnbnails, you will need a hosting server to upload your image files to and reference them in your HTML & CSS.
note - white space between tags can create a lot of mis-alignment, make sure to delete the white space after copying into Moddb HTML editor.
- Some tags will be stripped away when saving your profile description.
- Try to stay away from paragraph, script, style, head, body, etc.
- The main tags we will be using are: div, span, img, a, h
- Using tags and CSS Styles will allow you to over-ride Moddb.com standard settings & styles.
- start with a DIV as your container for content (images, text, links, etc.)
- use CSS Styles to decorate DIV's with backgrounds and borders
- all DIV's need to be on one line to elminiate the gap between background images.
DIV Background Image:
- add your custom images to any DIV with CSS styles
- Description area: 940 pixels wide
- All other areas:620 pixels wide
<div style="background-image: url(http://www.yourwebsite.com/dir/dir/image.jpg); width: 525px; padding: 5px; background-repeat: repeat-y; border: 0px;">text here</div>
- span ignores CSS styles and allows you to customize your text
<span style="CSS HERE">text here</span>
- default headers by Moddb.com
- customize the headers with style tag
h1, h2, h3, h4, etc.
<h1 style="CSS here">text here</h1>
- use images for links or thumbnails
- decorate with CSS background and border, width, height, margin, padding
<img src="http://www.yourwebsite.com/dir/image.jpg" alt="" width="209" height="184" />
INLINE CSS STYLES:
- is the area where all the CSS can go for any object
- will over-ride the default HTML and CSS settings
Huge source of CSS information:
Some Helpful CSS styles
Div background image
CSS Font Styles
border:1px solid #FFF;
border-top:1px solid #FFF;
border-bottom:1px solid #FFF;
begin with clicking the html button at the end of the description tools
This is your HTML source editor. Its basic, but gets the job done.
enter your div code and style. Include the span code before you close the div
Here is the span code, notice the /div code that closes the container?
Then create your next div that will stack below the first one
you can copy and paste the same code for the background CSS,
but this tilable image needs to have repeat-y to tile properly
this is the span code for your main content text
I used Notepad or Word pad to formate my code so it is easier to read.
don't forget the Moddb HTML source editor will strip out code and white
space will act like returns.
When you are ready, click the Preview button to see your results.
The editor will not display all the formatting correctly. The Preview will
show you the final formatting.
Most of your alignment and formatting will probably look screwed up, so make sure to check your image widths and div widths, also check for white-space. I would copy all the code from the HTML Source Editor on a regular basis and copy it to notepad or Word pad because the page won't save a "rough draft" copy, there is only a final SAVE.