Control the settings of the Side Panel used to display additional content on all pages and posts, without sacrificing space. The Side Panel is hidden by default and can be triggered using the Header Button displayed near the Main Menu. This button can also be used to open a new page or smooth scroll to a page section ID.
Header Button Settings
- Enable Header Button – option to enable/disable showing the header button. The button will be displayed near the main navigation area to the right.
- Button Text – option to set the button text.
- Button Style – option to select the button design style.
- Button Color Scheme – option to select the button color scheme. Primary and secondary colors can be set in Theme Options > Global Options > Color schemes.
- Button Hover State – option to select the button design style for the hover state.
- Button Action – option to control the button action on click.
Side Panel Settings
- Panel Heading – title text for the side panel.
- Modal Contents – side panel description text area. HTML is allowed.
- Contact Links – option to enable/disable displaying the phone and email links in the side panel window.
- Social Icons – option to enable/disable displaying the social icons in the side panel window.
- Contact Form Plugin – option to enable/disable displaying a contact form in the side panel window.
- Contact Form 7 Title – select the Contact Form 7 from the dropdown. The list is automatically populated.
- CSS Class – add a class to the wrapping HTML element for further CSS customization.
IMPORTANT! Changes to the phone, email and social links can be done in Theme Options > Business Info.
Scroll Section Settings
- Scroll to Section ID – enter the section ID where you want the Header Button to scroll to.
New Page Link Settings
- Button Link – enter the link of the page where you want the Header Button to redirect to.
- Link Target – option to select between opening the link in the same or a new page.
Trigger the Side Panel using any button
You can trigger the Side Panel using any button. For example, open the Button element settings modal and check with the Button action option.