SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    May 2008
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Adding Top Frame to Allow Switching Between Demo Sites

    I'm a self taught web designer and I've come to the point where I need to learn something new: Frames. I'm starting to sell wordpress themes and I need to create a Frame that will allow users to switch between demo themes they would like to view and possibly purchase. A great example of this can be found here: woothemes.com/demo/?t=35

    Now I looked up a tutorial to explain everything and even viewed some source code (shown below).

    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
     
    <head>
    <title>Presto Themes Demo</title>
    <link rel="Shortcut Icon" href="http://.../images/favicon.ico" type="image/x-icon" /> 
    <meta name="description" content="Presto Themes Demo" />
    <meta name="keywords" content="prestothemes, themes, wordpress" />
    </head>
     
    <frameset rows="36,*" frameborder="0" border="0" framespacing="0">
        <frame src="/...php/" name="switcher" scrolling="no" noresize>
    	<frame src="UntitledFrame-1" name="main" scrolling="auto" noresize>
    </frameset>
     
    <noframes>
          <p>Sorry, your current browser does not support frames!</p>
    </noframes>	
     
    </html>

    My question is this: How do I set this up and where do I store the file with the above code?

    First off, I will be making a new Wordpress Install for each theme and uploading them to the following addresses:

    mysite.com/demo/news
    mysite.com/demo/music etc

    So I'm guessing in the code supplied above, I will need to have some index.php or something for the "Frame Source" that will generate the top bar drop down menus for switching? Where will I store this file in my directory?

  2. #2
    Follow: @AlexDawsonUK silver trophybronze trophy AlexDawson's Avatar
    Join Date
    Feb 2009
    Location
    England, UK
    Posts
    8,111
    Mentioned
    0 Post(s)
    Tagged
    1 Thread(s)
    paraditutorials, Do yourself a favor and go as far away from frames as possible, not only are they deprecated (the W3C - people behind HTML have essentially outlawed its use) it causes a heck of a lot of accessibility and usability issues and all in all, damages your website. Using frames used to be popular in the 90's but using them today is an extremly bad move which will make you seem unprofessional as a result. (Sorry this sounds so harsh but using frames is pretty much a capital sin amongst developers and designers these days).

  3. #3
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Agreed. The same goes for iframes, though there are those who still like them.

    You might be tempted to do popups instead. Don't. I'd do separate pages and let users switch back and forth with appropriate breadcrumb links or whatever before I'd do a framed setup.

  4. #4
    SitePoint Member
    Join Date
    May 2008
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow, at first I was like "OK guys" i get the point, haha, but thanks for warning me. I think I learned my lesson quick on that one!

    How about this idea then:

    At the top of each demo theme, I simply use HTML/CSS to style my own "theme switcher" top bar with my logo and all and have a drop down selection to switch between themes? Each demo theme will be interlinked and each theme will have the same HTML/CSS at the top. I think that will work just fine.

    The only problem with this approach is that the user will always have to scroll back to the top to select a new theme, as it won't stay on 'top' in the frame as they scroll down.
    Last edited by paraditutorials; Jul 3, 2009 at 22:56.

  5. #5
    SitePoint Wizard bronze trophy bluedreamer's Avatar
    Join Date
    Jul 2005
    Location
    Middle England
    Posts
    3,362
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by paraditutorials View Post
    At the top of each demo theme, I simply use HTML/CSS to style my own "theme switcher" top bar with my logo and all and have a drop down selection to switch between themes? Each demo theme will be interlinked and each theme will have the same HTML/CSS at the top. I think that will work just fine.

    The only problem with this approach is that the user will always have to scroll back to the top to select a new theme, as it won't stay on 'top' in the frame as they scroll down.
    A select box would be a perfect solution.

    Yes people would normally have to scroll back to the top of the page to chnage the demo but there are a couple of possibilities;

    1. Add a second select box in the footer
    2. Make the "top bar" containing the select box static so it's in view all the time

  6. #6
    SitePoint Member
    Join Date
    May 2008
    Posts
    9
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    1. Add a second select box in the footer
    2. Make the "top bar" containing the select box static so it's in view all the time
    Brilliant. I think that will most definitely work. I was thinking last night though, if I set this up on my first demo theme and then a month later release my second theme, I will have to log into the first demo theme to add the links to the second theme and then log into the second demo to add all the links to the first demo theme. So the more themes I add, I have to always update every single demo theme to make sure they have all the new links.

    Is there a way to have every demo theme point to 'one' file that I can update somewhere on my server just once?


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •