Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

For Seven HTML Pro - Open Secondary Nav on Icon Nav click.


Here is the suggestion and also a request for Seven HTML Pro.

This theme has an aside toggle button (which is great). What I need and suggests is that when you click on icon nav (aside primary) the close toggle should get open.

I hope you understand my request.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi,

Thanks for the suggestion. We will add it in the next update.

You can add the below js script into src/js/layout/aside.js


"use strict";

// Class definition
var KTLayoutAside = function() {
// Private variables
var asideEl;

// Private functions
var handleToggle = function() {
var toggleEl = document.querySelector("[data-kt-toggle-name="aside-minimize"]");
var toggle = KTToggle.getInstance(toggleEl);

const triggerTabList = document.querySelectorAll("#kt_aside_nav [data-bs-toggle="tab"]");
triggerTabList.forEach(triggerEl => {
const tabTrigger = new bootstrap.Tab(triggerEl);

triggerEl.addEventListener("click", event => {
toggle.disable();
})
})
}

// Public methods
return {
init: function() {
asideEl = document.querySelector("#kt_aside");

if (asideEl) {
handleToggle();
}
}
};
}();

// On document ready
KTUtil.onDOMContentLoaded(function() {
KTLayoutAside.init();
});

// Webpack support
if (typeof module !== "undefined" && typeof module.exports !== "undefined") {
module.exports = KTLayoutAside;
}


Then recompile the theme with gulp.

Regards.



Thank you! It works.



Great! You are welcome! All the best happy


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(