Return to previous page

FLOATING SIDEBAR - by Eprana - on WordPress WooCommerce support

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

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

#192572 Copied Theme version: 1.0 WooCommerce version: 4.9.5

6 Answers

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

#192617 Copied

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.

#192857 Copied Theme version: 4

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.

#192858 Copied Theme version: 1.0 WooCommerce version: 4.9.5
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
#192872 Copied
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

#193143 Copied Theme version: 1.0 WooCommerce version: 4.9.5

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

#193158 Copied
Viewing 7 results - 1 through 7 (of 7 total)