FLOATING SIDEBAR - by Eprana - on WordPress WooCommerce support

This topic has 7 replies, 2 voices, and was last updated 5 years, 10 months ago ago by Rose Tyler

  • Avatar: Eprana
    Eprana
    Participant
    May 8, 2018 at 17:39

    Good afternoon, again.

    I would need the sidebar that I use on the Blog and posts (is the only place where I have sidebar), was floating.

    Where can I find that option? I’m reviewing all the options on the theme options, but I can’t find it.

    Thanks a lot.

    Ana

    6 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 10, 2018 at 07:56

    Hello,

    Could you please describe the desired result in more details? Thanks in advance.

    Regards

    Avatar: Eprana
    Eprana
    Participant
    May 14, 2018 at 07:24

    Good morning.

    Of course.

    What I would like is that when the user is browsing my blog, always be visible the Sidebar even scrolling.

    As it is right now, it’s sidebar disappears from the view when the user scrolls down.

    NOTE: I have only sidebar on BLOG page and in posts pages.

    Thanks a lot.

    Avatar: Eprana
    Eprana
    Participant
    May 14, 2018 at 07:27

    Good morning.

    Of course.

    What I would like is that when the user is browsing my blog, always be visible the Sidebar even scroll.

    As it is right now, it’s sidebar disappears from the view when the user scrolls down.

    NOTE: I have only sidebar on BLOG page and in posts pages.

    Thanks a lot.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 14, 2018 at 08:59

    Hello,

    Please try to add this code in Theme Options > Custom css > Custom css for desktop:

    .blog .sidebar,
    .single-post .sidebar {
        position: sticky;
        top:  0;
        right: 0;
    }
    .blog .fixNav-enabled .fixed-already + .container + .header-wrapper + .page-heading + .container .sidebar,
    .single-post .fixNav-enabled .fixed-already + .container + .header-wrapper + .page-heading + .container .sidebar {
        top: 150px;
    }

    Regards

    Avatar: Eprana
    Eprana
    Participant
    May 16, 2018 at 19:45

    Hy.

    I’m afraid it’s the same.

    When writing the code in “Custom CSS for desktop”, the yellow triangle sign with exclamation mark, appears, just next to the line “position: sticky”

    There must be some error in the code. Or at least in that line

    It’s important to me that that sidebar is sticky

    Thanks.

    Ana

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 17, 2018 at 07:36

    Hello,

    The code works if I test it via the console – https://gyazo.com/df5e2e11671f9da5ce45e7e36a5c4f4a
    You can add custom css code in 2 ways: style.css file of the child theme or Custom css area (Theme Options). To make custom code works from Theme Options, in child theme should be created the empty dynamic.css file and in functions.php of child theme should be added this code:
    wp_enqueue_style( 'dynamic-css', get_stylesheet_directory_uri() . '/dynamic.css' );

    Regards

  • Viewing 7 results - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.