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,610 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.

Almost 2 months, and not new release. I am waiting for Laravel StarterKit fixes. Already late with my projects.

Thanks!

Hi,

The next update should be out in sever days. We have some fixed for the Laravel StarterKit. Could you please reach our core team via devs.keenthemes.com and remind which issues are you referring to ?

Appreciate your contribution!

Regards, Sean

This is the issue: https://devs.keenthemes.com/question/laravel-starterkit-authentication-error

I don’t know how to contact core team via devs.keenthemes.com

Hi,

We will try to include the fix in the next update soon.

Thanks

Hi

I was trying to use charts pie chart, I keep getting the error “Failed to create chart: can’t acquire context from the given item” in my browser console. Other charts works expect for Pie chart

Pls advise on what to do to fix this. see my code below

function getRandom(min = 1, max = 100) {
    return Math.floor(Math.random() * (max - min) + min);
}
function generateRandomData(min = 1, max = 100, count = 10) {
    var arr = [];
    for (var i = 0; i < count; i++) {
        arr.push(getRandom(min, max));
    }
    return arr;
}
var ctx = document.getElementById('skt_chartjs_3');
// Define colors
var primaryColor = KTUtil.getCssVariableValue('--kt-primary');
var dangerColor = KTUtil.getCssVariableValue('--kt-danger');
var successColor = KTUtil.getCssVariableValue('--kt-success');
var warningColor = KTUtil.getCssVariableValue('--kt-warning');
var infoColor = KTUtil.getCssVariableValue('--kt-info');
// Define fonts
var fontFamily = KTUtil.getCssVariableValue('--bs-font-sans-serif');
// Chart labels
const labels = ['January', 'February', 'March', 'April', 'May'];
// Chart data
const data = {
    labels: labels,
    datasets: [
        {
            label: 'Dataset 1',
            data: generateRandomData(1, 100, 5),
            backgroundColor: [primaryColor, dangerColor, successColor, warningColor, infoColor]
        },
    ]
};
// Chart config
const config = {
    type: 'pie',
    data: data,
    options: {
        plugins: {
            title: {
                display: false,
            }
        },
        responsive: true,
    },
    defaults:{
        global: {
            defaultFont: fontFamily
        }
    }
};
// Init ChartJS -- for more info, please visit: https://www.chartjs.org/docs/latest/
var myChart = new Chart(ctx, config);

Thanks

Hello,

Since our primary support channel at: https://devs.keenthemes.com/ , we kindly ask you to create a ticket there. You can put your code inside special tag:

<pre lang="js">
....
</pre>

We’ve been long wishing to build a bridge between us and the Keenthemes community. As the email is not the best room to support, we kindly invite you to collaborate with Keenthemes developers from everywhere on Devs Forum. 

Best regards, Sean

Hi @keenthemes Still waiting for your feedback Thanks in advance

Hi,

Noted. We will get back to you as soon as possible.

Regards, Sean

Hello,

I started project from Starter Kit for Rails 7 (bundle asset with Webpack) and activate turbo rails. Everything works fine but not with the dropdown. When click any dropdown (e.g. sidebar), it won’t expand the menus. I even tried to change ‘DOMContentLoaded’ to ‘turbolinks:load’ on any assets, but also seems doesn’t work. Is this template turbo rails friendly? Please help me solve this issue Thanks

Hello,

Since our primary support channel at: https://devs.keenthemes.com/ , we kindly ask you to create a ticket there.

We’ve been long wishing to build a bridge between us and the Keenthemes community. As the email is not the best room to support, we kindly invite you to collaborate with Keenthemes developers from everywhere on Devs Forum. 

Best regards, Sean

Horizontal form – Label

While applying horizontal form based on Bootstrap instruction

https://getbootstrap.com/docs/5.0/forms/layout/#horizontal-form-label-sizing

I realize that .col-form-label class has a different font-size from .form-label class. To be more specific, .col-form-label has font-size as “inherit” while .form-label has font-size as “1.05rem”.

If this setting comes from Metronic, not Bootstrap, could you take a look at and fix it?

Thanks

Hi Sean,

I tried to apply “col-form-label” to the label on the below link and it works

https://preview.keenthemes.com/html/metronic/docs/base/forms/controls

