12208 comments found.
Hi,
Please will you add KTDatatable support for Metronic 8 ?
I’m talking about Metronic custom plugin not Datatable.net
Hi
,
Thanks for your interest in Metronic.
Please note that KTDatatable will not be added into Metronic 8. Instead, we will be using DataTables.net plugin as the primary data table solution. For more info please check the plugin integration documentation here https://preview.keenthemes.com/metronic8/demo1/documentation/general/datatables/overview.htmlRegards, Sean
Hey,
when running npm install with demo 1 from the vue version I get this error:
npm ERR! code ERESOLE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: demo1@8.0.22
npm ERR! Found: vuex@4.0.2
npm ERR! node_modules/vuex
npm ERR! vuex@”4.0.0” from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vuex@”3” from vuex-module-decorators@1.0.1
npm ERR! node_modules/vuex-module-decorators
npm ERR! dev vuex-module-decorators@”1.0.1” from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with—force, or—legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution. any fix ?
Hi,
It is a bug and we already fixed it, fix will be available within the next Metronic v8.0.23 release.
As a temporary solution you can follow the steps below:
1)Delete node_modules folder and package-lock.json.
2)Run yarn command to install dependencies.
3)Run yarn serve to run the project.
If you need a fix urgently please send your email address to our support email support@keenthemes.com I will share with you the latest version with all the latest fixes.
Regards,
Lauris
Hi , Metronic\vue3_bootstrap5\demo7 template After installing npm packages, when I run serve There is a missing dependency
import { headerFixed, headerFixedOnMobile } from ”../../../../demo2/src/core/helpers/config”;
ERROR in ../demo2/src/core/helpers/config.ts:1:26
TS2307: Cannot find module ‘vue’ or its corresponding type declarations. > 1 | import { computed } from “vue”;
| ^^^
2 | import store from "@/store/index";
Hi,
It is a bug and we already fixed it, fix will be available within the next Metronic v8.0.23 release.
As a temporary solution you can follow the steps below:
1)Delete node_modules folder and package-lock.json.
2)Run yarn command to install dependencies.
3)Run yarn serve to run the project.
If you need a fix urgently please send your email address to our support email support@keenthemes.com I will share with you the latest version with all the latest fixes.
Regards,
Lauris
Greetings,
We are looking into purchasing an admin theme for use on our own projects and this looks a suitable candidate, we do have a question though about package/library management.
How do you currently handle package/library versions? Do you have to do a new release with updated packages (everything is already packaged up) or are we able to control updating packages through npm/yarn ourselves?
If it is release based, what does your lifecycle look like in respect to that?
One of the important things we need to be able to do is to keep packages up to date, in respect of vulnerabilities packages may have from time to time.
Thank you
Hi
,
Thanks for your interest in Metronic.
Metronic comes with npm/yarn package files and it’s own build tools that allows you to install all packages by yourself via yarn/npm and build the assets with gulp or webpack builders.
We keep the packages up to date with our weekly product updates by managing all the used package updates and patches. Some packages requires certain integration work so in package.json we manage the package versioning as well.
The update process is quite straightforward where you just need to reinstall the packages, and rerun the build tools after replacing the theme’s core folders(tools and src) from the latest version.
If you need any further clarifications please do let us know.
Regards, Sean
That’s great, thank you.
After looking at the docs a little more. We can take the theme and customize it to our needs, quite a bit, from the looks of it:
- Styling
- Removing unnecessary plugins (if we wanted to)
- Adding new npm packages we may need or want to use
All of this then fits into the build steps that you provide. The only thing we then need to be careful of is fitting updates around any changes that we make, I assume?
Apart from your custom plugins, which understandably will be managed within the template themselves. Which we would have to update when you release.
If there is anything I have understood incorrectly, please do let me know
I think that gives me enough information to go away with and talk to my team. Our aim, if we purchase, is to fit the HTML version of this into a .NET core MVC project and having all the build tools setup, as they are, should work well
Thank you for the quick response
Hi
,
Yes, we are on the same page. The only thing to mention that when it comes to HTML code fixes integration you can use code differ tools to find the breaking changes in the html code(if any) that happens quite rare in our updates. Anyways you can always contact via our support support@keenthemes.com for further assistance.
All the best with your projects!
Regards, Sean
Hi, I need to work with metronic 8 – demo 6 for Laravel. is there an ETA on that demo? Thanks, greatly appreciate it!
Hi
,
Thanks for your interest in Metronic.
At the moment we can’t confirm the ETA. Probably It can be out within 1-3 weeks. But we will do our best to speed those pending demos.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi,
I would like to ask if you plan to upgrade the Vue version compatibility so the v3.2 features, such as <script setup> can be used within the theme?
Thanks for the fantastic work and continuous updates!
Hi,
We already use Vue 3 in Metronic 8, you can check the preview here: https://preview.keenthemes.com/metronic8/vue/demo1/#/dashboardRegards,
Lauris
Hi Lauris,
Yes, but for some reason when I import a Test.vue file containing the following example code into a parent component, it does not render the {{ color }} value nor the style. I thought this might be a compatibility issue, but please let me know if I’m missing something, I am quite new to vue.
Test.vue:
<script setup> import { ref } from ‘vue’; const color = ref(‘red’); </script>
<template> <button @click=”color = color === ‘red’ ? ‘green’ : ‘red’”> Color is: {{ color }} </button> </template>
<style scoped> button { color: v-bind(color); } </style>
Thank you!
Hi,
I think that your issue is in the styles section, you can’t use js variables in the styles section, but you can achieve the same result with style attribute binding.
Check the example below.
<script setup>
import { ref } from "vue";
const color = ref("red");
</script>
<template>
<button @click="color = color === 'red' ? 'green' : 'red'" :style="`color: ${color}`">
Color is: {{ color }}
</button>
</template>
Regards,
Lauris
Hi Lauris,
Thanks for the suggestions. Unfortunately the code still doesn’t work, even without the style section.
By the way, the example code I shared was taken from the official Vue site (blog.vuejs.org/posts/vue-3.2.html).
What could be the issue?
Can you please specify which version of Metronic are you using?
Regards,
Lauris
The latest, v8.0.22
Hi,
Yes, your version of the code requires Vue v3.2, we will take a look at this version and update it in upcoming releases.
If you are using the latest version of Metronic then my example should be working.
Did you have any errors in your browser console?
Regards,
Lauris
Hi Lauris,
That’s fantastic, thanks for looking into the update.
Unfortunately your example still doesn’t work. I get the button on the page with the text ‘Color is:’ but no value is shown. There are no errors in the console either.
Hi,
Can you try example with standard component structure?
<template>
<button
@click="color = color === 'red' ? 'green' : 'red'"
:style="`color: ${color}`"
>
Color is: {{ color }}
</button>
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";
export default defineComponent({
name: "test",
components: {},
setup() {
const color = ref("red");
return {
color,
};
},
});
</script>
Regards,
Lauris
Hi Lauris,
Yes, this works beautifully. I only encounter the problem when <script setup> tag is used.
I did some tests and it seems that on production, after running ‘yarn run build’ it is working as expected, but not when developing and running on localhost with ‘yarn serve’.
Hi,
Thank you for you feedback. We will check it, probably it is related to the vue version only.
Regards,
Lauris
Hi Lauris,
Thanks for your support. I will wait and try again with the updated Vue 3.2 version when it comes out.
Best wishes
Hi,
Glad to hear that. All the best with your project!
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards,
Lauris
When do you plan to share Metronic 8 Demo 3 Laravel version? It’s a little bit important for me 
Hi
,
Thanks for your interest in Metronic. We will try to release it in the following update within 1-2 weeks.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
so glad to hear that. metronic is the revolution on admin interfaces. actually, you are a biggest library for web development
thanks for that.
You are most welcome and Thanks too! We are doing our best and more amazing updates are in the work. 
Hello . Will I be able to get html js and css without using the builder
Hi
,
Thanks for your interest in Metronic.
Yes, Metronic package contains precompiled js/css files that include all core features of the theme and you can launch the templates without package installation and running the build tools. However to customize the theme further you will need to use the build tools for sass compilation and css/js code minification.
If you need any further clarifications please do let us know.
Regards, Sean
So there won’t be any update this week (today 14th of August, last update 6th of August) as before?
Hi
,
Our next planned update will be within the next week.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi keenthemes,
I’m using tiny jQuery third pary script to do stuff in forms
I got this error in custom page
Uncaught ReferenceError: jQuery is not defined
<anonymous> jQuery
My question is since jQuery is already bundled with Metronic, how to initialize it again or call it in my page ?
sorry and thank you guys
Hi,
jQuery is actually included with the bundle but it seems you can calling it somewhere else when it’s not initialized and present.
Regards, Sean
Hi Sean,
Thank’s for the reply, appreciate it, (been on it now 11 hours, no sleep)
didn’t understand much you saying, sorry, In english Please, LoL ???? :
but how can get rid of that error, how can I call jQuery again as you said (you can calling it somewhere else when it’s not initialized and present.) ?
here’s my js inline js declaration :
<from>
....
....
</form>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" crossorigin="anonymous"></script>
<script src="{% static 'custom/js/formset/jquery.formset-1.5.js' %}"></script>
<script type="text/javascript">
$('.formset_row').formset({
addText: 'add family member',
deleteText: 'Reemove',
prefix: 'prescriptiondetail'
});
</script>
if I comment the first line, it abviously doesn’t find jquery and cause the error, but how to call it intead link it from the net as I did in the first line. ???
The form lib repeater for django is named “jquery.formset-1.5.js”
thank you
You will need to check what causes this error and when that code or plugin initialize jquery seems not fully loaded yet. It’s similar situation when you called some JS custom code before all the js bundle initialization.
You Rock Sean !
Thank you, I found it, you used the word magic word of ‘before’ and it hits me hard.
here : ” It’s similar situation when you called some JS custom code before all the js bundle initialization.”
Thank you soooooooo much.
Sorry for bugging you guys.
Great! Glad to help you out
If you need any further help please do let us know.
Hi keenthemes,
I tried to reuse your code for form/field repeater on Create Invoice https://preview.keenthemes.com/metronic8/demo1/apps/invoices/create.html but without luck, LoL
And then searched and landed on Metronic 7 form repeater https://preview.keenthemes.com/metronic/demo1/crud/forms/widgets/form-repeater.html
It will be an amazing feature that should be integrated in Metronic 8 as soon as posible, specially if it will be no jQuery dependency. Vanilla Javascript.
thank you.
Hi
,
We will consider adding it. Unfortunately it’s a jquery plugin https://github.com/DubFriend/jquery.repeater. The one we implemented for the invoice is a custom solution and you can try to reuse it.
Regards, Sean
Hello, i have a question, i am using angular version, there is any way to use rtl and ltr in the same time, one click to switch to rtl and another click to switch to ltr
Hi, ibrahimalsurkhi.
We don’t have an example of runtime switcher between ltr/rtl versions.
Regards, Keenthemes support
When approx. is the next update for the Laravel version planned? Waiting for the CRUD, 2nd factor etc. features before starting my project. Also can we expect the Laravel + Vue version in the next update?
Hi
,
Thanks for your interest in Metronic!
At the moment we can’t give ETA yet, We are working on these features and try to deliver them as soon as possible in upcoming updates.
Regards, Sean
hi keenthemes,
I’ve been doing some ajax request, to populate a inside drawer, the content of that drawer has a sub menu, that you are using in list and all card toolbar.
But they are not displaying, since it is an ajax, I tried “KTApp.init();” but didn’t work (worked for Tooltips sure, but not Menu).
Anyway to Re-init those https://ibb.co/gysPGpx Menu. ?
thank you.
Hi
,
If you are using the latest version of Metronic you can re-init all in-house components using their API:
KTMenu.createInstances();
For previous versions:
KTMenu.createInstances('[data-kt-menu="true"]');
Other “data-kt-*” components can be re-inited the same way. For more info please check the docs:
https://preview.keenthemes.com/metronic8/demo1/documentation/general/menu.html#methods https://preview.keenthemes.com/metronic8/demo1/documentation/general/drawer.html#methodsRegards, Sean
KTMenu.createInstances(); worked well
, thank you,
I didn’t know about that page of Doc. LoL
I usualy select the doc subject from the left menu (aside), and go from there. but as I see, in my 8.0.18 there’s no Menu entry in doc left menu for KT-Menu (but in live Metronic it is).
SORRY GUYS MY BAD.
We plan to upgrade to the latest Metronic, once the “Vertical Tabs” are released, because it big huge improvement for us, since we use them a lot.
Amazing, we hoocked the Toastr witht the app, (thank you guys it’s working) 
thank you
Wating for Toastr animations,
thank you
Hi
,
Great! You can check the online docs since it’s for the most up to date version. Sure, we will check it further on the Toastr animation.
Regards, Sean
Please, add the Inbox template
Hi
,
Thanks for your interest in Metronic.
Yes, we are working on improved version of Inbox app and it will be added soon.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Like others have commented, I also get Object(...) is not a function error. I am trying to build demo1 of the vue3 version. It builds without any fatal errors (just a lot of deprecated warnings!). But then on load, the page is blank with the above error.
I’m using: npm v6.14.14 node v14.17.5
There is also conflicting advice between the docs and readme files: docs suggest using npm, readmes suggest yarn. Given it’s vue3 – I’m trying to get npm to work?
Please advise.
Sorry just to add, this is for Metronic 8
Hi,
Vue app should work with both npm and yarn managers.
Currently, we have an issue with vue then you run the app using npm, we will fix it in the upcoming release.
Now to get started with Metronic 8 Vue app use yarn package manager.
yarn yarn serve
Regards,
Lauris
Hello. Hope you good and healthy Excuse me RTL assets not include in demo1 “metronic_v8.0.22” Is it same In other demo “RTL assets” ?
Hi
,
Thanks for your interest in Metronic.
The RTL version assets are generated using the build tools as explained here https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/rtl.htmlIf you need any further clarifications please do let us know.
Regards, Sean
Thank you for your answer
my project build with “codeigniter php framework”
files “plugins.bundle.rtl.css & style.bundle.rtl.css” or “RTL Dark CSS” aren’t in assets folder or can generate It was in before “8.0.22” update
Hi,
We will include those missing precompiled rtl/dark mode css in the next update in 1-2 days.
In the meantime, you can generate them by referring to https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/rtl.html https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/dark-mode.htmlRegards, Sean
Hi!
I’m looking in Metronic 8 demo and I miss the “Forms” pages with examples for multiple input types.This is a backend template and should have more example of forms and upload inputs.
I like that you have created some more “realistic” pages, but it’s also useful more generic pages likes this in metronic 7 https://preview.keenthemes.com/metronic/demo1/crud/forms/controls/base.html
+1 from here
Best regards!
Hi FreelancerCGN,
Thanks for your interest in Metronic.
At the moment we are working on Angular version but can not confirm the ETA yet. We will do our best to release it ASAP.
Please follow us on https://twitter.com/keenthemes to get the latest news.
Hello, anything new on Metronic 8 for Angular? I really need it
Hi LiveDigi,
Thanks for your interest in Metronic.
At the moment we are working on Angular version but can not confirm the ETA yet. We will do our best to release it ASAP.
Please follow us on https://twitter.com/keenthemes to get the latest news.
Hi keenthemes
Is there any chance to have “bootstrap vertical tabs” in the next update ?
Thank you.
Hi
,
Yes, sure. We will try to include it in the next update within the next week.
Regards, Sean
Hi Sean thank you,
Froget about the Toastr also.
Thank you so much.
Hi
,
Regards, Sean
Waiting for a real example in Metronic pages, not documentation,
The last time I checked documentation, i was little confuse how to implement it as the page shows (on page load) and since Javascript is not my strength point and fair of not doing it the proper way, well …
Sorry.
Played little with it, and noticed even if there’s hide and show animation initialized, but the Toastr doesn’t animate when showing and hidding (fadein, fadeout) !!..
Thank you
Hi,
We will add more examples in the apps and pages. You can check out some examples here https://preview.keenthemes.com/metronic8/demo1/layout-builder.html
We will check the animation issue. Thanks for your feedback on this.
Regards, Sean