-
AuthorPosts
-
September 26, 2020 at 5:23 pm #1248700
I would like the top bar to always show, whether or not I use transparency for the logo and main navigation. How do I do that?
September 29, 2020 at 11:22 am #1249321Hey phausner,
Credentials did not work for me. Could you please update the credentials?
Best regards,
VictoriaSeptember 29, 2020 at 3:44 pm #1249405This reply has been marked as private.September 29, 2020 at 5:21 pm #1249454Hi phausner,
I tried. Still the same result.
Best regards,
VictoriaSeptember 29, 2020 at 5:29 pm #1249460This reply has been marked as private.October 3, 2020 at 2:27 pm #1250330Hi,
Sorry for the late reply, I was not able to login to your backend, but I was able to test a jQuery script by injecting the script on my end.
So as I understood your question you would like the topbar to show after scroll, when it is typically hidden.
Try adding this code to the end of your functions.php file in Appearance > Editor:function show_topbar_after_scroll(){ ?> <script> ( function( $ ) { 'use strict'; var $window = $( window ); var lastScrollTop = 0; var $topbar = $( '#header_meta' ); var $header = $( '#header' ); var headerBottom = $topbar.position().top + $topbar.outerHeight( true ); $window.scroll( function() { var windowTop = $window.scrollTop(); // Add custom sticky class if ( windowTop >= headerBottom ) { $topbar.addClass( 'top-sticky' ); } else { $topbar.removeClass( 'top-sticky' ); $topbar.removeClass( 'top-show' ); } // Show/hide if ( $topbar.hasClass( 'top-sticky' ) ) { if ( windowTop >= headerBottom || windowTop > lastScrollTop ) { $header.addClass( 'top-show' ); } else { $header.removeClass( 'top-show' ); } } lastScrollTop = windowTop; } ); } ( jQuery ) ); </script> <?php } add_action('wp_footer', 'show_topbar_after_scroll');
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:
.responsive #top #wrap_all #header.top-show { margin-top: 0 !important; }
Then clear your browser cache and any cache plugin, and check.
Please see the screenshot in Private Content area.Best regards,
MikeOctober 5, 2020 at 10:09 pm #1250657This reply has been marked as private.October 6, 2020 at 12:13 pm #1250822Hi,
Thank you for the feedback, please try this css:#top #header.av_header_transparency #header_meta { background-color: #349a47 !important; }
After applying the css, please clear your browser cache and check.
Best regards,
MikeOctober 8, 2020 at 10:18 pm #1251572Perfect!! Thank you so much!
October 9, 2020 at 1:49 pm #1251705Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)Best regards,
Mike -
AuthorPosts
- The topic ‘Remove transparency from Header Top Bar when using Header transparency’ is closed to new replies.