12208 comments found.
Hey 
We have been working on some amazing stuff and shortly we will be releasing:
1. HTML Version:
– Duotune In-house Designed 400+ Icons.– Multiple Illustrations Support.
– Select2 Country List with Flag.
– Select2 User List with Avatar.
– Tagify Country List with Flag.
– Tagify User List with Avatar.
2. HTML Demo 5 – Support Forum:
– Dark Mode.– Layout.
– Pages.
– Questions.
– Ask Question.
– Discussion.
– UI Elements.
– 3rd Party Plugins.
– In-house Components.
– Widgets.
– Layout Builder.
– Documentation.
3. Laravel Version:
– Demo 3.– Demo 3 Dark Mode.
– Page/Route Level Config Support.
– Core Layout Improvements.
– Docs Improvements.
4. Vue Version:
– RTL Support.– Fullcalendar Plugin.
– Currency Input Mask Plugin.
– Docs Improvements.
5. React Version:
– RTL Support.– Docs Improvements.
Next Up:
1. Laravel Version:
– CRUD Solution.– 2 Steps Authentication.
– Application Settings.
– Integrated Charts.
2. More:
– Demo 10 HTML.– Demo 9 HTML.
– Demo 10 HTML.
– Demo 11 HTML.
– Demo 12 HTML.
– Demo 13 HTML.
– Demo 14 HTML.
– Demo 15 HTML.
– Demo 3 Vue.
– Demo 3 React.
– Demo 1 Angular.
– Vue CRUD Solution.
– React CRUD Solution.
Stay tuned for endless updates to empower your projects.
All updates are free, always!
Regards, Sean
Hello Team!
is it possible to have on your image input component https://preview.keenthemes.com/metronic8/demo1/documentation/forms/image-input.html
option to set width with automatic height? for example:
<div class="image-input-wrapper w-lg-350px h-auto shadow-sm" style="background-image: url('picture.png')">
so that i can preview any image in a fixed width but automatic height?
Thank you</div>
Hi
,
Sorry for the late reply.
Can you please try to use “min-h-100” class to set min-height: 100% ?
If you need any further help please do let us know.
Regards, Aziko
Hello, Any ETA for a vue+laravel version? Thanks
Hi
,
Thanks for your interest in Metronic.
At the moment we can’t confirm the ETA but we will do our best to release it as soon as possible.
In the meantime you can refer to the Vue + Laravel integration documentation here https://preview.keenthemes.com/metronic8/vue/docs/#/vue-laravel-integration
Regards, Sean
Thank, do you work already on it? Or it’s not in your near todo list? Regards
Hi
,
It’s in our todo list and we haven’t started working on it. At the moment the above documentation can provide necessary steps for Laravel + Vue integration.
Regards, Sean
Hi, how can I setup metronic 8 – laravel demo 4 as default? I know I can see demo 4 with adding this to the url:?demo=demo4 but I need to run demo 4 by default without that part in the url. I also need it to run RTL. How can that be achieved? Thanks!
Actually I found the answer. Please ignore the message. Thanks
Glad to hear that
All the best with your project!
I run into a different problem when compiling for demo 4 RTL – the menu asside icons are missing. this happened after running npm run dev—demo4
Compiled style.css files are now actually smaller by 300 kb then the original – so seems like some code has been lost when compiling
Hi,
Thank you for your feedback. We will check it further.
Did you use this command to generate RTL css?
npm run dev --demo4 --rtl
Thanks
Hi, i’m using the React Version of the Metronic 8.0.22, my Search component file is empty, could you please tell me how can i use the Search component?
Hi,
Metronic 8 React version doesn’t have solutions for search, we will include the search component in upcoming releases.
Now you can easily reuse component from our html version, everything that you need is already included in our html version, just reuse it by referring to html version codebase.
Check file: html_bootstrap5/theme/demo1/src/js/layout/search.js
Regards,
Lauris
Dears,
I watched video to change font size globally in the metronic
I have suggestion regard font size and familly, usualy rtl fonts size (e.g. hebrew or arabic) are bigger that ltr font (e.g. english) if i change font size golobly it is not good choice I think, you can add these small lines so when any body want to change font famliy or size for rtl without changing ltr
font-family: $font-family-base;
font-size: $font-size-base;
/*rtl:raw:
font-family: $font-family-base; // by default put same later if any body want to change he can change it
font-size: $font-size-base;
*/
and if there other places you think it is good use same way
Thanks
Hi
,
Thanks for your suggestion. Great workaround! We will consider adding this to the code.
Regards, Sean
it is important and will help in customization between rtl and ltr and css content property in you use arraw icons for example… hope to see this in next update and hope you can add this to team backlog
Hi
,
Some arrows are set in the HTML as icons so you can flip it in your HTML code. The arrows set in CSS can be fixed for sure. Which CSS-related arrows are you referring to? Can you please clarify this?
Regards, Sean
Hi Dear,
Thanks I understand now your point, hope you also can add the line I shared with you to next update if you see that customization for us will be better
Hi
,
Since this is a global change we will need to consider it first asthis change may not be needed for the non-RTL users. Probably we will put it under RTL Setup documentation and show a way how to set up conditional font family and size for RTL Mode. I hope for your understanding.
Regards. Sean
No new update? Last update was on August 6.
Hello,
Thanks for keeping in touch.
It is ready, however we are doing final checking. Our target is to release it on Monday with a brand new unexpected “Support Forum” demo.
Best.
Hi,
When I open the below page in mobile screen it automatically hiding the first block that contains the profile menus (profile overview, profile information, change password etc). How can I fix this issue?
https://preview.keenthemes.com/metronic/react/demo1/user-profile/profile-overviewThanks, Prince J Painadath
Hi,
Sorry for the late reply.
It is a bug and we will fix it in the upcoming releases, now as a temporary solution you can follow steps below.
1)Add offcanvas toggle button:<button class="burger-icon burger-icon-left mr-4 d-inline-block d-lg-none" id="kt_subheader_mobile_toggle" > <span /> </button>2)And initialize new off-canvas instance in your profile page:
new KTOffcanvas('kt_profile_aside', {
overlay: true,
baseClass: 'offcanvas-mobile',
toggleBy: 'kt_subheader_mobile_toggle'
});
Regards,
Lauris
Can you give me a guide on vue seo optimization pre-rendering?
Hi
,
If you need any further help with Metronic Vue please contact our support via support@keenthemes.com
Regards, Sean
Hi Sean,
I know that you said once that it is very rare that Metronic HTML code change.
Could you please tell on the Changelog page or in comments or …, if any change in the occur in Metronic Html code. Please.
it is very crusual for us.
Thank you sooooo much.
Hi
,
Noted, we will consider this in the future updates.
Regards, Sean
That’s wonderfull to hear that. Please,
Because we usualy when a new release of metronic comes out, we usualy copy all the sources to override the old one, since it is hard to track HTML changes on diff…. we take your words for granted as HTML very rare to change.
Thank you.
Hi,
Sure, we will include the core HTML changes in the changelog.
Regards, Sean
Still no update for this week, so since 14 days now (last update 6th of August)?
So there won’t be any update this week (today 14th of August, last update 6th of August) as before?
Although you announced it last week?
keenthemes 6 days ago Our next planned update will be within the next week.
Hi
,
We are preparing the new update now and it should be out in several hours.
Regards, Sean
Hi
,
Thanks for your patience. This new v8.0.23 is ready we had to reschedule to coming Monday.
Regards, Sean
Hi,
having issues when using the v8 Vue JS Demo 1 version. I just copied the files to my project, installed modules, build and run my app but I am always getting the following exception in Chrome console:
Uncaught (in promise) TypeError: Object(...) is not a function
at eval (webpack:///./src/components/widgets/tables/Widget9.vue?./node_modules/vue-loader-v16/dist/templateLoader.js??ref-5-0-1:8)
at Module../node_modules/vue-loader-v16/dist/templateLoader.js?./node_modules/vue-loader-v16/dist??ref
./node_modules/vue-loader-v16/dist/index.js?!./src/components/widgets/tables/Widget9.vue?vue&type=template&id=076baeca (13.js:23)
at webpack_require (app.js:85)
at eval (webpack:///./src/components/widgets/tables/Widget9.vue?:2)
at Module../src/components/widgets/tables/Widget9.vue?vue&type=template&id=076baeca (13.js:59)
at webpack_require (app.js:85)
at eval (webpack:///./src/components/widgets/tables/Widget9.vue?:2)
at Module../src/components/widgets/tables/Widget9.vue (13.js:35)
at webpack_require (app.js:85)
at eval (webpack:///./src/views/Dashboard.vue?./node_modules/cache-loader/dist/cjs.js??ref-
13-0-0-0!./node_modules/vue-loader-v16/dist??ref—0-1:3)./node_modules/cache-loader/dist/cjs.js??ref
Any ideas?
Thanks!
/Michaël
Hi,
It is a bug and we already fixed it, fix will be available within the next Metronic v8.0.23 release, we are planning releases for today.
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,
using the temp fix its working thanks.
Once more question, I am using the Vue JS version but now I see that not everything is available on the Vue JS framework? Like multiple toolbars on the HTML, other apps, ...
Any idea when all of this will be on the Vue framework available?
Because I won’t be using the header menu but instead I want the page title and breadcrumb over there.
On some pages then I will be using the toolbar using buttons and icons like toolbar 3 on the HTML version but its not included in Vue JS.
Thanks!
Regards, Michaël
Hi,
Yes currently our vue version doesn’t contain all html version features, but we are working on the integration of new plugins and functionality, we will be including them gradually. Actually, you can reuse any functionality from our html version in vue by referring to the html version codebase.
Let me know if you will need any guidance.
Regards,
Lauris
Hi,
thanks for your response, will do that!
I have another issue in the Vue tables widget. When I add a column with a button menu dropdown it doesn’t open the menu when on click.
Code:
<button class=”btn btn-sm btn-light btn-active-light-primary” data-kt-menu-trigger=”click” data-kt-menu-placement=”bottom-end” data-kt-menu-flip=”top-end” > Actions <inline-svg src=”media/icons/duotone/Navigation/Angle-down.svg” /> </button> View Delete
Any idea?
Thanks!
Regards, Michaël
You should reinitialize your menu component in widget mounted function.
Import component:
import { MenuComponent } from "@/assets/ts/components/MenuComponent";
Reinitialize instances:
onMounted(() => {
MenuComponent.reinitialization();
});
Regards,
Lauris
Hmmm tried but didn’t work. Still no menu shown, also no errors in console.
Regards, Michaël
I think it has to do with the dynamic table module where I use an async function to retrieve the data from our API. So during onMount no elements have been added so nothing to reinit in the MenuComponent.
I tried to call this method in the ’.then()’ callback of the api after I set the data on the reactive property but doesn’t work either.
Each row of the table has its own dropdown button and menu to be reinit.
Any ideas?
Thanks!
Regards, Michaël
Hi,
solved it by wrapping the reinit in a settimeout for now, don’t know if this is the correct solution, but now after the API call inside the ‘then()’ function I applied following code:
setTimeout(() => { MenuComponent.reinitialization(); }, 0);
and now it renders the menu.
Regards, Michaël
Hi,
Thanks for your feedback.
Yes, solution setTimeout is acceptable.
Can you please specify which table widget are you using?
Regards,
Lauris
Hi,
using the Table Widget 9 from the Vue template.
Regards, Michaël
In our preview page all table widget menus are working fine.
Looks like you might have problems then use widgets on other pages, the menu reinitialization on your page should help.
Regards,
Lauris
Hi Keenthemes.
Hope Vertical bootstrap tabs will be released in the next update.
thank you
Hi
,
Thanks for reminding this. We will try to release this and other features that you requested in the next week’s update.
Regards, Sean
Ah yeah, also Ajax datatables.net and filtering options as you go, 
Thank you sean.
Hi
,
Sure, so many features are in the works so hopefully we will implement this one soon as well.
Regards, Sean
I’m really looking forward for getting Metronic 8 for angular 12 as well, please release it next week because it kinda got delayed a lot and a lot of peoples are waiting for it.
Hi
,
Thanks for your interest in Metronic.
We are preparing it for release now and hopefully it will be out within the next week.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
When do you plan to share the Metronic 8 Demo 1 Angular 12 version? It’s a bit important to me 
Hi
,
Thanks for your interest in Metronic.
We are preparing it for release and hopefully it will be out within the next week and you can get it for free.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Components from the Material-UI will be available in React METRONIC 8?
Hi majcoo96,
You can use MUI (https://material-ui.com/) with React Metronic 8, but our Layout is based on Bootstrap and we don’t have a plan move from Bootstrap to MUI.
Regards, Keenthemes support
Hi i am using metronic 8 laravel version (RTL) using webpack i have problem in RTL with select2 the (after i activate RTL it’s have css problem) is there any way skip this plugin from RTL because it has own RTL support is webpack have any option todo this like gulp “compile”: { “rtl”: { “enabled”: false, “skip”: [ “select2”, “line-awesome”, “fontawesome5”, “nouislider”, “tinymce”, “sweetalert2” ] } } or there are another way to fix this and i miss something i see in online demos you fix it
Hi,
For the RTL, we use this plugin. In their docs, you can use comment in scss as directive to ignore RTLhttps://rtlcss.com/learn/usage-guide/control-directives/index.html
In this scss file, could you please try to edit
resources/assets/core/plugins/plugins.scss
/*rtl:begin:ignore*/ @import "~select2/dist/css/select2.css"; /*rtl:end:ignore*/
Thanks
hi thanks for your help but i tried it and it’s not working
Hi,
At the moment, we could not find solution for this issue. We will find a way to exclude select2 from RTL process.
Thanks
hi
please add sample folder for html called basic_sample contains only required files without any additional third party and one page only as basic startup
and later i will add any needed files or plugin need hope you consider this request
Hi
,
Thanks for your feedback. We will consider this in the next update.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
hi i’m using metronic 7
can you add more breadcrumber separators to metronic theme like less than icon or arrow and also support rtl and ltr for these icons
if i want to do that how can i do that?
Hi
,
Thanks for your feedback. We will consider in the next update. You can refer to “Without Separator” example and add icons within the items https://preview.keenthemes.com/metronic8/demo1/documentation/base/breadcrumb.html
Regards, Sean
Hi guys,
amazing theme congratz!
One question, I see on the image with all the tiles a green sales summary tile with Your balance and then a list of sales, revenue, growth, dispute. I want to see a preview of that but can’t find it on the demos.
Can you point me into the right direction?
Thanks!
Regards, Michaël
Hi
,
If you need any further clarifications please do let us know.
Stay tuned for updates via https://twitter.com/keenthemes and https://www.instagram.com/keenthemes
Regards, Sean
Hi Sean,
its not there I already looked at that place. Its hard to share a screenshot of the tile I am talking about. Maybe I can sent you it by mail so its clear for you about which one I am talking about?
Thanks!
Regards, Michaël