multitheme test

    Share
    avatar
    Darren
    Ze Big boss

    Number of posts : 171
    Age : 8
    Reputation : 41
    Registration date : 2008-11-29
    20110209

    multitheme test

    Post by Darren

    Finalising the tutorial - For the FM ENG FAQ Listing.


    In order to preform this, we require atleast 10-15 minutes and a little bit of patience, and we need a notepad or word document open


    Warning: CSS Users: If you have good knowledge of CSS it is advised that you use your stylesheets
    Warning: Hitskin users: Because we cannot change the images of the skins not directly on our forum, we can only use the default images on the hitksin forum previews - This cannot be changed.


    We also need a word or note pad document open


    This is a 3 step tutorial. - What are they?

    The implementation of this is in three steps:

    Step 1- Prepare our style sheets ( 2 levels )
    Step 2 - Create our script
    Step 3 - Insert the selector on the forum


    Step 1 - Preparing the skins were going to use - (Non-CSS knowledgable)

    Anyone who has CSS knowledge in making skins would be advised to have their skins CSS handy - Please view next below before continuing on please.

    Lets quickly open a new tab in your browser and load http://hitskin.com
    Warning: When choosing theme's, ensure they are the same version as your forum, otherwise the selector will not display
    Now, select 3 skins from hitskin that you wish to use that is on the same version as you have I'm using PunBB for this tutorial but adjust to your version
    => You can find out the version of your forum via
    Admin panel >> Display > Choose a theme > Version.

    The theme I'm going to use is Twilightsaga-4ever.com by iwkzy

    In the URL Bar you will see the address http://demo.nicetheme.com/index.htm?theme_id=153102
    We need this reduce specific address to just the numbers so its just 153102


    Now, grab the CSS Code by adding in a css grabber -ltr.css .
    Now we configure the theme by this way /153102-ltr.css

    Now were ready to configure this to our forum
    Code:
    http://address_of_your_forum/ 153102-ltr.css
    /!\ Important: Insert this into your word or notepad document now!

    Repeat this step as many times as desired to receive the amount of wanted themes options, recording all in the note or word pad document.
    => Proceed to step 2 now

    Step 1; CSS Knowledgeable
    Spoiler:
    Open up your CSS creations, or make new ones
    save the document with an easily recognizable name, and avoid spaces in the name

    Note: It is not necessary to replicate a complete CSS Stylesheet, as long as you do not disable the css base of your forum.

    Example
    You can not make CSS Style Sheets that do not modify some elements or only one, for example the bottom of your forum:
    I put this in my notepad
    Code:
    body {
    background-color:#000000;
    }
    I save this to my desktop, with the file name "Fond_noir.css"

    I also want to propose a red background:
    New document on my notepad with:
    Code:
    body {
    background-color:#ca2c2d;
    }

    I save the file on my desktop with the file name Fond_rouge.css

    ~> Once your CSS style sheets are prepared and located on your desktop: you must upload.

    http://www.filedropper.com/ - Just register, login & upload.

    Host your CSS file, and note the addresses obtained on the notepad, specifying the name of those there so you can spot them easily.

    Step 2 - Creating the script
    Caution: Follow this carefully, it is broken down into 4 steps
    Sub-Step 1: Create the HTML Page
    Admin panel >> Modules > HTML page management > Create new
    Both options are set to NO

    Step 1: Name the HTML Page to your discretion
    Both of the below options must be set to no

    Copy and paste this code into the blank HTML Page space
    Take DUE note that this script is broken up into 3 parts for ease of use!

    The script is attached as an attachment, at the bottom of this post.

    Remember: Read the rest of this post FIRST before completing it, I need to explain how to change some things.

    Now, Ill explain what code does what.
    Do not modify the code unless told to - or where I say in this tutorial.

    In part 1 - You will see the text "DEFAULT" "CUSTOM THEME 1/2/3"
    You can change them to the names of the custom themes.

    In section 2, you will see the URL http://testorial.forumotion.com - Change that to the URL Of your forum.
    You will see 5 numbers proceeding the URL, change that to the numbers we recorded earlier ( 1 per line ) as that is your next theme.

    You will also see the text (DEFAULT THEME), (CUSTOM THEME 1/2/3) please remove them as they are a simple guide to what theme will be what. The selector will not show up if the text remains there Wink

    Now, save the HTML Page.
    Hit the "Modules" tab again, and hit the HTML Pages management, and copy the URL of the page we just created - Save it in your notepad.

    In your notepad, paste this code, and modify my URL to the URL of your page.
    Code:
    <script type=text/javascript src=http://testorial.forumotion.com/h9-multithemev3></script>

    Now, once you've modified that above code, copy it, and page it in the site description via: Admin panel >> General > Forum/configuration > Site Description & Save it there

    Now leave the admin panel, and view the glory of your new theme selector Very Happy

    Note: For template users (PunBB & PHPBB2) it is just as easy to use the above method. There's no difference if you rather do it via templates Wink


    I hope you have enjoyed this tutorial cheers



    Thanks,
    Darren
    Attachments
    Multitheme.txt
    You don't have permission to download attachments.
    (3 Kb) Downloaded 6 times


    _________________
    Test text
    Share this post on: diggdeliciousredditstumbleuponslashdotyahoogooglelive

    avatar

    Post on Tue Mar 29, 2011 11:55 am by Darren

    [Note]This tut is pending ESF Staff's confirmation for attachments - it cannot be public as of yet[/note]

    29.3.11

      Current date/time is Sat Dec 16, 2017 12:46 am