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,664 sales
Recently Updated
Well Documented

keenthemes supports this item

Supported

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

12201 comments found.

Hello! I want to use demo 8 but with angular 12, to make it 100% functional I must initialize the KTs eg: KTMenu.createInstances (); KTDrawer.createInstances (); KTSticky.createInstances ();

Besides INIT (), what other object should I initialize to make the template 100% functional?

Hi,

Can you please check the Demo 1 Angular implementation from your download package ? The core app structure and initialization are almost same for all demos and the only difference is the HTML partials. After checking the demo 1 Angular if you have any questions please contact our support at support@keenthemes.com

Regards, Sean

Hi Keenthemes,

I recently updated to the latest Metronic8 ver 8.0.33, but the select2 still not render in correctly in RTL layout.

This time I even didn’t use my template, but yours (the one that I donwloaded)

Here’s what I did :

0 – Clear all the browser cache

1 – took a random page that has a select2 : apps/ecommerce/catalog/add-category.html

2 – change the html header to : <html lang="ar" dir="rtl" direction="rtl" style="direction:rtl;">

3 – change the layout to RTL :

<link href="assets/plugins/global/plugins.bundle.rtl.css" rel="stylesheet" type="text/css" /> <link href="assets/css/style.bundle.rtl.css" rel="stylesheet" type="text/css" />

4 – hard refresh on the browser : CTRL + SHIFT + RTL

And here the Metronic8 download render the same as my compiling one : https://ibb.co/WGRyv7M

It’s not even a Server Side rendering(Django template), it’s directly on your html.

any ideas ?,

Thank you.

Hi riterix,

We requires more time to investigate this issue. We will fix it and include the fix with the prebuilt assets in the zip.

Thanks

I understabd (although it was working great in Metronic7, maybe you find your answe there).

Hope it will be fixed in the next Metronic Relese.

thank you

Hi,

Sure, we are working on this now will try to finish it in the next update.

Regards, Sean

how can i download the version 7 of metronic?

Hi :),

Please send us your GitHub username and we will grant you access to the GitHub repo to download previous version.

Regards, Sean

thanks! github user: the-eikros

Hi :),

Here you https://github.com/KeenthemesHub/Metronic.

You can check v7.x version in the tags list.

Regards, Sean

Hi keenthemes,

Is there a way yo have this amazing sticky-toolbar from Metronic7 into Metronic8 ?

https://ibb.co/nz3KRH7

Did a lot’s of tries (with navs, vertical tabs, menus, ...) but at the end feels hacky …

Do you consider to integrate it in Metronic8

Since it is usefull specially when you need more than 1 button.

Please…

Thank you.

Forget about it,

I made it : https://ibb.co/pf9TSwB

with (buttons, shadow, rounded stuff, ... )

Sorry. thank you guys ;)

No probs, Looks great! :)

Thank’s

Hi, I see Metronic 8 Angular is using Bootstrap 5 and also using ng-bootstrap. But on ng-bootstrap home page, they say that ng-bootstrap is for Bootstrap 4. ng-bootstrap for Bootstrap 5 is still in beta and not included in Metronic 8. Is it OK when using ng-bootstrap for Bootstrap 4 in Bootstrap 5?

Hi,

We are using ng-bootstrap beta with bootstrap 5. Beta version should be OK to use.

Thanks

Hello! where to include AlpineJS in Metronic Laravel 8.0.33 ?

<label class=”form-check form-switch form-check-custom form-check-solid”> <input class=”form-check-input” type=”checkbox” value=””/> Without id linking </label>

how can i change the default non active color and active color ( because default color hard to see the input )

Hi,

You can globally change this by overriding the solid check option’s bg color defined in core\html\src\sass\components\_variables.scss

$form-check-input-bg-solid:                         $gray-200 !default; // Custom variable
You can try to use darken gray option:
$form-check-input-bg-solid:                         $gray-300 !default; // Custom variable

Then recompile your assets folder with updated “src” folder.

For more info about using Metronic please check the theme documentation https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started.html and video tutorials https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/video-tutorials.html

Regards, Sean, Keenthemes Inc.

can i change by add the class? like example bg-info bg-danger or some coding like this ?

Hi,

You can use the standard bootstrap color classes as shown below:

class="form-check-input h-30px w-30px bg-info" 

Regards, Sean

Hi, When I try to implement Modal it will give “Illegal invocation” error. How to fix it. Thanks

Hi,

May I know which Metronic version are you using ? This issue is related to modal attributes usage. Please have a look https://stackoverflow.com/questions/65326991/2-different-modals-on-the-same-page-throws-error or let us know if you need any further help

Regards, Sean

HI,Is there a Metronic 8 vue version in github? Can you join me? My github account: riancy7

Hi,

We have sent the invitation to our github. We will check the vue

Thanks

Using Npm will fail, yran is normal

Hi,

Could you please send the screenshot of the error when you install using npm?

Thanks

Is the Laravel version not included in the download anymore?

Hi,

Sorry for the inconvenience. We have an update today. We will include the laravel in the update by today.

Thanks

Hello there I can’t find Laravel in https://github.com/KeenthemesHub/Metronic

Hi :),

Thanks for your feedback. We will push it shortly.

Regards, Sean

