LAST EDITED ON Apr-05-06 AT 00:08 AM (PST)
Unless you REALLY REALLY know what you're doing AND you have already driven plenty of traffic to your Fatbomb, I suggest you use one of the templates provided.IMO, the BIGGEST mistake you can make is to spend an entire day making a site with ZERO TRAFFIC "pretty".
Get some traffic, then worry about whether it is "pretty" or not...
If you are an extreme noob concerning html and css, you better skip skins with images at this point.
Upload the folder "styles" to the root/main folder of your website, making sure that the sub-folder "images" is inside.
Each example below is a basic layout, with each layout being able to be further modified using its associated CSS file.
Skin1 uses style1.css, etc.
You can use these CSS "style sheets" to completely change the color scheme of your site(s).
You don't have to know everything in the CSS file, as there's only about 12-15 things in each you need to worry about, which will descibe below.
I'm "color coordinating challenged", so I like to use this website to help me pick color schemes I can use with my CSS files:
http://wellstyled.com/tools/colorscheme2/index-en.html
Play around with this site and generate a color scheme you like, and well show you were to modify the CSS style sheets.
It is also suggested you download www.TextPad.com and use it, as it has a line number feature:
GoTo=> VIEW => Line Numbers
Using a text editor that let's you view line numbers will make it easier to get/give help customizing your templates.
Choose a Skin/Layout:
Skin1.html: (no images) two columsn w/Right menu
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin1&length=20&keywords=test
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin2: 1 graphic two columns w/Right menu
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin2&length=20&keywords=test
Skin2 uses the "panhead" graphics for the top border/background. You can choose from any of them, or create your own, then make sure you adjust the "panhead" number in style2.css for a variety of colors.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin3 No images two columns w/Right menu
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin3&length=20&keywords=test
Skin3 is a simple/clean skin and is a good one for noobs to start out with. You can mess with all the colors for a variety of looks.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin4 - Two columns, right menu no images.
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin4&length=20&keywords=test
This skin uses css "roll-overs" for links in the menu. Noobs should leave this skin for more experienced Bombers, unless you are satisfied with it "as is".
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin5- Two columns, right menu use "roll-over" images.
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin5&length=20&keywords=test
"roll-over" images
side-img.gif
linkimg1.gif
linkimg2.gif
Messing with the colors and roll-over graphics isn't for noobs...Unless you want to use it "as is"/straight out of the box.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin6 - A three column skin, with graphic at top.
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin6&length=20&keywords=test
Notes: Skin6 uses two graphics:
columns6b.jpg
header_background6d.gif
The easiest way to modify these two images is to open them up in your graphics program and just delete the image and make/paste a new one over it, maintaining the same size.
Once you have new graphics, you can open style6.css and adjust the color scheme to match your new graphics.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin7 no graphics - two columns - left menu
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin7&length=20&keywords=test
This is a pretty simple and flexible template and a good one for noobs to practice with.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin8 - No graphics - Two columns - Left Menu - CSS - roll-overs.
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin8&length=20&keywords=test
This is a colorful skin with roll-overs. Moderate skill level is needed, although noobs can change some of the basic colors/links, or use it straight out of the box.
The narrow left menu make make it tough to add advertising, so you may want to add any ads to the main/right column to preserve formatting.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin9 - No graphics - Right menu - Two column
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin9&length=20&keywords=test
This is VERY noobie friendly...Just change the color of the header in style9.css, as well as the color of the links.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Skin10 - No graphics - Right menu - Two column
http://dombom.com/cgi-bin/fbs/fatbomb/fatbomb.cgi/?skin=skin10&length=20&keywords=test
A clean and simple skin, that's very noobie friendly. Just change the color of the links and you're all set.
Customizing Your Skin:
After you've decided on a skin, open it on your hard drive in TextPad and:1. Find: <title> % form.keywords as html %] by MySite</title>
Change/edit/delete "by MYSite" to something appropriate. Note that the code will enter the keywords searched for each SERP.
2. Look for this block of code in the header of you page:
<style type="text/css" media="screen">
@import url( http://dombom.com/style/style1.css );
</style>
Change the url to point to your domain, as well as the corresponding CSS file. If you're using Skin4.html, then make sure this URL points to style4.css.
3. Look for the "Menu" tag:
<div id="menu">
Add whatever you want after the menu tag...Whatever you put here will show up either in the left or right mene. Note: some layouts have BOTH left and right menus, the idea is the same.
4. Check for misc. instances of "MySite" and modify/delete them, as you wish.
5. Upload the modified version to your /fatbomb/skins folder.
Note: Optional...If you're a noobie, you may want to rename it:
default.html
This will make things easier concerning some other config concerns.
Can someone help me with some code...I have installed a translator script and added the 1 line of code in skin 6 right below the form for the search box.
The read me file says to upload the translator folder into my root directory and add this line of code on the page I want the flags to show:
<?php include($_SERVER<'DOCUMENT_ROOT'>."/Translate/Languages.php"); ?>
The RM file also states that I might have to add 1 of these two lines in my .ataccess file:
AddType application/x-httpd-php .php .html .htm
AddHandler application/x-httpd-php .php .html .htm
This is part of the skin code .... I've bolded the code that I entered:
<form action="<% config.script_url as html %>/" method="POST">
<input name="skin" type="hidden" value="<% form.skin as html %>">
<input name="length" type="hidden" value="<% form.length as html %>">
Keywords:
<input name="keywords" type="text" value="<% form.keywords as html %>" size="35">
<input type="submit" value="Search">
</form>
<br>
<tr>
<td>
<?php include($_SERVER<'DOCUMENT_ROOT'>."/Translate/Languages.php");?>
</td>
</tr>
<br>
<% if search.results %>
<h4>Results <% sum(search.start, 1) %>-<% sum(search.start, len(search.results)) %> of <% search.total %>.</h4>
<ol start="<% sum(search.start, 1) %>">
<% for result in search.results %>
<li>
<a href="<% result.click %>"><B><% result.title %></B></a><br>
<% result.description %><br>
<em><% result.link %></em><br>
Sources:
Now I did try top add both lines of code to the .ataccess file at different times to see if it help to display the flags....but it didn't work.
Can a script like this be used in the skins? If so, what am I doing wrong?
Btw I doid get it to show on the index page, but that is an html home page. I'd like to get it to work on the serch query pages too.
The site I want to use it on is in my sig.
Mary