Tweet
Suppose you have built your site, with 20, 30 or more pages. Then you find out that you must add another section, or eliminate one, or simply change one of the links in your menu buttons. Well, you have to edit all pages, and then republish them. Unless you only have one, single page with your menu in it.
The same goes also for footers and headers. Changing them in a single page and have all your site automatically updated, would save you a lot of time and nerves.
Let’s see how BV can do this with the help of i-frames. The small tutorial here is just some gathering together information posted long time ago by Pablo and Pilotchip.
Let’s start by creating a page for our menubar. The same procedure goes also for navigation bars, Go menus, headers, footers, and anything else that has to appear in more than one pages.
Create the menubar page. Create and place the menubar (or nav bar or footer or header) in the exact position where you want it to appear in the rest of your pages. Establish the links as you would have done normally, BUT SET THE "TARGET" TO "TOP".
In my own pages, I have this menu and header page: http://www.navaldesign.info/Italiano/menu_ita.html
Now, we will put our menu page OVER the other pages. But we first have to make the background transparent, so it won’t cover the page content. To do this, copy the following code:
<style type="text/css">
body {background-color: transparent}
</style>
Then go in Page html, click on “Between Head” tag, and paste the code in the window.
Save your page with an obvious name like “menu”. Then go on and PUBLISH IT.
IMPORTANT!! DON’T “ center in browser ” THE Menu Page
Now let’s go to the next step. Put the menu in the other pages.
Create your pages exactly as you want them to appear. Leave space for the menubar. If this helps you, temporarily copy- paste the menu in the page, so you have a reference on how your page will appear with the menu in place, then, before saving, delete the menu. In coping the menu in the page, don’t use the right click “paste”, nor the “Edit” >”Paste” command from the Toolbar. Use the Paste icon in the Toolbar. This will paste whatever you have copied in the same exact position where it was in the provenience page.
My own index page is made this way. The index page is:
http://www.navaldesign.info
and the page without the menu and the header is
http://www.navaldesign.info/Tips/homepage_ita.html
Now let’s see how we put the menu in our page. Of course this will only happen when we preview or publish the page.
In your page, create an I-frame. It has to be big enough to contain the whole menu. I usually make it the same size as my whole page, but you can make it the same size of your menu or header etc.
Double click the frame, to edit it, and make it non scrollable, and with no border. Give it as default URl, the menu page URL, so when the page loads, it will automatically load the menubar in the i-frame. Put the frame INFRONT OF ALL THE OTHER PAGE CONTENT. If you have followed the procedure as described, the I-frame is already infront of all the other stuff.
Please note that at this point the I-frame covers all or part of your page. Don’t worry, now we are going to make it transparent.
To do this, you need to copy the following code:
allowtransparency="true" background-color="transparent"
Right click on the I-frame, chose Object HTML, click on “Inside Tag” and paste the above code in the window. At this point your i-frame has become transparent. Attention! Transparency is only visible in Preview or when published. In the original BV screen, it appears whte, SO IF YOU WANT TO EDIT THE PAGE, PUT THE FRAME IN THE BACK, EDIT, THEN BRING THE FRAME INFRONT AGAIN, AND SAVE THE PAGE. Publish it.
As you can see, following the same steps for all your pages, and copying – pasting the I-frame in all your pages, you now have one single page with your menubar – or header or whatever else – and it appears in All your pages. Whenever in the future you want to update or change your menubar, you only have to edit the menu page and re-publish it. You're done!
The same goes also for footers and headers. Changing them in a single page and have all your site automatically updated, would save you a lot of time and nerves.
Let’s see how BV can do this with the help of i-frames. The small tutorial here is just some gathering together information posted long time ago by Pablo and Pilotchip.
Let’s start by creating a page for our menubar. The same procedure goes also for navigation bars, Go menus, headers, footers, and anything else that has to appear in more than one pages.
Create the menubar page. Create and place the menubar (or nav bar or footer or header) in the exact position where you want it to appear in the rest of your pages. Establish the links as you would have done normally, BUT SET THE "TARGET" TO "TOP".
In my own pages, I have this menu and header page: http://www.navaldesign.info/Italiano/menu_ita.html
Now, we will put our menu page OVER the other pages. But we first have to make the background transparent, so it won’t cover the page content. To do this, copy the following code:
<style type="text/css">
body {background-color: transparent}
</style>
Then go in Page html, click on “Between Head” tag, and paste the code in the window.
Save your page with an obvious name like “menu”. Then go on and PUBLISH IT.
IMPORTANT!! DON’T “ center in browser ” THE Menu Page
Now let’s go to the next step. Put the menu in the other pages.
Create your pages exactly as you want them to appear. Leave space for the menubar. If this helps you, temporarily copy- paste the menu in the page, so you have a reference on how your page will appear with the menu in place, then, before saving, delete the menu. In coping the menu in the page, don’t use the right click “paste”, nor the “Edit” >”Paste” command from the Toolbar. Use the Paste icon in the Toolbar. This will paste whatever you have copied in the same exact position where it was in the provenience page.
My own index page is made this way. The index page is:
http://www.navaldesign.info
and the page without the menu and the header is
http://www.navaldesign.info/Tips/homepage_ita.html
Now let’s see how we put the menu in our page. Of course this will only happen when we preview or publish the page.
In your page, create an I-frame. It has to be big enough to contain the whole menu. I usually make it the same size as my whole page, but you can make it the same size of your menu or header etc.
Double click the frame, to edit it, and make it non scrollable, and with no border. Give it as default URl, the menu page URL, so when the page loads, it will automatically load the menubar in the i-frame. Put the frame INFRONT OF ALL THE OTHER PAGE CONTENT. If you have followed the procedure as described, the I-frame is already infront of all the other stuff.
Please note that at this point the I-frame covers all or part of your page. Don’t worry, now we are going to make it transparent.
To do this, you need to copy the following code:
allowtransparency="true" background-color="transparent"
Right click on the I-frame, chose Object HTML, click on “Inside Tag” and paste the above code in the window. At this point your i-frame has become transparent. Attention! Transparency is only visible in Preview or when published. In the original BV screen, it appears whte, SO IF YOU WANT TO EDIT THE PAGE, PUT THE FRAME IN THE BACK, EDIT, THEN BRING THE FRAME INFRONT AGAIN, AND SAVE THE PAGE. Publish it.
As you can see, following the same steps for all your pages, and copying – pasting the I-frame in all your pages, you now have one single page with your menubar – or header or whatever else – and it appears in All your pages. Whenever in the future you want to update or change your menubar, you only have to edit the menu page and re-publish it. You're done!
Comment