Discussion on Metronic | Tailwind, Bootstrap, React, Next.js, Vue, Angular, Laravel Admin Dashboard HTML Template

Discussion on Metronic | Tailwind, Bootstrap, React, Next.js, Vue, Angular, Laravel Admin Dashboard HTML Template

Cart 119,851 sales
Recently Updated
Well Documented

keenthemes supports this item

Supported

This author's response time can be up to 1 business day.

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>
aziko_

aziko_ Author Team

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!

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 :),

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-overview

Thanks, 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 :),

This link might be interesting https://www.smashingmagazine.com/2019/05/vue-js-seo-reactive-websites-search-engines-bots/

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\\./node_modules/vue-loader-v16/dist??ref-0-1:8) at Module../node_modules/vue-loader-v16/dist/templateLoader.js?\\./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\\./node_modules/cache-loader/dist/cjs.js??ref-0-0!./node_modules/vue-loader-v16/dist??ref—0-1:3)

Any ideas?

Thanks!

/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?

Stam88 Author Team

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 RTL
https://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 :),

Thanks! Can you please check it within our available widgets here https://preview.keenthemes.com/metronic8/demo1/widgets/lists.html

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

Hi :),

Sure, can you please send it via support@keenthemes.com ?

Regards, Sean

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey