The Skins template for 68 Classifieds is a unique template that offers the end users the ability to choose from different "Skin" colors in the Member Navigation Menu. This allows you, the site owner/administrator the flexibility of offering your end users personal preference in viewing your classifieds web site.
The "Skins" are actually separate CSS stylesheets that are loaded immediately and overide the default stylesheet when a user chooses a skin. Although the appearance is now different to the end user, the "Template" is still the same. This makes it much easier to maintain your template should you choose to modify any of your template files within the "Skins" template folder.
The "Skins" Template also comes with a skins template stylesheet, "_skins_tpl.css" allowing you to create as many additional skins as you would like to offer to your end users.
When you purchase your Skins template, you will download a "zipped" file which you will need to extract or uncompress. After this you should have the following:
Skins (Folder)Upload the "skins" folder (listed in red above, located in the upload folder in it's entirety to your templates folder on your classifieds site server. Normally you would do this using an ftp client application.
yourclassifiedssite/templates/ <-- upload to here
(In a standard 68 Classifieds installation, you should already have four other template folders listed here: default, 3col, purple and deepsea)
*Important Note:Always keep your "default" template folder in your templates folder. As with any non-default template folder, there are files within the default folder that are required for your selected template folder to work. (e.g. any template files that are not included in the Skins template are displayed from the default template.
If you would like to modify any template files in the default template folder, ALWAYS make a copy of it and save it to your selected template folder (skins in this case) and modify your copy of that template file.
Once your skins template is installed and selected, there is nothing else required for your end users. The Blue skin is selected by default. An end user may select any of the available Skins from the pulldown menu that is now in your "Member Navigation" Menu on the right hand side of every page. Once the end user makes a selection, the page will automagically switch to that skin color without the need for a page refresh. In addition, a cookie for your domain is set, so that any page that your visitor views will continue to use their skin clolor selection. This selection will stay in use even on subsequent visits.
The logo settings for your site utilizes the methods that 68 Classifieds already uses. This can be an image or text and slogan. We have enhanced the default method in a few ways, however. For instance, if you upload an image as your logo, it should automatically accomodate your logo image size in most cases. In addition, we also make your logo image a clickable image that will take you to the home page of your site, unlike what the default template does.
In addition, if you choose to use Text as your logo, you can control both the logo text as well as your slogan text colors individually through your skins stylesheets.
We know that as a website owner that you want to display YOUR copyright and not the hard coded copyright as shown in the default template as 68 Classifieds. We've automated this, so that you simply don't have to worry about it. Once you've set your main settings in the administration and your logo, you're already taken care of. We even make sure that the correct date changes when the year does.
How this works is this. If you use a logo image, then your copyright is set to the Main Settings/Site Title field. If you use Text as your logo, then your copyright is set to the "Logo Title" from your Template Settings/Logo Settings.
We believe that due to the nature of the Skins template, that you are going to want to make your own skins. So of course, we got you covered there too!
You do not need to be a programmer, web designer, web developer or a CSS guru in order to create new skins. Having a good sense of color... well that helps! What you do need to know and understand is how colors work in web browsers. We won't get into all of it here, but if you're interested in more specific information, then try this website. It doesn't matter which color system you want to use for your skin, but whichever system you use, just make sure that you paste in or write in the colors following the proper syntax.
There are two steps needed to offer a new skin color to your end users.
Step 1: Create a new skin
In the root of your skins template folder, there is a file called, "_skins_tpl.css" that is a skins template supplied by us for you. Make a COPY of this file and save it to your skins folder within your skins (template folder). Rename the file to what you want to call your skin plus the suffix ".css" (e.g. myskin.css).
Although the file may look a little overwhelming at first, please take the time to read the comments. You are not required to fill in every single element option. If it isn't needed, it will tell you so in those comments. Of course, just about everything already has a default built in from the main.css stylesheet. We also include some advice and tips within our comments.
ONLY DO THIS - paste or write in your color choice for any option just before the semi-colon (";") for that line
(example: background-color: #FF0000; or background-color: red;)
DO NOT DO THIS - edit, modify the CSS elements or any text other then what was mentioned above. Unless you have a full understanding of CSS including how stylesheets actually cascade, complete element sytax, etc.. For the record WE DO NOT SUPPORT ANY MODIFICATIONS TO THE STYLESHEETS OTHER THAN COLOR IN A SKIN.CSS FILE.
For those that may want some reference or help with their color choices, here are some sites that we like and use:
Step 2: Add it to the menu
Many of you may want to add it to the menu while you are still working on your new skin. Why? Because if you add it to your menu, you can then select it. As you make changes to your new skin, you can refresh your web page to see your most recent changes. Of course the downside to this is that if your site is live, then your unfinished skin will be available to your end users.
To add your ne skin to your menu, you will need to open up the main Skins template file. This is called "layout.tpl" and is located in the root of the Skins template folder here:
yoursite.com/templates/skins/layout.tpl
As always, open this with a Plain text editor and always save it as plain text. Once open, look for this comment about two-thirds of the way down:
{ * Mike-N-Tosh Note: This is your skins drop down menu *}
You will see the existing drop down menu directly underneath that. A little further down, you will see that there is already an included, but commented out menu space for you to add your skin. Just follow the comment instructions. Save the file and upload it back to the root of your skins template folder overwriting the existing layout.tpl file.
There are three built in display advertising ad spaces included in your template. One for a top banner ad which displays at the top right of your web page and two that are below your Menus on the right hand side of your web page. By default, they are commented out with standard html comments. (e.g. "<--// " the code and then " //-->"
To use any of these built in ad spaces, simply delete comments. the stuff above between the quotes (") above, both before the code and after the code. Two things that you need to bear in mind about these ad spaces.
To utilize these spaces, delette the comment marking before and after the code. Paste in your ad code between the paragraph elements or replacing the entire paragraph. Save your file and upload it to your skins template folder, overwriting the existing layout.tpl file.
Although the installation and use is straight forward for the Skins Template, there may be a time that you have questions or need support. Please make sure that you have read this document to ensure that your answer isn't already covered here. All support is done exclusively via email. To get support for an issue please send an email Support.
The Skins Template and all of it's contents are the property and copyright © of Mike-N-Tosh™. All rights reserved. No portion of this code can be copied or resold.
Your purchase of the Skins Template is on one domain. You may use this template in multiple installations within one domain (e.g. subdomain.yoursite.com). Use and installation on a different domain(s) requires additional license(s).