However, the reason is that “col-form-label” inherits from the class “fs-6” of its parents – “card-body”. In fact, if I remove “fs-6” class from the parent, the font sizes of “form-label” and “col-form-label” are different.

Thanks

Hi Sean,

I tried to apply “col-form-label” to the label on the below link and it probably works

https://preview.keenthemes.com/html/metronic/docs/base/forms/controls

However, the reason is that “col-form-label” inherits the font size of “fs-6” from its parents. In fact, if I remove “fs-6” from the parent, the font sizes of “col-form-label” and “form-label” are different.

- “form-label”: 1.05rem - “col-form-label”: 13px – inherit from html, body

Thanks

Hi,

The form label uses a custom font size variable ”$form-label-font-size” set in “core/html/src/sass/components/_variables.scss” to “1.05rem” but Bootstrap does not set the custom font size to col-form-label as does for form-label. This can be fixed by adding the below sass code into core/html/src/sass/components/forms/_labels.scss>

.col-form-label {
    @include font-size($form-label-font-size);
}

In “core/html/src/sass/components/_forms.scss” just add the new “_labels.scss” file.

We will include this fix in the next update.

Regards. Sean

Hello, I am using the Angular version and I have come across this snippet in app.module.ts. Please help me explain what it is meant to do. Thank you.

function appInitializer(authService: AuthService) {
  return () => {
    return new Promise((resolve) => {
      // @ts-ignore
      authService.getUser().subscribe().add(resolve);
    });
  };
}
</pr>

Thanks.

Hi,

This function will be called during Angular initialization to get the currently authenticated user and keep the auth token in the session.

By right, this line should be like this

authService.getUserByToken().subscribe().add(resolve);

Thanks

Hi,

We have been working on a new version of the Metronic docs to provide well-structured guides and interactive examples with vast attention to details:

Expect soon!

Regards, Sean

I need style.bundle.min.css file,Please share its .min file

Hi,

If you enquire for further assistance or have questions, we invite you to join our products community at https://devs.keenthemes.com/. There you can get assistance and guidance from KeenThemes core developers and community members. In order to get the theme support please provide us the purchase code from https://1.envato.market/EA4JP

However to build the minified assets you should use the gulp build tools as explained here: https://preview.keenthemes.com/html/metronic/docs/getting-started/setup

Regards, Sean

how to used intl-tel-input.js in Metronic8

Hi,

Metronic does not have intl-tel-input.js plugin integration. By right, if you included the plugin’s css/js files and followed the documentation it should work as expected.

If you enquire for further assistance or have questions, we invite you to join our products community at https://devs.keenthemes.com/. There you can get assistance and guidance from KeenThemes core developers and community members. 

Regards, Sean

Hello team, I would like to know if you are releasing any update soon and when would that be. I have been checking the site for weeks now just to see that the version changes from v8.1.6 before I download and apply it to the intended project. I do not want to start using this version and a new version released that will require me to start manipulating things to adopt the changes or add the new feature.changes.

Hi,

The next update will be released as soon as Bootstrap 5.3 beta arrives. We just integrated Bootstrap 5.3 Alpha and it works fine and just waiting for the beta release. You may proceed with current Metronic version and when the new update arrives you can integrate the update by globally replacing the src folder and some HTML attribute changes related to the new dark mode support in Bootstrap 5.3(Metronic so far uses its own dark mode support, after BS 5.3 it will use the new BS dark mode solution).

If you enquire for further assistance or have questions, we invite you to join our Community Support Forum. There you can get assistance and guidance from KeenThemes core developers and community members.

Regards, Sean

Hi.

I see HTML version has 40 demos but Vue or React has 8 respectively.

Is there any way to have other demos for react/vue (prebuilt)? If there is no prebuilt demo for js libs, can we build or it will take too much time?

thanks

Hi,

Porting each demo for Vue requires some time and afford. We try to release as much demos as possible in the near future. You can integrate a demo with Vue by referring to the main demo1 Vue implementation but it will depend on your expertise as well. However it’s technically doable if you have time to spend for R&D and learning the existing code of Metronic Vue demos.

For any further assistance please reach our core team via Community Support Forum.

Regards. Sean

Hi

When and What is the next update for Laravel?