Than you for the fast answer Sean.. any updates on implementing ktdatatables(server side) for laravel version (demo1) ??

Hi,

In Metronic 8 KTDatatables component is dropped and we will be used Datatables.net for Laravel CRUD solutions. Currently we have server side datatable feature with real data model: https://preview.keenthemes.com/metronic8/laravel/log/audit?demo=demo1

Regards, Sean

Hi,

It seems that the Language switcher in the User menu on React demo2 is not working and I can’t seem to find the issue. Can you suggest a fix for this?

Thank you

Hi,

The issue was caused by @popper v2.11.0 plugin update. You can use the last stable version for Metronic in package.json

”@popperjs/core”: “2.10.1”, And remove node_modules and yarn.lock files from the tools folder and rerun yarn.

We will release the official fix shortly.

Regards, Sean

Fantastic. Thank you Sean

Sure thing, you we welcome! :)

Hello,

Is there a YES/NO confirmation possible for the popovers included? ( https://preview.keenthemes.com/metronic8/demo2/documentation/base/popovers.html )

When I install an extra plugin like jquery.popconfirm.js it looks good but I don’t see the Yes/No buttons, it just goes.

Hi :),

Thanks for your interest in Metronic.

We added your request into our todo list and we will release this featire in a future update soon.

Regards, Sean

Super! Thanks!

You are welcome :)

I have been asking for over 2 years now, create a simple download selector to make it possible to download specific folders or files from the big zip. It’s not a big deal, create it as a free plugin for themeforest.net if need be.

Thank you

Sure thing, all the best with your projects :)

Hi,In react folder, i can see only typescript version of the code.

Do you have a version for ReactJS(not TS) for latest version if not can you provide the other version access on github which is nearly same as version 8 but not in Typescript? i checked in this repo(Metronic) also but i can see only TS version ,can you please give me access of without TS version if Metronic 8 or Metronic7 .

Hi,

You are welcome. Yes, v7.2.8 is the last stable version of Metronic v7.x

Regards, Sean

just to help i think import { useLocation } from “react-router”; not working anymore for version 7 we need to update it to import { NavLink, useLocation } from “react-router-dom”; to make it work.

Hi,

Thank you for your feedback.

We will check and fix this in upcoming releases.

Regards,
Lauris

Hi keenthemes.

What’s the reasons why you didn’t integrate typeahead ‘https://github.com/twitter/typeahead.js' but it was there in Metronic 7.

despite the reasons, are you gonna inlcude a library like typeahead in Metronic8, ?

since it was so hard to immitate it’s functionality using tagify or select2..

thank you.

I did notice the last update was I believe in 2015, but if it will works with Metronic8, why not ?

Since you guys have already included components based on jQuery, like select2. .......

Are you considering to include it ??? if it will break at any moment you could remove it.

thank’s Sean

Hi :),

Sure, we will try to integrate it. It’s on our to-do list now.

Regards, Sean

Thank you so much Sean.

It makes me angry, since my client bought this template they have offered some updates, especially the REACT CRUD, they have been offering that update for months and nothing that uploads it, they are asked and they do not give a date, I am really disappointing of METRONIC The year will end and they never uploaded the update, they are embarrassing to others.

Hi,

Thanks for your feedback.

We are working on the complete React CRUD solution and it’s taking time since we have to implement the datatable component for React 17 from scratch to support pagination, filtering, search, column orders, and add/edit records in modal forms or inline pages with tabbed one to many relation child datatables. This will be released as soon as we complete the CRUD solution as we designed it. Appreciate your understanding.

Regards, Sean

How to changing dynamic “max” values KTDialer ? i try with js, but does’t worked

Hi :),

Thanks for your interest in Metronic.

You can add below new API methods in “core\html\src\js\components\dialer.js” after line number 199:

    the.setMinValue = function(value) {
        the.options.min = value;
    }

    the.setMaxValue = function(value) {
        the.options.max = value;
    }
Then you can change the min and max values via these API methods as explained here: https://preview.keenthemes.com/metronic8/demo1/documentation/forms/dialer.html#methods

We will officially add these new API methods in the next update.

Regards, Sean

Select2 cannot search

Hi,

Could you please provide more info ? If you are using it inside Modal you will need to use Select2 with following option:

data-dropdown-parent="#modal_element_id" 
More info: https://preview.keenthemes.com/metronic8/demo1/documentation/forms/select2.html

Regards, Sean

Hi Keenthemes,

Could you please, please inclue also the RTL html version in this update. rather than client compiles it.

Thank you.

Thank you for the select2 I will give it a try and get back to you.

For your In-house DateTime picker that would be awsome, the state of our project is stopped because of there’n a complete working solution for DateTime picker, (our concern is working inside Modal)

Any ETA on your in house DateTime picker ?

You should put more effort on i18 support and pay attention closely to data time Format for every country.

I would love to contribute for the French, Arabic version (I already did for the Date Time format for Django/Fullcalendar even Put some PR in flatpickr githup) and some trnslations.

Also it has to work in Bootstrap modals the same way it would for a standard inline page.

thank you Sean.

Hi :),

Noted, I have saved your requirements. KTPicker maybe released early 2022. Will keep you updated and let you know when it’s available for beta testing.

Regards, Sean

Thank you sooooo much 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