New
bootstrap-datepicker and bootstrap-datetimepicker locale example.Updates & Improvements
typeahead.js.Fixes
KTDatatable on screen change (resize, orientation change, etc.)KTDatatable multiple search request on every button's keyup. Eg. arrow keys, F4, ESC, etc.datatables.net API undefined function in webpack build.AuthPage component.KtContent component.KTUtil.scrollTo() from scrolling back to the top.KTDatatable JS error on page initialize.KTDatatable perpage dropdown wrong position.New
ReactJS version for Demo3. Live PreviewReactJS version for Demo4. Live PreviewLaravel + Metronic integration manual. Live PreviewBreadCrumbs component for React version.Updates & Improvements
Bootstrap v4.4.1 update.type="text"react version; v16.12.0.formik version; v2.0.6@material-ui/core version; v4.7.0Fixes
KTDatatable pagination size container in Child data table.Flaticon icon's position in button for RTL.KTDatatable active row count.Dual-Listbox duplicates item in the list.Bootstrap-Touchspin wrong increment/decrement.DropdownToggle React.forwardRef issue.Layout components multi re-render issue.KTDatatable to set start page 0 if the is no records. eg. Showing 0 - 0 of 0Fixes
Dual-Listbox duplicate items.demo4 PHP warning errors.Updates & Improvements
v8.2.13ng-bootstrap version; v5.1.2v4.0.2Fixes
Aside display issue for all demos on window resize.Angular Demo2 header dropdown issue.KTDatatable responsiveness during screen orientation change.KTDatatable horizontal scrollbar in mobile screen mode for table with child.KTDatatable inifinite scroll on Edge browser.New
React - Add routing code-splitting example.Figma pages for:
Country Flags in SVG format.Updates & Improvements
React - Updated react-router behaviour. (After login user will redirect to the last location).React - Upgrade react version (to v16.10.2).React - Upgrade create-react-app version (to v3.2.0).React - Upgrade MaterialUI version (to v4.5.1).Angular update version 8.2.11Fixes
Demo 3 mobile user bar and dropdown menu position issue.Login Page animate issue when build using webpack.KTDatatable date sorting issue on dashboard page.noUiSlider style when compile using webpack.KTWizard get index.Dragging Scrollbar issue in RTL.webpack check for existing folder on creating new folder.New
ReactJS version for Demo2. Live PreviewKanban Board plugin integration. Live PreviewUpdates & Improvements
mouseEnter and mouseLeave function from React MenuHorizontalComponent. Use KTMenu dropdown timeout option to handle hover.React Demo1 search control updates.Classic Version of the theme has been excluded from the original download package due to increasing size of the theme.
It still can be provided for the latest available version of the theme upon request via support@keenthemes.com.
We highly recommend everyone to use the buildable version(gulp or webpack) instead for more efficient development.
Fixes
React Demo 1 Header Dropdown Menu delayed hover issue.Dual-Listbox plugin issue in the latest version and use v1.1.0.KTDatatable sample page "Cross-Origin Resource Sharing (CORS)" error.Dual-Listbox. Removed $this.empty() to fix empty previously selected option when saving.Login-3 page javascript error.New
ReactJS version for Demo1.CKEditor plugin integration. Live Preview.TinyMCE plugin integration. Live Preview.Updates & Improvements
Datatables.net plugin update to the latest version.Fixes
KTDatatable horizontal scroll demo page.Sweetalert2 page text description.KTDatatable horizontal scrolling.KTUtil.scrollUpdate().bootstrap-select error icon's alignment.KTWizard.goTo() method call inside beforeNext and beforePrev events.KTWizard Plugin.getFirstStep is not a function error.New
Sticky-js plugin integrating for Sticky Panels examples. Live PreviewUpdates & Improvements
Font-family variables to include fallback list of similar default fonts.Metronic Avatar custom plugin. Live PreviewFixes
New
Todo app. Live Preview20+ Figma design pages.Updates & Improvements
Angular verison. Learn more.Fixes
Bootstrap Switch default checked state issue by downgrading it to v3.3.4Default version.Angular production build error.Angular Demo4 during scroll up and down.KTDatatable visibility. The hidden columns will be reappeared on switching screen between desktop and mobile view.Angular dropdown toggle arrow.jquery-validation and jquery-form plugin to the webpack build.Updates & Improvements
default and classic version demos into stand-alone demos with independent templates, assets and build tools.build.json to gulp.config.json in default version.vendors folder to the new folder plugins.vendors.bundle.css and vendors.bundle.js files to plugins.bundle.css and plugins.bundle.js accordingly.v8.2.5v6.5.3New
Dark Header layout skin for Demo 1. Live PreviewLight Aside layout skin for Demo 1. Live PreviewDemo 1 layout builder. Live PreviewUpdates & Improvements
HttpHeaders.append() to HttpHeaders.set() in auth service getUserByToken() functionimg to images.Fixes
components menu items.gulp assets' path rewrite for nested assets folder.jquery-form include in webpack.New
Webpack version of the bulding tools. Learn moreMail Inbox app. Live PreviewTagify plugin integration to support advanced tags inputs. Live previewGmail Like Multipe File Upload using DropzoneJs with manual and auto uploading of individual files. Live previewUppy File Upload sleek, modular open source JavaScript file uploader plugin. Live previewDual Listbox plugin to make multi select pretty and easy to use. Live previewUpdates & Improvements
gulp build tool from the Angular and now use the Metronic's core assets source (SCSS, JS, etc.) directly.assets/sass/theme/demos/ to assets/sass/theme/layout/minHeight: 500 from KTDatatable default option and make it as optional option.Fixes
Demo 7 JS error on aside submenu toggle.Demo 4 subheader layout issue on mobile view.Demo 4 missing aside menu's mobile toggle button in user profile pages.KTDatatable columns visibility in hide mode when in mobile view.Angular Splash Screen position issue on the first page load.tagify polyfills issue in IE11.jstree missing context menu separator.Angular Portlet options does not update the portlet layout.KTApp.progress() size option issue.gulp compile missing SVG in css path rewriter.minlength and maxlength validation in Angular registration & login page.New
demo6. Live Previewdemo7. Live Previewdemo8. Live Previewdemo9. Live Previewdemo10. Live PreviewWizard 1 page. Live PreviewWizard 2 page. Live PreviewWizard 3 page. Live PreviewWizard 4 page. Live PreviewProjects app:
List Columns 1 template. Live PreviewList Columns 2 template. Live PreviewList Columns 3 template. Live PreviewList Columns 4 template. Live PreviewList Datatable template. Live PreviewView Project template. Live PreviewAdd Project template. Live PreviewEdit Project template. Live PreviewSupport Center app:
Home 1 template. Live PreviewHome 2 template. Live PreviewFAQ 1 template. Live PreviewFAQ 2 template. Live PreviewFAQ 3 template. Live PreviewFeedback template. Live PreviewLicense template. Live PreviewIconbox component. Live PreviewInfobox template. Live PreviewCallout template. Live PreviewRibbon template. Live PreviewAccordion options. Live PreviewUpdates & Improvements
Invoice 1 and Invoice 2 improvements.Fullcalendar v4 update.kt-container base component to handle the content elements width for all demos. All demos subheader and content layout parts must be updated with the latest markup.tools/build.json from {$config.output} to {$config.dist}.kt-container as similar with the default HTML version.KTMenu item link click event handler. Check documentation.Fixes
Summernote z-index issue.Demo 2 scroll top icon z-index issue.Demo 10 dashboard switcher menu for mobile view.KTDatatable height.KTDatatable column visibility function datatable.visible() to allow hide column at the initial.DataTable dropdown z-index in the grid.jQueryUI Datepicker and Bootstrap Datepicker conflict./?id=1New
Chat box that can be opened on the right center toolbar chat icon click. Live previewPrivate Chat page. Live previewGroup Chat page. Live previewModal Popuo Chat page. Live previewNotes component. Live previewUser Pics component. Live previewSearchbar component. Live previewFlaticon set. Live previewUpdates & Improvements
tools/build.json from {$config.output} to {$config.dist}.KTApp.initScroll() method to support desktop native scrolling(instead of perfect scrollbar).Fixes
New
Users List - Default page. Live previewUsers List - Datatable page. Live previewUsers List - Columns - 1 page. Live previewUsers List - Columns - 2 page. Live previewAdd User page. Live previewEdit User page. Live previewUser Profile 1 page. Live previewUser Profile Personal Information page. Live previewUser Profile Account Information page. Live previewUser's Change Password page. Live previewUser's Email Settings page. Live previewUser Profile Account Information page. Live previewUser Profile 2 page. Live previewUser Profile 3 page. Live previewUser Profile 4 page. Live previewContact List - Column page. Live previewContact List - Datatable page. Live previewView Contact page. Live previewAdd Contact page. Live previewEdit Contact page. Live previewDemo 3 Angular version. Live previewDemo 4 Angular version. Live previewDemo 5 Angular version. Live previewAngular Portlet component.gulp build --js, gulp build --sass, gulp build --mediaUpdates & Improvements
default demo ID has been renamed to demo1.src folder has been fully reconstructed to provide more clean and elegand file structure for SASS, JS and Media files.assets folder has been slightly reconstructed to separate the assets versions per working demo.dist folder does not exist and it will be generated only after running gulp task.Fixes
Demo 2 fixed aside menu height issue on scroll.summernote z-index issue.gotoPage(pageNumber) API.Demo 12.Demo 8 responsive layout issue in mobile mode.Demo 10 responsive layout issue in mobile mode.Demo 4 topbar icon color issue on header minimize mode.Sweetalert2 plugin demo page JS errors.KTMenu.setActiveItem() function.select2 arrow icon for longer text.input-group-lg-group to input-group-lg.New
Updates & Improvements
Demo4 header menu icons changed to SVG iconsFixes
Demo2 header dropdown menu z-index issue when fixed aside menu is enabled.demo4 background image not full width on the larger screen.KTDatatable javascript errorSweetAlert2 with new API function swal.fire().Angular version Daterange HTML issue in subheader.New
Classic version without build tools. For this version npm, gulp, yarn and sass are not required.Updates & Improvements
mUtil.find() and mUtil.findAll(), to check undefined element.Fixes
New
eCommerce moduleUpdates & Improvements
Fixes
Aside MenuFontawesome sizing classes(e.g: fa-2x,fa-2x)SweetAlert2 body auto height issueSpinner and Loader animation issue on IE11mDatatable checkbox bug (freeze and crash) in iOSheadOverflay?: boolean; to headOverlay?: boolean;New
Demo 2 demo.Updates & Improvements
isMockEnabled switcher to /src/environments/environment.ts file for easy switching from 'Fake' to 'Real' REST API. Doc is here.Fixes
typeahead page showing warning error.mDatatable sorting does not initialize with asynchronous JS.mDatatable sorting icon not appear using HTML table.mat-table examples.Updates & Improvements
Fixes
mPortlet header on the responsive mobile mode.mDatatable checkbox selection should be removed after calling datatable API reload()gulp compiler error when RTL and CSS source map is enabled..Updates & Improvements
Fixes
New
Default demo.Updates & Improvements
Bootstrap v4.1.3 Update.mDatatable nested searching & filter for local data sourceFixes
mDatatable select all checkbox API.mDatatable primary key check.Demo 3 fixed aside mode issue.Demo 2 and Demo 5 header z-index issue.New
Fixes
mDatatable checkbox selection should be removed after datatable reload() call.Owl Carousel missing images.mUtil.scrollTo API function issue.Sticky Form Actions on Aside toggle.mWizard Form Wizard JS error on form validation.Custom Scroller height issue on mobile.Demo3 fixed aside mode issue.Demo2 subheader margin issue on tablet and mobile modes.New
Sticky Portlet. Preview it here.Sticky Action Bar.Preview it here.Type typography component. Preview it here.Updates & Improvements
Bootstrap v4.1.1 Update.Fontawesome5 Update.Sweetalert2 v7.22.0 UpdatemCustomScrollbar to Perfect Scrollbar plugin. For data-scrollable=true change data-min-height to
data-height.
autoprefixer to the Gulp compiler.Aside Menu submenu accordion animation.Page Smooth Scrolling.Portlet responsiveness.IE10 and IE11 support.Aside Menu hover mode.layout.customScrollbar in mDatatable option to enable/disable custom scrollbar.Fixes
mDatatable issue.Line Tabs click issue on Safari.Content Wrapper overflow issue for all demos.Left Aside z-index issue for all demos.Smooth Scrolling on iOS devices.Popover dark skin arrow color issue.Demo 12 header bg issue on boxed layout.Topbar profile menu's user pic border radius issue.Content Scroll issue for all demos.Wizard 4 navigation issue on smaller width.Fontawesome5 icons custom sizing classes.mDatatable auto scroll to top when click empty link in Edge and IE browser.mDatatable API for checkbox not clear when setActiveAll(false) and then reload().mDatatable pagination meta to integer if string privided.mDatatable reload() for remote JSON not updated.mDatatable local search does not find value other than string.Gulp Compiler to compile by demo option.mDatatable checkbox to be cleared after refresh.mDatatable unnecessary loading spinner.SweetAlert2 deprecated function warning.Updates & Improvements
4.1.0 update.row.getDatatable() and row.getIndex() in template callback.mWizard.stop() and mWizard.start() API methods instead of retruing boolean value from Event handler function to cancel wizard step.
Fixes
animateClass.revenueChange(); to initialize script at dashboard.js.dashboard.js.gulp command for Angular to allow without flag --angular-jquery.m-menu-scrollable.New
Updates & Improvements
mMenumDropdownmHeadermOffcanvasmPortletmQuicksearchmScrolltopmTogglemWizarddata to m. Eg: m-dropdown-toggle="hover", m-dropdown-persistent="hover".Bootstrap Select to the latest version v1.13.0-beta.Lineawesome to the latest version.mDatatable local data source search method now support multi values by passing array: datatable.search(['search', 'values'], ColumnName);.mDatatable add class option to the individual column.mDatatable inherit row <tr> properties from HTML table.mDatatable add option for remote data request timeout.tools/conf/angular.json has been renamed to tools/conf/angular-jquery.json.manualStepForward parameter for mWizard plugin to control step forward on step number click.requestTimeout for mQuicksearch plugin.Fixes
mDatatable width overflow issue for demo 2, demo 5, demo 8 and demo 10mDatatable fix local sort not working at initial load.mDatatable fix getPageSize API returning not correct selected value.mDatatable fix hidden locked columns.mDatatable fix resize after hide columns.mDatatable fix sort API, missing param sort type.mDatatable fix from calling remote when server filtering is disabled.mDatatable fix sort arrow not displayed for right aligned column.mDatatable fix auto hide column with wrong header title.mDatatable layout.gulp fix jquery-ui to include missing assets in the bundle.Bootstrap Select's data-size HTML parameter issue.New
PSD filesSketch filesNew
Demo 8. Preview here.Demo 9. Preview here.Demo 10. Preview here.Invoice v1. Preview here.Invoice v2. Preview here.Updates & Improvements
Bootstrap 4 Stable. See the changelog for more info.Fixes
fullcalendar plugin in Angular.Demo2 and Demo 5.Summernote editor toolbar's z-index issue.Summernote font styles(bold, italic) do not work.mDatatable reset scroll position after content changed.mDatatable fix local HTML table search by column name.mDatatable for local HTML table, removed span tag from data source.mDatatable display spinner on every AJAX request.mDatatable fix error message position display.mDatatable fix row details does not show the correct title on expand.mDatatable Disable autoHide for locked columns table.mDatatable trim extracted html-table values.New
Fixes
mDatatable fix exclude empty parameters from request.New
Updates & Improvements
Bootstrap 4 Beta 3. See the changelog for more info.mDatatable data.source.read.params option will be sent as parameters to backend API service.mDatatable ajax parameter namespace datatable is deprecated.Summernote v0.8.9.Default Demo.Fixes
mDatatable local and server datasource filter conflict.Demo 4 layout z-index issue when modal window opened.Demo 4 layout content container overflow issue.Portlet collapse API function works inverse.Quicksidebar messanges component's message aligment issue on wider width container.Quick search input spinner icon position issue in all demos.Bootstrap Datetimepicker form validation does not change state after value selection.Fixes
Markdown plugin preview issueDemo 7 mobile header background color issue.gulp --prod empty css file and minification issue.New
rows.beforeTemplate and rows.afterTemplate.search.onEnter, for search on Enter button keyup.checkbox extension for records selection.minHeight option.Changes & Improvements
bower dependencies manager and replaced with yarn.datatable.methodName(args) or $(datatable).mDatatable(methodName, args);rows.callback option was deprecated.addRemoveLinks: true for the link to remove the uploaded file.employees to customersFixes
m-datatable--on-init to be triggered on last initilizing process.pageSizeSelect option cannot be changed by options.New
hideColumn and showColumn.getDataSet to get all data in the grid.Changes & Improvements
html to default.fullJsonData to originalDataSet.Fixes
Fixes
Fixes
New
Changes & Improvements
GET or POST.searchDelay:400 option node changed to search:{delay:400}Fixes
New
Metronic Datatable.Metronic Datatable.Metronic Datatable.Metronic Datatable new public API getTotalRows().Metronic Datatable new option for searchDelay default to 400ms.demo5Changes & Improvements
GET or POST.Metronic Datatable.Metronic Datatable.Metronic Datatable.Fixes
Metronic Datatable plugin.Metronic Datatable always perform request data from remote when window resized.Fixes
Demo 4 horizontal menu's submenu z-index issue.If you need the theme customization or custom development services please contact us to get a free quote:
Hire UsA single license can be used only for one domain or client. Each use of the theme requires a separate license. We hope you will follow the rules as it will help us to continue supporting our themes and providing a free future updates.
GET A NEW LICENSEASP.NET Zero is a starting point for new web projects based on our Metronic Theme UI.
Learn ModeMecons is the Most complete & trusted Tag Helper Library for Metronic.
Learn ModePlease ensure that your support subscription is active to receive any further support. To check your support subscription status here.
Renew SubscriptionYou can support our theme by referring a new users from your site or blog and earn with themeforest's affiliate program.
Get More InfoLike all HTML templates, you will need to manually handle all updates that we provide after purchase for free. Before updating your project with the new version of Metronic please do check out our tips for handling the updates efficiently.
Read more...I run a team of 20 product managers, developers, QA and UX resources. Previously we designed everything ourselves. For our newest platform we tried out Metronic. I cannot overestimate the impact Metronic has had. It's accelerated development 3x and reduced QA issues by 50%. If you add up the reduced need for design time/resources, the increase in dev speed and the reduction in QA, it's probably saved us $100,000 on this project alone, and I plan to use it for all platforms moving forward.
The flexibility of the design has also allowed us to put out a better looking & working platform and reduced my headaches by 90%. Thank you KeenThemes! Jonathan Bartlett, Metronic Customer
Everything within Metronic is customizable globally to provide limitless unique styled projects
Choose a perfect design for your next project among hundreds of demos
A huge collection of components to power your application with the latest UI/UX trands
Enterprise ready Angular and React integration with built-in authentication module and many more
Metronic deeply customizes Bootstrap with native look and feel
Our super sleek and intuitive Datatable comes packed with all advanced CRUD features
Metronic is the only theme trusted by over 70,000 developers world wide
Lifetime updates with new demos and features is guaranteed
Metronic is written with a code structure that all developers will be able to pick up easily and fall in love
