How to create a button to toggle sidebar

Hi

The cross that opens the sidebar in Intro is a bit too small for me.

I want to create a button in the body of the website that reads “See More”. When you click on it, it should open the hidden sidebar.

Is this possible at all? Apologies if this is a stupid question, I’m a real novice.

Hi,

Yes, its possible but could you please to share your site URL and show me where is the button that will you used to open the sidebar?

Regards,
Awan

Hi Awan!

My website is not live yet and is currently hiding behind a Coming Soon widget: www.stationhouse.co.za

I added an image widget to the body, hoping that it would be as simple as adding a URL.

However, I suspect that I’ll need to add a text widget instead with some code?

*update: website is now live

Hi,

Thank you to make it live, but where is the button that you want to use to open the sidebar? Please to create the button first, and then I’ll let you know the javascript code that you need.

Regards,
Awan

I made the “SEE MORE” image buttons at the bottom part of almost all the pages. Currently it goes to the gallery page.

Oh I see…

Firstly, please install and activate this plugin: https://wordpress.org/plugins/header-footer/
Then go to: Dashboard > Settings > Header & Footer > Put below javascript to “Before the body closing tag (footer)”:

<script>
jQuery(function($){
    $('a[href*="gallery"]').click(function(e){
	$('#sidebar').toggleClass('hidden');
	$('.sidebar-btn').toggleClass('cross');
	return false;
    });
});
</script>

P.S: The script in above will will work for all links or <a> tag that contain gallery in the href attribute.

Regards,
Awan

Does this replace the functionality, i.e. the cross will no longer toggle the sidebar? I want both the button and sidebar cross to do it.

Nope, both button still can work :slight_smile:

Thanks!