Responsive Webhelp Footer

[dgallo]

I am having an issue with the footer where, if there is not a lot of content on a page, the footer appears to be floating in the middle of the screen. Ideally I would prefer it to be pushed to the very bottom of the page.

Do you know how to fix this?

[bogdan_cercelaru]

Hello,

To have the footer locked to the bottom of the page when the content doesn't fill the entire page you could set the "webhelp.fragment.after.body" parameter to point to an XML file with the following content:

Code: Select all

<span id="hidden">

	<style>

		#hidden {

			display: none;

		}

		.wh_content_area {

			min-height: inherit;

		}

		.wh_footer {

			position: fixed;

		}

	</style>



	<script>

		<!--

		function footerPosition() {

			var $whContentArea = $(".wh_content_area");

			var $whFooter = $(".wh_footer");



			var contentAreaHeight = $whContentArea.height();

			var contentAreaTop = $whContentArea.offset().top;

			var pageHeight = $(window).height();

			var footerHeight = $whFooter.height() + parseInt($whFooter.css("margin-top")) + parseInt($whFooter.css("margin-bottom"));



			if (pageHeight < contentAreaHeight + contentAreaTop + footerHeight) {

				$whFooter.css("position", "relative");

			} else {

				$whFooter.css("position", "fixed");

			}

		}



		$(document).ready(function() {

			footerPosition();

		});



		$(window).resize(function() {

			footerPosition();

		});

		-->

	</script>

</span>

You can find more information about the "webhelp.fragment.after.body" parameter usage here: WebHelp Responsive Customization Methods

Regards,
Bogdan

[dgallo]

That does not seem to work. Instead it shrinks the footer horizontally on the page.

[Anonymous1]

Don't have a solution, but am also very interested in finding one. The suggested solution didn't work for me.

[alin]

Hello,

I have tested Bogdan's solution and it worked for me.
Please make sure that the end marker of the comment that wraps the JS code ("-->") is placed on a new line (like in Bogdan's example) or it is preceded by //.

Code: Select all

<!-- JS code //-->

[Anonymous1]

I think I used it correctly, but instead of being pushed to the bottom of the page, the footer is even more in the middle of the page than before.

We are using a customized WebHelp Responsive. Can I give any more input?

[alin]

Please try to use the above solution with an unaltered WebHelp Plugin (without customizations).
Does it work this way?

[Anonymous1]

You are right, with a standard WebHelp plug-in the solution works. I'll try to figure out why.