12202 comments found.
When will angular demos added to metronic 8?
Hi 
,
We are working on it with a high priority and we will do our best to release it as soon as possible(hard to confirm ETA yet) with lots of enhancement, such as, performance improvements, typescript support, layout optimizations, ready to use AUTH flow implementation with real REST API, native core plugins, etc.
Please follow us at http://twitter.com/keenthemes to stay updated.
Regards, Sean
where is blazor documentation available?
Hi ,
Regards, Sean
thanks
You are welcome
Hi, i just downloaded 7.2.7 version on MacOS. However, I got errors while running npm install. My environment: macOS 11.3 node 16.0.0 npm 7.10.0
Errors:
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: @babel/core@7.6.0
npm ERR! node_modules/@babel/core
npm ERR! babel/core“7.6.0” from react-scripts@3.2.0
npm ERR! node_modules/react-scripts
npm ERR! react-scripts@”3.2.0” from the root project
npm ERR! babel/core“7.4.5” from @svgr/webpack@4.3.2
npm ERR! node_modules/@svgr/webpack
npm ERR! svgr/webpack“4.3.2” from react-scripts@3.2.0
npm ERR! node_modules/react-scripts
npm ERR! react-scripts@”3.2.0” from the root project
npm ERR! 8 more (babel-jest, babel-loader, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer babel/core“7.13.0” from @babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining@7.13.12
npm ERR! node_modules/@babel/preset-env/node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining
npm ERR! babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining“7.13.12” from @babel/preset-env@7.14.0
npm ERR! node_modules/@babel/preset-env
npm ERR! babel/preset-env“7.4.5” from @svgr/webpack@4.3.2
npm ERR! node_modules/@svgr/webpack
npm ERR! svgr/webpack“4.3.2” from react-scripts@3.2.0
npm ERR! node_modules/react-scripts
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.
Hi eastasia,
Please follow the instruction: https://keenthemes.com/metronic/?page=docs§ion=react-quick-start (We use RTL version of NodeJS)
You can use NVM if don’t want to downgrade your nodejs version https://github.com/nvm-sh/nvm
Regards, Keenthemes support
Hello when will the Roles feature update happen?
Hi
We are planning to release the complete User Manager app within the next week with following features:
Enterprise Ready User Management App: – Complete users CRUD. – User creation/update forms with Modal. – User login history. – User activity logs. – User security settings(password change, 2-steps authentication). – Assign user roles and permissions. – User roles CRUD. – User permissions CRUD.
Stay tuned for updates via https://twitter.com/keenthemes
Regards, Sean
> metronic@8.0.4 build > webpack
[webpack-cli] Failed to load ‘D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\webpack.config.js’ config [webpack-cli] ReferenceError: require is not defined at file:///D:/Themes/Metronic/metronic_v8.0.4/html_bootstrap5/theme/tools/webpack.config.js:1:17 at ModuleJob.run (internal/modules/esm/module_job.js:152:23) at async Loader.import (internal/modules/esm/loader.js:166:24) at async loadConfig (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:1346:35) at async WebpackCLI.resolveConfig (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:1454:38) at async WebpackCLI.createCompiler (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:1839:22) at async WebpackCLI.buildCommand (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:1954:20) at async Command.<anonymous> (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:735:25) at async Promise.all (index 1) at async Command.<anonymous> (D:\Themes\Metronic\metronic_v8.0.4\html_bootstrap5\theme\tools\node_modules\webpack-cli\lib\webpack-cli.js:1284:13)
Hi,
Note on the package.jsonfile. This step is very important for Webpack in Metronic template. The default package.jsonworks for Gulp. To make it work for Webpack, you have to modify tools/package.json and remove “type”: “module”.
For more information, please check the documentation.
https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/build/webpack.htmlthanks
Many thanx XD
Feel free to let us know if you need more help.
Thanks ☺️
Could you please guide me through the best front layout separation structure using Laravel, vue-router and vuex? Each area can be separated from the front by combining the label and the view. I’m wondering if the header footer is designed to only change the content body side when using blade and most laralve and vue together. Do you use vue separately for header and footer? Please guide me through the best mvc patterns. Thank you.
Hi,
Sorry for the late reply.
It depends on your requirements. You can check our Laravel and Vue integration doc, it should help you to get started with a basic Metronic Larvel+Vue application.
Regards,
Lauris
Hi,
1. The first thing to do is to learn the file structure of the theme. You can check in the documentation for file structure: https://preview.keenthemes.com/metronic8/demo1/documentation/getting-started/file-structure.html You can go to the index.html template and check the CSS and js includes in the template head and foot. Once you fully understand what are the CSS and js files to include in each page of your application the rest will be quite easy.
2. You can use the layout builder to prepare your HTML template. For example, if you are using the demo1 you can go to the online preview of the demo: https://preview.keenthemes.com/metronic8/demo1/layout-builder.htmlThe layout builder helps you to configure the layout with available options and preview in real-time. Once you decide what configuration you like to use you can download the HTML code of your preferred configuration. To do so go to the bottom of the page and find the “Export” button and you will get a package containing the HTML template and with the partials(header, aside, footer, etc) that can be used for your server-side integration. The export package provides you with only the HTML code with structured includable partials for server-side integration. The assets can be included from your local download version.
3. Once you integrated the master layout and all the menus and navigation you can proceed with your inner pages by referring to the original theme demos.
4. Also as the main reference to the available features, you can refer to the demo pages source code for each feature.
If you need any further help, please let us know.
Thanks
For Metronic v8.0.4: In case anyone is looking for the best way to process a login with the SweetAlert2 and Validator using Javascript, PHP, AJAX, and MySQL. Here’s my script. USE AT YOUR OWN RISK!
assets/js/custom/authentication/sign-in/general.js
// Handle form submit
submitButton.addEventListener('click', function (e) {
// Prevent button default action
e.preventDefault();
// Validate form
validator.validate().then(function (status) {
if (status == 'Valid') {
// Show loading indication
submitButton.setAttribute('data-kt-indicator', 'on');
// Disable button to avoid multiple click
submitButton.disabled = true;
// Simulate ajax request
setTimeout(function(){
form = $(form);
$.ajax({
type: "POST",
url: "php/processlogin.php",
data: form.serialize(),
dataType: "json",
beforeSend: function () {
$('.alert-error,.alert-success').hide();
},
error: function (jqXHR, textStatus, errorThrown) {
alert('UNEXPECTED ERROR THROWN ' + errorThrown);
$('.alert-error').show();
$('.alert-error span').html(errorThrown);
},
success: function (data) {
if (data['returncode'] == 1) {
// Hide loading indication
submitButton.removeAttribute('data-kt-indicator');
// Enable button
submitButton.disabled = false;
// Show message popup. For more info check the plugin's official documentation: https://sweetalert2.github.io/
let timerInterval
Swal.fire({
text: "You have successfully logged in!",
icon: "success",
timer: 2000, //wait two seconds before redirecting
timerProgressBar: true,
didOpen: () => {
Swal.showLoading()
timerInterval = setInterval(() => {
const content = Swal.getContent()
if (content) {
const b = content.querySelector('b')
if (b) {
b.textContent = Swal.getTimerLeft()
}
}
}, 100)
},
willClose: () => {
clearInterval(timerInterval)
}
}).then((result) => {
if (result.dismiss === Swal.DismissReason.timer) {
window.location.href = 'index.html'; //redirect here on successful login
}
})
} else {
// Hide loading indication
submitButton.removeAttribute('data-kt-indicator');
// Enable button
submitButton.disabled = false;
document.querySelector('[name="username"]').value = "";
document.querySelector('[name="password"]').value = "";
Swal.fire({
text: "Invalid Username or Password!",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-danger"
}
}).then((result) => {
if (result.isConfirmed) {
}
})
}
}
});
return true;
}, 2000);
} else {
Swal.fire({
text: "Sorry, looks like there are some errors detected, please try again.",
icon: "error",
buttonsStyling: false,
confirmButtonText: "Ok, got it!",
customClass: {
confirmButton: "btn btn-primary"
}
});
}
});
});
php/processlogin.php
<?php
session_start();
header('Content-type: application/json');
$username = trim($_POST['username']);
$password = trim($_POST['password']);
// database Connection variables
define('HOST', 'localhost');
define('USER', 'your-username');
define('PASSWORD', 'your-password');
define('DATABASE', 'your-db');
function DB()
{
try {
$db = new PDO('mysql:host='.HOST.';dbname='.DATABASE.'', USER, PASSWORD);
return $db;
} catch (PDOException $e) {
return "Error!: " . $e->getMessage();
die();
}
}
class AuthLib
{
public function Login($username, $password)
{
try {
$db = DB();
$query = $db->prepare("SELECT user_id FROM admin_users WHERE (username=:username OR email=:username) AND password=:password");
$query->bindParam("username", $username, PDO::PARAM_STR);
$enc_password = hash('sha256', $password);
$query->bindParam("password", $enc_password, PDO::PARAM_STR);
$query->execute();
if ($query->rowCount() > 0) {
return $query->fetchAll();
} else {
return false;
}
} catch (PDOException $e) {
exit($e->getMessage());
}
}
}
$app = new AuthLib();
$user_id = $app->Login($username, $password); // check user login
$response_array['returncode'] = 0;
if($user_id > 0)
{
foreach($user_id as $row){
$user_id = $row['user_id'];
}
$response_array['returncode'] = 1;
// Set Session
$_SESSION['user_id'] = $user_id;
}
else
{
$response_array['returncode'] = 0;
}
echo json_encode($response_array);
?>
Thanks for sharing this
Hi,
any ETA for the React version of Metronic 8?
Hi ,
We are working on it with a high priority and we will do our best to release it as soon as possible(hard to confirm the ETA at the moment) with lots of enhancement, such as, performance improvements, typescript support, layout optimizations, ready to use AUTH flow implementation with real REST API, native core plugins, etc.
Please follow us at http://twitter.com/keenthemes to stay updated.
Regards, Sean
Hi metronic v8 rtl version has many issues please check demo for e.g. topbar menu and arrows in main menu
also when datatables and other plugin will be available?
last question is v7 support is end will be there updates for v7?
Hi ,
Thanks for your feedback.
Metronic v7 is still supported and continued for sure. We will provide improvements and bug fix updates for v7 while we also continue making v8 complete.
We will check it and provide necessary fixes and improvements in the next update within the next week.
All available plugins/components you can check under the https://preview.keenthemes.com/metronic8/demo1/documentation/general/datatables/overview.html
We will add other pending plugins with Bootstrap 5 support soon.
Regards, Sean
Great Pricing Plan guys, thank you, but if you can make the middle one “Advanced” little dark or with an appealing color to deferential it from the other 2.
When will these be availlable : - Forms input-groups and Icons inside them - Icons - Avatar list - Callendar
and specially the demo6
Thank you guys.
Hi ,
Noted, we will consider revising the pricing. Also more form snippets, plugins will be added soon. The fullcalendar v5 integration will be part of the upcoming new update.
Regards, Sean
hello, I am currently using the metronic 7.2.7 html demo 1 version, my question is can I upgrade to version 8 without problems? since I use plugins like datatable, select2, chartjs, etc … or I must hope that the 7.2.8 versions appear
Thank you so much
Hi,
Thanks for your feedback.
Metronic v8 and Metronic v7 has breaking changes so the update process requires a full code revision. Metronic 7 uses Bootstrap 4 while Metronic v8 uses Bootstrap 5 so the changes are major between these versions. You may just reintegrate your code with Metronic v8 and the overall code structure and classes should be quite similar. If you need any further clarifications please contact our support via support@keenthemes.com
Regards, Sean
thanks
I really like the current frequency of the updates.
Keep on rolling!
Thanks a lot!
Hi ,
Yes, we are exited! With our new core framework we can release literally limitless pages, apps, sninippets without even increasing the theme’s css/js bundle size.
Stay tuned for updates via https://twitter.com/keenthemes
Regards, Sean
When can we expect new components for Metronic 8? Currently v7 has far more of them, and some are really helpful, so it would be nice to see them in v8…
Hi ,
Thanks for your feedback.
We are working on it with a high priority. We will add all those important plugins(fullcalendar, dropzone, pickers…) in the following updates. Some plugins are not Bootstrap 4 ready yet so we have to find alternatives or write our own .
In a few weeks with our regular updates we will make Metronic 8 more complete. Also Laravel, React, Vue, Angular versions and other demos will be released as well.
Regards, Sean
Thank you for respond. Keep up with good work.
Thanks! All the best with your projects
hello i want to know if i buy this model now i will get version 8 for free after
Hi
Thanks for your interest in Metronic.
Yes, if you purchase Metronic you will get all future updates for free including Metronic 8 Angular, React, Vuejs, Laravel and more.
if you need any further clarifications please do let us know.
Regards, Sean
It says under https://keenthemes.com/metronic/?page=docs§ion=update that best practice is to separate the metronic source into an isolated directory, but it is never shown in practice how to do this.
Do you provide any working examples on how to do this? The demo projects currently leave you with highly coupled dependencies between your app logic and the metronic layout, making updating even the minor version of the metronic theme a real hassle.
Hi,
Sorry for the late reply. We will publish a video tutorials and add more details soon.
In the meantime if you like to customize the base SASS you can use “src\sass\components\_variables.custom.scss” file to globally override the scss variables.
You can also refer to https://www.youtube.com/watch?v=qAlX83Tb8fg&ab_channel=KeenThemes for theme customization.
If you have any further clarification please contact our support via support@keenthemes.com
Regards, Sean
Hello Team,
We have purchased Metronic theme and wants to use for the app that we have build using ReactJS. I am not that much technically sound, so can you pls. help me if we can use Metronic with ReactJS?
Thanks,
Hi ,
Regards, Sean
Hello Sean,
Thanks for your prompt reply.
Our Metronic version is 7.2.7 and regarding using Metronic demo, am not sure which one should we use. Because as I told that I am not technically sound and that’s the reason I am confused if React & ReactJS both are same and Metronic only supports React or it will also support ReactJS.
Kindly suggest.
Thanks,
Hi rizenindia
React and ReactjS are the same library.
Regards, Keenthemes support
Hi, KYOKYOKK .
https://keenthemes.com/metronic/?page=docs§ion=crud-tables it’s the latest documentation about Angular Metronic CRUDs. All documents we have, are published on our website https://keenthemes.com/metronic/?page=docs§ion=angular-overviewRegards, Keenthemes support
Any plan for Metronic v8 Laravel Version release? Your theme is great.
Thanks !
Hi ,
Thanks for the appreciation.
Yes, sure. We are working on it and doing our best to release it as soon as possible.
Stay tuned for updates via https://twitter.com/keenthemes
Regards, Sean
metronic_v8.0.3 error
web hosting ftp 1. cd theme/html/tools 2. npm install—global npm@latest 3. npm install—global yarn 4. yarn 5. npm run build—demo1 error…
ExperimentalWarning: The ESM module loader is experimental. [webpack-cli] Failed to load ’/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/webpack.config.js’ config [webpack-cli] ReferenceError: require is not defined at file:///home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/webpack.config.js:1:17 at ModuleJob.run (internal/modules/esm/module_job.js:137:37) at async Loader.import (internal/modules/esm/loader.js:179:24) at async loadConfig (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:1346:35) at async WebpackCLI.resolveConfig (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:1454:38) at async WebpackCLI.createCompiler (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:1839:22) at async WebpackCLI.buildCommand (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:1954:20) at async Command.<anonymous> (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:735:25) at async Promise.all (index 1) at async Command.<anonymous> (/home/www/php/laravel/test/metronic_v8.0.3/html_bootstrap5/theme/tools/node_modules/webpack-cli/lib/webpack-cli.js:1284:13)
Hi,
Can you try to run the build on your development machine and deploy the assets to your hosting/sever ? Basically the build tools installation and assets compilation should be done only in your development environment and the actual site should use only the compiled assets in your server.
Regards, Sean
Good morning. Dear seller. Please contact us for purchase.
Currently, the theme is for administrators. Can I use it by customizing it on the user page (front end)? Finally, what license should I purchase in order to resell the theme after customizing it after purchasing it?
Will it be a legal issue if I buy a regular license and sell it commercially?
After purchasing a regular license, how can the seller know if the user is selling commercially, using only one domain or multiple domains?
The reason for asking this question is that after purchasing this template When selling commercially, is it okay to sell in-source cryptography?
Dear seller. I’m a Korean. Please understand even if you are not good at English. Thank you.
Hi ,
Thanks for your interest in our theme – Metronic.
Yes, you can sell your product that uses Metronic commercially but for each sold copy you will need a separate regular license of Metronic. One themeforest license is limited only for one usage/client.
If you need any further clarifications please let us know.
Regards, Sean
Is there any limit to selling multiple units for commercial sales when using the extended license?
How do I pay the amount 1 year after purchasing the 12-month extended license?
Hi,
Please note that the extended license is limited for one project/site that can have unlimited paying users. For example you have an online service/site that provides certain service for users and you charge the end users for using your service. This kind of usage is considered as an Site with Paying User and requires the extended license.
In your case, if you like to make a product using Metronic and sell it you user end users so they purchase and install and use it on premise then for each copy of your end product you will need to purchase a separate regular license.
For each license you pay once and it has has no expiry date.
The support subscription should be extended after it expiry if you like to continue using our theme support.
If you need any further clarification please do let us know.
Regards, Sean
Hi,
Regarding your commercial usage, could you please email our support via support@keenthemes.com and fully explain it ? We will try to advice the best license solution.
Regards, Sean
This item was featured on ThemeForest
Power Elite Author
Contact the Envato Market Help Team
