Page 1 of 2

[rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Thu Mar 29, 2012 9:21 am
by [RZ]
[rz] Fix Header-Footer v2.1

This extension/patch allows you to have full-sized headers and footers placed in masterpages to be used in horizontally centered pages.
Sample project included.


HTML 4.01 Transitional
W3C compliant

(Fully tested in all major browsers: FireFox, Chrome, Safari, Opera, Maxthon, including the mega-annoying IE in all of its versions and tastes from quirks, 7, 8, 9 and 10.)


* New in version 2.1.0

Added support for RWD.
Added compatibility with [rz] Advertisement extension.
Improved code for better cross-browser and backward compatibility.

Function added:
MyObject.checkpos();
It applies only to footers, and due to their nature, sometimes they should be updated/recalculated in advanced designs; i.e: when opening a [rz] Advertisement instance. MyObject must be replaced with the actual extension instance id.

* New in version 2.0.0

The extension was completely redesigned and rewritten; now the "core" is not needed anymore, just one extension does all the work and supports all major browsers, even the (very) older ones such as IEquirks, IE7, IE8, among others.
The header and footer can have margins, depending where these objects are placed in the main page; advanced calculations were added to fit the most complex designs.
Many variants are available: Header, Body, Footer (move to bottom) and Footer (fill to bottom).


How to use?

** Header:

1. New page.
2. Drag and drop a layer covering the page width (the head and width of the layer, header-masterpage and main-page should be the same; however, it is up to the design scheme).
3. Design your header's content as you usually do.
4. Open the layer's properties dialog and setup the following:

Location and size:

Mode -> Default

[ ] Relative horizontal position
[ ] Relative vertical position
[√] Relative horizontal sizing (<- see the recommended setting in the extension workspace)
[ ] Relative vertical sizing

Alignment -> Left / Center (this is the most used) / Right

5. Add the [rz] Fix Header-Footer extension on top; in the extension properties dialog, enter the unique name of the Master Page object, the same to be used in all pages for the header (i.e. mpHeader).

** Footer:

1. New page.
2. Drag and drop a layer covering the page width (the height and width of the layer, footer-masterpage and main-page should be the same; however, it is up to the design scheme).
3. Design your footer's content as you usually do.
4. Open the layer's properties dialog and setup the following:

Location and size:

Mode -> Default

[ ] Relative horizontal position
[ ] Relative vertical position
[√] Relative horizontal sizing (<- see the recommended setting in the extension workspace)
[√] Relative vertical sizing (<- depends on the footer type, see the recommended setting in the extension workspace)

Alignment -> Left / Center (this is the most used) / Right

5. Add the [rz] Fix Header-Footer extension on top; in the extension properties dialog, enter the unique name of the Master Page object, the same to be used in all pages for the footer (i.e. mpFooter).

** Main Page(s):

1. New page, and design your page's content as you usually do.
2. Add a masterpage object: Tools / Advanced -> Master Page.
3. Select the header page.
4. In the same Master Page Properties dialog:

[√] Master Page is a layer

5. Go to the Object Manager and name the masterpage object with the same unique name in all pages (i.e. mpHeader).

Repeat the same steps 1 to 5, just be sure that you are adding the footer in step 3, and in step 5 you name the object with the same unique name in all of the pages (i.e. mpFooter).


Preview/publish your site and now you can have full-sized headers and footers in your horizontally centered pages.
Enjoy!



** Notes:

- Why I need to name with the same ID in all my pages the masterpage object?
Because this way you have totally centralized the header and footer layers.
Instead of add and setup an extension in all of your pages, you just drag and drop the object only once in the header/footer pages.
In the case you change something, let's say, the header background, you simply do it and republish your site, that's all. You don't need to do any other change!
Anyhow, you can have the patch repeated in each page, but this defeats the purpose of the masterpage...

- This exension works only in horizontally centered pages.

- You can have virtual margins, this means that your main page can be wider than the header and footer; however, in IEquirks mode, these footers and headers are always fully-expanded.

- Footers behave in two modes:
a) the footer can be placed always at the bottom of the screen; however, if the content is large enough, the footer will be relocated after the content at the end of the page.
b) the footer will always be placed immediately after the content; if there is not enough content, the footer will fill the physical space up to the bottom of the available space.

Re: Full-sized headers and footers in centered pages.

Posted: Sat Mar 31, 2012 4:24 am
by protectourlands
Very cool RZ. Addresses a long standing problem trying to apply relative sizing in masterpages. Excellent!

Re: Full-sized headers and footers in centered pages.

Posted: Sat Mar 31, 2012 5:56 pm
by [RZ]
thank you protectourlands, your feedback is appreciated and is encouraging as well.

Re: Full-sized headers and footers in centered pages.

Posted: Wed Jun 06, 2012 12:47 pm
by [RZ]
hagepat (a forum member) reported this:
If I put slideshow on masterpage with your extension, the slideshow is not working. I only shows the first picture. I tried it with new masterpage and remove your extension and then the slideshow is working. Is this a known issue with your extension? Do you have an solution for it?

first of all, thanks for the report.
fortunately, the solution is as follows:

