Home › Forums › Weaver X Tutorials and Hints › help with fixed bottom – and link to fixed header
- This topic has 9 replies, 2 voices, and was last updated 6 years, 3 months ago by
Anki.
-
AuthorPosts
-
February 14, 2016 at 13:31 UTC - Views: 39 #18687
Anki
ParticipantHi!Hope someone can help me, I want a fixed top and bottom, and I want “Header Image Links to Site”.
I have read almost everything on the forum and I cant find what I looking for (xtreme plus).1. Can I have a link to the fixed header, and how do I solve it ?This is what I have in Advanced Option, HTML Insertion, Fixed Browser Top.
[show_if device='desktop'][header_image][extra_menu menu_name='sidor' menu_style='primary' menu_type='standard'][/show_if]and in Main Options, Fonts & Custom,.is-desktop #wrapper {margin-top:200px;}.is-desktop #wrapper {margin-bottom:100px;}2. I can´t find anything on what to write in the Fixed Browser Bottom,to get the footer and footer widges area to be fixed (and still be able to link to other pages) at the bottom of the site.Is there someone who can help me what to write in the box?My testsite – http://mittgarage.se/And my real site – http://dintrafikskola.nu (still in weaver II) soon to upgrade, I hope.Thank you in advansedFebruary 14, 2016 at 17:45 UTC - Views: 17 #26689scrambler
Moderator1- You can place the header image shortcode in an html link like
<a href=”url“>[header_image]</a>
2- The fixed browser bottom is like the top one, you place whatever content you want in the HTML insert fixed browser bottom box.
So if using that area, you would have to recreate the footer content in there. For widgets, you could use a per page widget area (defined at the bottom of the Sidebar & Layout page), and insert that widget area using the widget area shortcode.
If you don’t want to have to redo the content of the footer, you can fix the actual footer by adding the rule below in the Theme custom CSS rule box
.is-desktop #colophon {position:fixed;bottom:0;}
and replace your bottom margin rule on the wrapper by a padding one
.is-desktop #wrapper {padding-bottom:100px;}
February 14, 2016 at 18:14 UTC - Views: 10 #26690Anki
ParticipantThank you, from the bottom of my heart…
I have the footer in place now. I´m so happy.But I´m not so familier with shortcodes, so I dont know were to put it, can you help me?February 14, 2016 at 19:07 UTC - Views: 11 #26691scrambler
ModeratorWhat shortcode are you speaking of?
If you mean the header image, where you had it before.
Instead of using
[show_if device='desktop'][header_image][extra_menu menu_name='sidor' menu_style='primary' menu_type='standard'][/show_if]use[show_if device='desktop'] <a href=”url“> [header_image] </a>[extra_menu menu_name='sidor' menu_style='primary' menu_type='standard'][/show_if]February 14, 2016 at 19:11 UTC - Views: 10 #26692scrambler
ModeratorYou also need to remove the 50px bottom margin you have on the wrapper, and increase the padding-bottom to 200px, or else people cannot access the bottom of your page .
.is-desktop #wrapper {padding-bottom:200px;}
February 14, 2016 at 19:32 UTC - Views: 10 #26693Anki
ParticipantI found were to put the code, but now the menu dissapeard…
But the fixed head i working fine.February 14, 2016 at 20:04 UTC - Views: 10 #26694scrambler
ModeratorYou are very confusing…. 🙂In your first post, you had everything in place in the fixed top area, and you said you had put all the shortcodes in the HTML Insertion Fixed top box, so you obviously knew where to put things.Right now I see both the header image (with link) and the menu in the fixed top area, so everything is good.If you don’t see that, make sure to clear your cache so you are sure to see your changesFebruary 14, 2016 at 20:08 UTC - Views: 10 #26695Anki
ParticipantYes I know – I´m tired, tryed to learn new stuff…
I think I get a hung of it. But theres a gap between header and menu, can I get rid of it?February 14, 2016 at 21:12 UTC - Views: 11 #26696scrambler
ModeratorAdd the inline style (below in yellow) in the link html of the image[show_if device='desktop'] <a href=”url” style=”display:block;line-height:0;”> [header_image] </a>[extra_menu menu_name='sidor' menu_style='primary' menu_type='standard'][/show_if]February 14, 2016 at 21:19 UTC - Views: 10 #26697Anki
ParticipantThank you for all help, your the best 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.