-
AuthorPosts
-
November 15, 2022 at 1:38 pm #1372635
hi,
we would like to have a black bar across the entire left side and the footer at the bottom of the page. The left bar should contain the menu and other logos. So far we got this implemented. The problem here is that if the content is long enough, the footer is at the bottom, but the left bar is not completely black. If the content text is shorter, the bar on the left is completely black, but the footer is not attached to the bottom.
Can you help here?
November 16, 2022 at 7:06 pm #1372832Hey gdsconcepts,
Thanks for the link to your page, it looks like you have added custom css to set the footer as fixed to the bottom of the screen, as I understand your question you actually want the footer at the bottom of the page so it will scroll into view. So please remove your custom css for this.
Now the issue that the sidebar header doesn’t reach the bottom can be solved with this function added to the end of your child theme functions.php file in Appearance ▸ Editor:function custom_sidebar_header_min_height() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ $('.html_header_sidebar #top #header').each(function() { var pageHeight = $('body').height(); $(this).css({'min-height': pageHeight }) }); })(jQuery); }); </script> <?php } add_action('wp_footer', 'custom_sidebar_header_min_height');
Best regards,
MikeNovember 17, 2022 at 11:28 am #1372908Thanks for your answer.
Unfortunately I get an error message when I enter the code.November 17, 2022 at 11:37 am #1372910Hi,
Please ensure that you copied the code from the support forum and not an email that you may get from the forum because copying from an email may convert the quotes in the code to “curly quotes” which will break the code.
If this doesn’t help please include an admin login in the Private Content area so we can be of more assistance.Best regards,
MikeNovember 17, 2022 at 11:51 am #1372913I can now paste the code. The right bar now fits in the desktop view. Unfortunately it doesn’t fit in the mobile view. here the black area is too big, so you have to scroll down far. In addition, the footer is not at the lower edge of the browser on pages with less content in the desktop view.
November 17, 2022 at 2:32 pm #1372949Hi,
Thank you for the login, I see that you are using a plugin to add a background slider to the page: Unlimited Background Slider which is taller than the page content, so I have adjusted the function to also change the height of the page content to match your slider.function custom_sidebar_header_min_height() { ?> <script> window.addEventListener('DOMContentLoaded', function() { (function($){ var pageHeight = $('body').height(); $('.html_header_sidebar #top #header').css({'min-height': pageHeight + 51}); $('.html_header_sidebar #top #av_section_1').css({'min-height': pageHeight}); })(jQuery); }); </script> <?php } add_action('wp_footer', 'custom_sidebar_header_min_height');
This seems to work on the pages that I checked, please check.
Best regards,
Mike -
AuthorPosts
- The topic ‘Background color side menu’ is closed to new replies.