How to create a sidebar using wysiwyg

5 replies
  • WEB DESIGN
  • |
I am using cofeemate and create a little sidebar on my website, However, I want it so that when i change the sidebar it changes on all the pages. Any Help?
#create #sidebar #wysiwyg
  • Profile picture of the author Sam Fowler
    I assume you're using html and not a server-side language such as PHP, JSP, ASP.NET.

    In html, to 'templatize' the sidebar where 1 change works for all pages, you can use iframes.

    Google - "html iframe tag" to get the code.

    1) Copy/Cut the sidebar code (div or table, etc) and place it in a notepad file - save as sideBar.html
    2) In index.html, add the iframe tag where you cut the code from. Here's a partial code from the iframe beginning tag

    iframe src ="sideBar.html" width="100%" height="300"

    3) add closing iframe tag

    Make sure you do cross-browser testing on this.

    Go to w3schools.com for more examples
    {{ DiscussionBoard.errors[2022185].message }}
    • Profile picture of the author Sam Fowler
      OK, I left out the last part.

      Now, after you're iframe is included, a change made to sideBar.html with show up in all your pages that include that file.

      sideBar.html is typically referred to as an "include" file.

      The challenge comes with SEO. Let's say you want the H1 tag to change per page and sideBar.html has the H1 tag. Now you'll need to pass a parameter per page change and this is where a server-side framework would be necessary.
      {{ DiscussionBoard.errors[2022202].message }}
  • Profile picture of the author TrueStory
    Sam,

    I was under impression that mobile browsers have bad interpretation of (i)frames in general?

    I know my blackberry completely f**s it up, when i view iFrames.


    Another implementation would be using Server Side Includes

    Server Side Includes | using SSI to keep your pages up to date

    But you would have to change your pages to shtml

    Create one file, called sidebar.ssi or sidebar.shtml and include it everywhere, on each page.
    Signature

    Your business matters only to people that matter to your business[/U][/B] - Reach them?

    {{ DiscussionBoard.errors[2023265].message }}
    • Profile picture of the author Sam Fowler
      The best way to do this is using Server Side includes whether SSI, ASP.NET, PHP, JSP, etc.

      The question is, what does the server support? That will depend on the type of hosting account and OS you have.

      On the issue of iframes and mobile devices - the question is, do you want to support mobile devices? If so, then iframes is not a good option.

      That leaves either duplicating the sidebar in every html file OR learning something like PHP, etc.
      {{ DiscussionBoard.errors[2029018].message }}
  • Profile picture of the author TrueStory
    Sam that's what I was thinking too, but I am sure most hosting companies support SSI at least.
    Signature

    Your business matters only to people that matter to your business[/U][/B] - Reach them?

    {{ DiscussionBoard.errors[2029875].message }}

Trending Topics