in the sample project file you will find in the header page an html box with a description: "Fix Header (optional)"'; and in the footer page: "Fix Footer (optional)".

go to the header page
open the html box and you will find this:
<script type="text/javascript">
FixLayer('wb_mpHeader','top');
</script>

lets say your masterpage in your site is called MyNiceHeader (in all pages, please read the attached info file).
replace mpHeader with MyNiceHeader.
so, the final code in the html box will be:
<script type="text/javascript">
FixLayer('wb_MyNiceHeader','top');
</script>

do the same for the footer.
now remove the [rz] Fix Header-Footer extension(s) you have.
leave the [rz] Fix Header-Footer (core) extension, don't remove it.

if you don't have the optional html box in your own site, of course copy and paste it making the proper changes, as mentioned.

that's all.
anyhow, i will think how to improve this for the next update.
thank you all again.

(ps: if it seems overcomplicated for you, you can put the jquery based object (like the slideshow) in an inlineframe until the next update)

Re: Full-sized headers and footers in centered pages.

Posted: Wed Jun 06, 2012 2:27 pm
by [RZ]
glad to know.
thanks for your feedback.

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Sun Nov 10, 2013 2:46 pm
by [RZ]
* New in version 2.0.0

The extension was completely redesigned and rewritten; now the "core" is not needed anymore, just one extension does all the work and supports all major browsers, even the (very) older ones such as IEquirks, IE7, IE8, among others.
The header and footer can have margins, depending where these objects are placed in the main page; advanced calculations were added to fit the most complex designs.
Many variants are available: Header, Body, Footer (move to bottom) and Footer (fill to bottom).

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Sun Nov 10, 2013 11:15 pm
by bburgess
[RZ] outstanding stuff mate very nice, Thank you!!!

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Mon Nov 11, 2013 4:51 am
by [RZ]
bburgess wrote:[RZ] outstanding stuff mate very nice, Thank you!!!
thank you for your feedback!

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Fri Feb 07, 2014 11:20 am
by milux
Very great extension; thx to RZ

now I can use the new template with header and footer that fill page width..

Michele

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Fri Feb 07, 2014 11:34 am
by [RZ]
thank you for your feedback
(show us your work!)

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Fri Feb 07, 2014 12:12 pm
by milux
[RZ] wrote:thank you for your feedback
(show us your work!)
It's a test in development : http://test.3md.it/tvt-test/index.html

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Fri Feb 07, 2014 12:21 pm
by [RZ]
you have a two pixels width gap
carousel 942
page width 940
this causes a permanent horizontal scrollbar, no matters how you resize your browser
you should fix this
besides this, it is a good example of a good use of tools

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Fri Feb 07, 2014 12:31 pm
by milux
[RZ] wrote:you have a two pixels width gap
carousel 942
page width 940
this causes a permanent horizontal scrollbar, no matters how you resize your browser
you should fix this
besides this, it is a good example of a good use of tools
Great, thx for your feedback, I will fix ..

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 4:52 pm
by [RZ]
you don't need to strictly put the extension within the layer you want to expand
i did the following test:
open the demo
open and go to the header1 page
cut the extension
now open go to sample1 page
paste there the extension
open and go to the footer1 page
cut the extension
go to sample1 page
paste there the extension, the same as you did for the header
run the preview

the results are as expected, so this means that you don't need to put the extension into the layer
the main point is that the extension need to be after the masterpage you want to expand BUT, for even better/faster/smoother results the extension *can also* be within the layer (on top of all of their contained objects)
this method also resolves an old opera annoying html rendering

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 4:55 pm
by [RZ]
@protectourlands
the previous post was my answer to your question, but seems you removed your post!
(may i ask why?)

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 5:05 pm
by protectourlands
I'm so sorry RZ

I did not see your answer and while I went to edit the post with new info, I accidentally erased it. I meat no harm.

For reference for others, I was inquiring about the fix object and placing it in a layer object. My layer object is too small for the fix object to fit into. I mistakenly thought the fix object had to be placed into the layer. Thank you for advising me that it does not.

I was going to edit the post by including more details. The issue is, my master page contains more objects than the layer and it's objects. So when i add the fix object to the master page, while the layer functions properly in the other pages with the applied master objects, the objects outside the layer do not center on the other pages when previewed. All pages have center horizontal selected.

Am I explaining this well enough?

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 5:16 pm
by [RZ]
so put the other objects within another layer and in the layer properties dialog set 'alignment: center'
and in the extension, instead of point to the masterpage, just point to the layer that you need to expand
if this does not resolve your question, please post a sample project so i can see what you are trying to do

anyhow, you can have many masterpages in the same page, just point to the one you need to expand

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 5:30 pm
by protectourlands
Yes this worked. Thank you so much RZ. I use this extension often and so appreciate it. This was the first time I had additional objects outside the layer. I see now I needto isolate the outside objects.

Thank you again for taking the time to help me.

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Wed Mar 12, 2014 5:36 pm
by [RZ]
glad to know it works!

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Sun Aug 03, 2014 8:13 am
by mayur007
hi
rz download link doesnt work

