How to create a-href links to content area in header

[MathiasD]

Hi,

On my website, Onlime.dk, I have an off-canvas-area in the header-menu (big blue button).

I would like to be able to trigger this content-area with a normal a-href link. How do I do this?

Thank you,

Br.
Mathias

[mldarshana]

Hi There,

Thanks for writing in! You can add the following CSS rules into your Theme Options > Global CSS area.

.hm15.x-anchor {
    height: auto;
    background: none;
    box-shadow: unset;
}

.hm15.x-anchor:hover {
    height: auto;
    background: none;
    box-shadow: unset;
}

.hm15.x-anchor span {
    color: red !important;
}

Hope that helps.

[MathiasD]

Hi, thank for your response.

After I have pasted your code into Global CSS, how do I setup the if I want the content-area to be opened through a text-link on e.g. a page?

[lely]

Hi There,

Please follow this steps:
1.) Add an ID on your Content Area Off Canvas element. Let’s say we will add off-canvas on Customize Tab > ID text field

2.) Add the button either using button element of text element. This time add class like call-off-canvas Then using Jquery, we will call those event of opening the off canvas. Add this on Content JS:

jQuery(document).ready(function($) {
	$(".call-off-canvas").click(function(event) {
		 event.preventDefault();
     $("#off-canvas-anchor-toggle").click();
	});
	
});

See this implementation: https://screencast-o-matic.com/watch/cFn3VVoRXQ

Further customization from here would be getting into custom development which is outside the scope of our support. Thank you for understanding.

Hope this helps.