12202 comments found.
Hello,
Is there any figma/invision version or something similar? I noticed you say you do have a figma version but I can’t find anything about it.
Thank you
Hi
,
Thanks for your interest in our theme – Metronic.
The Figma file is available for Metronic v7 and you can find it in the download package and for Metronic 8 we will release the Figma file soon.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hey
,
More to come!
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi,
I try ‘npm run build—prod—demo1’, but it doesn’t minimize js and css. But it does using ‘gulp—prod—demo1’.
Hi,
This is the correct command to build minified assets;
npm run build --prod --demo1
Could you please check css and js content? It should be minified
/html_bootstrap5/theme/demo1/dist/assets/css/style.bundle.css /html_bootstrap5/theme/demo1/dist/assets/js/scripts.bundle.js /html_bootstrap5/theme/demo1/dist/assets/plugins/global/plugins.bundle.js etc
Thanks
yes, i did that and jss + css not minified
Hi,
Could please try to remove the assets folder?
/metronic_v8.0.18/html_bootstrap5/theme/demo1/dist/assets
Then please retry with the build command. We will fix it if this is the issue.
Thanks
Hi,
Yes, i try with clean install but still no minification. Please watch my video. Did I miss something?
https://youtu.be/LixRJsZgSCYThanks
Can you prelease refer to https://themeforest.net/author_dashboard#comment_26983392 ?
Hi,
After add
if ('production' === process.env['NODE_ENV']) {
args.push('production');
}
Yes, it’s work. Thanks @merc2001. Hope it will be fixed in the next update.
Thanks
Hi,
Thank you for your sharing. We will check it. May I know your node.js version? and your OS. So we can take note of this.
Thanks
Nodejs v14.17.3 OS : Windows 10
Thank you. We have included the fix in the recent updates.
Hi keenthemes,
IT’s been now 3 days trying to download the latest Metronic8(since it has the so waited demo6) but without any luck !!!???
1 – The file is huge..
2 – The download cut always somewhere (10%, 80%, 50% ...) never finish
3 – It’s not really the Size, but if it was like a .torrent and has even 20GB it will be OK, but with Metronic8 if it cut, there’s no RESUME… 
I think that you have to downsize the size of Metronic8 by decoupling it from Metronic7.(Ship Metronic7 and Metronic8 separetly).
Is there another way to get Metronic (.torrent, ftp, ...)
Thank you guys.
Hi
,
We will separate v7 once v8 is complete and all v7 features are ported. You can get it from our Github repo. Please send your github username to our support via support@keenthemes.com
You can also try to use our Github registration form here https://keenthemes.com/metronic/?page=githubRegards, Sean
Is there no metronic_v8 laravel8 vue3 integration guide?
Hi
,
Thanks for your interest in Metronic.
We are working on this and it should be available soon. If you need some directions please contact our support via support@keenthemes.com and we will try to show some directions.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
metronic_v8 laravel and vue integration supported? metronic_v7 integrates well with laravel and vue, is there any guide on metronic_v8 laravel vue integration? Too many errors.
Hi
,
Thanks for your interest in Metronic.
Can you please contact our support and provide us more details? The steps you took and what error you got.
Regards, Sean
Hi,
congrats, I’m really happy about the release of the dark skin. 
But unfortunately
gulp --dark-skin --demo5
and the other steps at https://preview.keenthemes.com/metronic8/demo1/dark/documentation/getting-started/dark-skin.html don’t work, it doesn’t generate a dark skin for “Demo5”, only for “Demo1”.
How to fix that?
Best regards, keep up the high update frequency please! 
Hi
,
The dark skin for demo5 will be released in the next update. At the moment only Demo 1 supports the dark skin.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Can I use the template for Codeigniter software project?
Hi
,
Thanks for your interest in Metronic.
We have Laravel version of Metronic that you can preview here https://keenthemes.com/metronic/?page=metronic8
For Codeigniter we will add integration documentation soon. At the moment you may try to refer our Laravel version and integrate the same for Codeigniter. You can also refer to our webpack build docs: https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/build/webpack.htmlRegards, Sean
There is an issue on https://preview.keenthemes.com/metronic/demo1/index.html
Demo 1 layout builder,
Its continuously spinning the page, I have refreshed & back the page, But still spinning
Hi,
This is the layout builder url page; https://preview.keenthemes.com/metronic/demo1/builder.htmlCould you please clarify the issue? Do you mean it spinning after you clicked “export”?
How long did wait after you clicked “export”? It should take some time before the zip starts to download.
Thanks
Hi, How to find ‘sample blank page’ for metronic8 ?
Hi,
We would suggest using the layout builder https://preview.keenthemes.com/metronic8/demo1/layout-builder.html for server-side integration. This video explains it https://www.youtube.com/watch?v=ptgwzvvAHy4&ab_channel=KeenThemes. The video is made for v7 but can be applied to v8 as well.
To create a blank page template you can get the index.html and cleanup the content part in the HTML.
if you need any further help please contact our support via support@keenthemes.com
Regards, Sean
Hi, I want to know the release date of the V8 Demo3 for Angular. or If I purchase metronic theme now will I be able to use the Demo3 for Angular beta or something?
Hi
,
Thanks for your interest in Metronic. We are working on it and we will do our best to release it in early August.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Are you sure you did include the dark mode in the 8.0.18 build? Running “gulp localhost—demo1” generates a demo that redirects to non-existing url: http://localhost:8080/demo1/dist/index.html :cry:
Hi
,
Please refer to https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/dark-skin.html to setup the dark skin for Demo 1.
Regards, Sean
Hi keenthemes,
Can you please add the Quick action as off canevas as showed you above (it like in a rush, LoL) ; https://ibb.co/QMHkv8d
Thank’s for the demo6 by the way. and the Dark theme is sick guys, it’s Amazing, I’ve never thought that it would be great looking, I even start to think of giving it as a option to our project, LoL
thank you.
Can you also add, setting, Logs, .. as a off canevas, it is a great way to have much setting and parameters in such a smal place, it has a great UX way of doing things.
this is taken from the Metronic7 page.
here the example : https://ibb.co/bXr81d8
We sure can make it, but we make sure that it has to be in the proper way, like the author (keenthemes) way… we wouldn’t miss something or have an inproper html js code
Thank you,
Thank you so much guys.
Hi
,
Sure, we will consider that as well. Thanks for your feedback on this.
Regards, Sean
Thank you Sean
Hello! when I use the HTML version and I try to work it with angular, everything works fine at the beginning, but then it loads the view with lazyload and the menus don’t work, just like any window that uses data-kt-menu-trigger is this why?
Hi
,
KTMenu.createInstances('[data-kt-menu="true"]');
To init other BS components(tooltip, popover, etc) and other wrappers you will need to call:
KTApp.init();
If you need any further clarifications please let us know.
Regards, Sean
Thank you! It helped me. For other features such as displaying the password or hiding the menu, what should I initialize?
Hi
,
Glad to hear that! You can use the same method:
KTPasswordMeter.createInstances('[data-kt-password-meter="true"]')
In the next update we will update our documentation with this info.
Regards, Sean
Hello! tables doesn’t work inside modals, it doesn’t render any of the normal classes like table-striped, table-hover, table-row-bordered etc.. is this a bug?
Hi,
Thanks for your feedback.
May I know which Metronic version are you referring to ? We will add some datatable examples in Modal in a future update.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi, its’ on M8
Hi,
Can you please contact our support and provide your code ? By right the DataTable should work fine in Modal. Can you double check and confirm if the same code works fine outside modal ?
Regards, Sean
it doesnt work well outside either, this is a simple table using
class=”table table-striped”
Have you included the datatable plugin js/css bundle files in your page ? What is your Metronic version ?
yes i have included the datatables plugins bundle:
'css' => [
'plugins/global/plugins.bundle.css',
'css/style.bundle.css',
'plugins/custom/datatables/datatables.bundle.css',
],
'js' => [
'plugins/global/plugins.bundle.js',
'js/scripts.bundle.js',
'plugins/custom/datatables/datatables.bundle.js',
],
I’m using Metronic 8.0.16 Laravel, it would be great if you guys can upload a demo showing that datatable is working in your demo site with normal classes including table-striped, table-hover, table-bordered etc.. it’s weird because if I do a normal clean laravel installation and include the datatables cdn’s and do a normal test it works fine, so i don’t know why is not working
Hi
,
In our official Laravel version you can see working Datatable examples here https://preview.keenthemes.com/metronic8/laravel/log/system
Our Datatable integration fully supports the base Bootstrap table classes. Can you please try it as it’s already working in the official Laravel version.
Regards, Sean
Hello, I am using your Metronic 8.0.16 Laravel and is not working properly
Can you please update to the latest Metronic v8.0.18 ? The ajax data tables were released in the recent version.
Hello! when does the angular dark version of the demo 5 v8 come out?
Hi
,
We are working on it and it should be out soon.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi
,
Just in case if you haven’t seen it yet, we are delighted to inform you that Metronic finally has its complete dark mode version. You can check the dark mode preview here https://preview.keenthemes.com/metronic8/demo1/dark/index.html
Regards, Sean
Hi keenthemes,
Since Metronic8 is based on Bootstrap5, Are those colors available in Metronic8 as Bootstrap5 has them already in their page ????
If not,,how we can implement them,
like the way of defining yellow, and after using the yellow palette as : yellow-300
It is a great thing to have a multitude /exhaustive choices palette collor liste, not just few (8 colors).
Thank you guys
Hi
,
Thanks for your suggestion.
The Bootstrap 5’s color library is available as its’ shown in the Bootstrap 5 documentation. However our custom components are integrated only with the base theme colors(the state colors such as success, primary, danger, etc). Binding the components with more colors will increase the css size so at this point the base theme colors are optimal for our design system.
Regards, Sean
Forget the page of Bootstrap Color palette :
https://getbootstrap.com/docs/5.0/customize/color/#all-colors
thank you
Noted, we will check it
Thank you!
how can i reinit the script.bundle.js , because my element show in ajax after $(document).ready(function(){});
i need reinit data-kt-menu element, otherwise cant show the menu after click the icon
Hi
,
To initialize populated KTMenu instance you can use following API:
KTMenu.createInstances('data-kt-menu="true"');
You can init other global elements and wrappers defined here core\html\src\js\layout\app.js using:
KTApp.init();
if you need any further clarifications please do let us know.
Regards, Sean
please check this code, when i direct put in html is ok no problem, but when i dynamically use this code after $(document).ready(function(){
});
cant show the menu. how can i fix this problem
<div class="me-0">
<button class="btn btn-sm btn-icon btn-bg-light btn-active-color-primary"
data-kt-menu-trigger="click"
data-kt-menu-placement="bottom-end"
data-kt-menu-flip="top-end">
<i class="bi bi-three-dots fs-3" />
</button>
<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-bold w-200px py-3" data-kt-menu="true">
<div class="menu-item px-3">
<div class="menu-content text-muted pb-2 px-3 fs-7 text-uppercase lan-action">Action</div>
</div>
<div class="menu-item px-3">
<a href="javascript:" class="menu-link flex-stack px-3 category-edit">
<span class="lan-edit-category">Edit Category</span>
<i class="fas fa-edit ms-5 fs-7" />
</a>
</div>
<div class="menu-item px-3">
<div class="separator border-2 my-2" />
</div>
<div class="menu-item px-3">
<a href="javascript:" class="menu-link flex-stack px-3 text-danger category-delete">
<span class="lan-delete-category">Delete Category</span>
<i class="fas fa-trash ms-5 fs-7" />
</a>
</div>
</div>
</div>
Hi
,
To initialize populated KTMenu instance you can use following API:
KTMenu.createInstances('data-kt-menu="true"');
You can init other global elements and wrappers defined here core\html\src\js\layout\app.js using:
KTApp.init()
if you need any further clarifications please do let us know.
Regards, Sean
Dear Support
I am facing an issue with metronic template specially with context menu , I am trying to add two context menu , but when I do that only one is working I shared with you the Html , you can notice only the first one is working and the reset is not working, how can I make all of them working please ?
First Context Menu
<!-begin::Svg Icon | path: icons/duotone/Navigation/Angle-down.svg->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<polygon points="0 0 24 0 24 24 0 24"></polygon>
<path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="#000000" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path>
</g>
</svg>
<!-end::Svg Icon->
<!-begin::Menu->
<!-begin::Menu item->
Edit
<!-end::Menu item->
<!-begin::Menu item->
Delete
<!-end::Menu item->
<!-end::Menu->
Second Context Menu
<!-begin::Svg Icon | path: icons/duotone/Navigation/Angle-down.svg->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<polygon points="0 0 24 0 24 24 0 24"></polygon>
<path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="#000000" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path>
</g>
</svg>
<!-end::Svg Icon->
<!-begin::Menu->
<!-begin::Menu item->
Edit
<!-end::Menu item->
<!-begin::Menu item->
Delete
<!-end::Menu item->
<!-end::Menu->
Third Context Menu
<!-begin::Svg Icon | path: icons/duotone/Navigation/Angle-down.svg->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
<g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<polygon points="0 0 24 0 24 24 0 24"></polygon>
<path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z" fill="#000000" fill-rule="nonzero" transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999)"></path>
</g>
</svg>
<!-end::Svg Icon->
<!-begin::Menu->
<!-begin::Menu item->
Edit
<!-end::Menu item->
<!-begin::Menu item->
Delete
<!-end::Menu item->
<!-end::Menu->
Hi
,
Thanks for your feedback.
The provided code is not readable. Can you please contact our support via support@keenthemes.com and provide full code of your context menu and let us know your Metronic version and your build method(gulp or webpack). You can also share screenshot of your browser console if you have any js errors.
Regards, Sean