says its set to private

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Sun Aug 03, 2014 8:20 am
by [RZ]
for additional info, please follow this link: www.magnawebstudio.com/developer
for other details, please follow this link: www.magnawebstudio.com/shop
with regards,

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 4:48 pm
by mayur007
hi rz

i m looking to buy your extensions

so i wanna know your terms

apart not for resale ....

[rz] Parallax Objects

[rz] Gold Pack

[rz] Full Screen Inline Frame

will i get discount :lol: hehe

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:09 pm
by [RZ]
hello;
the prices are incredible low
i have no margin for extra discounts
however, you can see that many products have rebates with the purchase of other products; also other packs also have bonus extensions
with kind regards

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:10 pm
by mayur007
hi i wanna know your terms

like i can use for my self for multiple sites

multiples times

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:11 pm
by [RZ]

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:14 pm
by mayur007
that means i can use for my unlimited sites(personal purpose)

right ??

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:17 pm
by [RZ]
this is a wb forum
for questions related to magnaeshop, please follow the link and contact there
thank you for your understanding

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:18 pm
by mayur007
alright thanx

i did

Re: Fullsize headers/footers in cntrd pages. *** UPD Nov 10

Posted: Tue Aug 19, 2014 5:18 pm
by [RZ]
you are welcome

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Tue Oct 14, 2014 6:23 pm
by [RZ]
UPGRADE AVAILABLE

* New in version 2.1.0

Added support for RWD.
Added compatibility with [rz] Advertisement extension.
Improved code for better cross-browser and backward compatibility.

Function added:
MyObject.checkpos();
It applies only to footers, and due to their nature, sometimes they should be updated/recalculated in advanced designs; i.e: when opening a [rz] Advertisement instance. MyObject must be replaced with the actual extension instance id.

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 5:40 pm
by naftalina
I will buy this extensions anyway, but I want to know the following.
So, [rz] Fix Header-Footers works only on horizontally centered page?
I ask because I do a page that looks like it is centered but the objects are actually aligned with [rz] Align Object,
so I wonder whether [rz] Fix Header-Footer work on it?!
This is the site where I want to use extension: http://remix.com.hr/t1/

Sorry if the answer is already in the thread, but for my programming knowledge and my english, there are too many strange words. ;)

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 5:48 pm
by [RZ]
this extension becomes very useful for horizontally centered pages, when you need masterobjects instead of masterframes
for the design you presented, you can do the same with [rz] Align Object
however, if you need an advanced/variable footer regardless of the page alignment, you still need this extension

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 6:19 pm
by naftalina
Actualy I want to use one header/foother for all pages?
This site is not finished.

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 6:24 pm
by [RZ]
with this extension you can have centralized your headers and footers in masterobjects and manipulate them as you want

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 6:45 pm
by naftalina
[RZ] wrote:with this extension you can have centralized your headers and footers in masterobjects and manipulate them as you want
... even if main page are not centered?

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 21, 2015 8:19 pm
by [RZ]
yes

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 22, 2015 12:42 pm
by naftalina
I just tried and does exactly what I needed! :)
This is very useful tool. :)

Thanks, RZ :)

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 22, 2015 12:43 pm
by [RZ]
thank you for your feedback!

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 28, 2015 7:21 am
by naftalina
Header does not want to stand in front of other objects?
And why the name of extension in the project is [rz] Scroll? :?

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sat Mar 28, 2015 4:49 pm
by [RZ]
1. use stack property to change this
2. i'm human, will fix this in the next update, however dont worry at all, it is just a caption
with regards

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 6:23 am
by naftalina
I use stack option but header wont go in front relative (100% width) sized layers.

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 6:39 am
by [RZ]
it works
use the extension 'stack' property, not the wb object manager panel
if still not working you are using the extension in a wrong way
check the provided sample project and change the stack property to front and you will see it working

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 8:07 am
by naftalina
[RZ] wrote: check the provided sample project and change the stack property to front and you will see it working
So, what I did.

In sample1.html I expand size of lyrBody to 400px and changed properties to relative horizontal sizeing/center
In header.html I set extension properties stack to front
I also aligned mpHeader to front but wont work.

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 8:16 am
by [RZ]
it has been quad-tested and it works

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 8:25 am
by naftalina
To me wont go in front 100% sized layers :/
Am I did something wrong in these steps?

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 8:43 am
by [RZ]
so you are doing something wrong and i have no way to know what is wrong at your end
i can ensure that the sample is working

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 9:07 am
by naftalina
Sample is working by default, but I will like to see sample where works what I try to do, that header goes in front of 100% width layers.
I'll sent you my sample on email. :)

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 9:09 am
by [RZ]
even when i do the back/front changes it works
also i changed the body layer and it also works

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 9:14 am
by naftalina
I send you my sample project. Please take a look and try to find what I did wrong.

Re: [rz] Fullsize Headers-Footers *** UPD 2014-Oct-14 ***

Posted: Sun Mar 29, 2015 9:17 am
by [RZ]
nothing wrong in your sample! all is working pretty fine
the header is in front of the contents