Hi :),

We will account about the upcoming features for Laravel and other versions soon.

If you enquire for further assistance or have questions, we invite you to join our Community Support Forum. There you can get assistance and guidance from KeenThemes core developers and community members.

Regards, Sean

Hi Guys, for some reason mobile menu stopped working in my project, even on your site https://preview.keenthemes.com/metronic8/demo1/index.html?mode=light I can´t open the menu, any info about that? Cheers.

Hi,

Could you please try to clear your browser cache and retry? As per our test, the mobile menu works fine. If you need any further help could you please reach our support team via devs.keenthemes.com and provide more info(URL, screenshots, device, browser info, etc) for your issue?

Regards, Sean

Hi, thank you for your response, I did and now it´s working, guess some version of Chrome was bugged. Have a nice day.

Glad to hear that! All the best with your projects!

I have to buy the extended license or regular metronic8 license?I create basic used file setup but bootsrap5 icon not working

bootstrap-icons how to used

Hi,

Please note that the theme functionality does not depend on the license type.

If you have purchased Metronic you can go to https://devs.keenthemes.com/ post your question to get a support from the core team.

Regards, Seam

Yes sir,I purchased Metronic8,I not able to used intl-tel-input.js in Metronic8

Hi there :),

Please note that we have replied to this case. Thank you!

Regards, Sean

Hi! yes this message was 4 days ago, and I also replied.

Sure, shortly we will reply you accordingly.

I want to download demo, but I cannot receive the email after registering the account, so I cannot log in

Hi,

Have you checked your junk/spam folder ? Could you please contact our support via support@keenthemes.com and let us and once we know your email address we will help to active your account.

Regards. Sean

Hello, I did purchase the item but I did not get the themes below

https://preview.keenthemes.com/metronic8/demo23/index.html?mode=light https://preview.keenthemes.com/metronic8/demo7/index.html?mode=light

how can i download these templates ?

Thanks Rohit

Hi,

Thanks for your interest in Metronic.

Due to popular requests, we understand that packaging 5 frameworks with 40 demos into a single 7GB download file can be quite daunting. Therefore, as an alternative download option, we’ve decided to split our demos into individual packages for your convenience. 

Simply sign up to our official developer portal https://devs.keenthemes.com/ and head over to the Metronic demo downloads page https://devs.keenthemes.com/metronic to pick your demo. You’ll need to enter your purchase code for us to validate your purchase.

Regards, Sean

Hi, is it just me or do all the tables in the documentation look the same (unstyled)?

https://preview.keenthemes.com/html/metronic/docs/base/tables

Same on our staging site, none of the tables are having css applied.

Hi,

As we double checked the table styles look as expected. Can you try to clear your browser cache ?

If you need any further help could you please contact our core team via devs.keenthemes.com and provide a screenshot ?

Regards, Sean

Hi Does React Version have a “Sales Tracking App” Demo? and if so, does it support RLT?

Hi,

Thank you for your interest in Metronic. All available demos of the React version you can check in https://keenthemes.com/metronic under the React version demos section. The sales Tracking App at the moment is not available for React yet.

If you enquire for further assistance or have questions, we invite you to join our products community at https://devs.keenthemes.com/. There you can get assistance and guidance from KeenThemes core developers and community members. 

Regards. Sean

Hi Is there any ETA for porting demo30 (Sales tracking app) for ReactJs?

Hi,

Sorry, we can’t promise any ETA yet. However we noted on your request and we will consider it for React.

Regards, Sean

Hey together, is it possible to download the Documentation Theme? I need it for a second project.

https://preview.keenthemes.com/html/metronic/docs/index?_ga=2.174524833.28600408.1671803181-568830286.1669304060

Thanks

Dennis

Hi :),

The docs offline version is not available for downloads but we can provide it upon request. Please contact us via devs.keenthemes.com private ticket and we will send you the template offline version of the docs.

Regards. Sean

Where is old version of docs?

or should i use metronic 7 instead?

Hi,

The old Metronic v7 docs you can check here: https://keenthemes.com/metronic7/?page=docs

If you enquire for further assistance or have questions, we invite you to join our products community at https://devs.keenthemes.com/. There you can get assistance and guidance from KeenThemes core developers and community members. 

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