1407 comments

Hi Cstooch,

Thank you for your comment and report. We will update the fixes in next version release. Here is the fixes for the e-commerce black menu.

<style type="text/css">
@media (max-width: 767px) {
.header.header-inverse .navbar-collapse {
background: #363D44;
}
.header.header-inverse .navbar-collapse,
.header.header-inverse .navbar-collapse .nav > li + li {
border-top: 1px solid rgba(0,0,0,0.25);
}
.header.header-inverse .navbar-toggle {
border-right-color: rgba(0,0,0,0.25);
}
.header.header-inverse .navbar-toggle .icon-bar {
background: rgba(255,255,255,0.25);
}
}
</style>

Best Regards,
Sean.
Hi Sean,

Thanks for your response above.. that worked perfectly. Another question for you.

I'm using the eCommerce front-end example. Is there a way in the current version of this template to have multiple levels in the menu? For example (with the eCommerce sample site in mind), if you hover on Accessories in the Nav menu, then hover on Mobile Phone, a list drops below that or to the side of various mobile phones you can click on.

Thanks
Chris
Hi Chris,

Recently the multiple levels menu for e-commerce version in header dropdown is not available yet. You may use the jQuery accordion to achieve the multiple menu / dropdown menu.

Best Regards,
Sean.
OK, I'll take a look at that, thanks again!
Hey Sean, I've been experimenting with layouts still trying to find the one I like most. I think I'm almost settled. I would really like to use the one in: admin/html/page_with_top_menu.html . The only thing I wanted to change was to add boxed layout with class="boxed-layout" in the body. That almost works perfectly, but when you view in mobile, the menu is covered by the header area, so you don't see the first couple of menu items.

What styling can I add to lower the menu to right after the header?
Hi Cstooch,

Thank you for your comment and report. Here is the quick fix for the top menu with boxed layout in mobile view.
<style type="text/css">
@media (max-width: 767px) {
.boxed-layout .top-menu {
top: 109px;
}
}
</style>

Best Regards,
Sean.
That's fantastic. I appreciate your quick reply. That of course did it for me. Thank you very much.
Please, add a folder named "blank folder", with all the static files and a blank page to start coding the template.

I had to do much cleaning to get a basic view of the app safe and sound for my development.
Hi Myoneasy,

Thank you for your comment and feedback. We do have a page_blank.html for you to start with your blank page.

Best Regards,
Sean.
Thanks for your anwser.

What I meant is that even the page_blank.html is carried with too much info to clean. I tried to start a new project following the documentation to have a garantee that i wasn't loading more then necessary, but turns out some infos were outdated, like the name of some plugin files that are being loaded like "jvector map" that don't match the directory path of the docs.

This is not a huge problem tho, but sometimes one person or another are gonna waste 1 or 2 hours trying to figure out what's the correct name, cleaning some stuffs here and there, instead of starting fresh. That's why we love bootstrap, right? x)
Hi Myoneasy,

Thank you for your comment and feedback : )

Best Regards,
Sean.
dorset PURCHASED
Hi May I know if you have any version which already integrated with php Laravel framework?
And does the jquery used support auto complete?
Hi Dorset,

As long as you include the required css/js file, there should be no problem to integrate with any framework. You may refer to our form plugins page for jquery autocomplete.

Best Regards,
Sean.
dorset PURCHASED
Wow... Appreciate for the fast response.
yeah, found it in form plugins. Nice work, thank you very much!
Trying to buy it, but it says to try again later. Is there something wrong with the payment procedure?
Hi Prowork,

You may contact wrapboostrap support for more information regarding the payment issue.

Besr Regards,
Sean.
Hi,
I just bought this theme but I wasn't able to let it work with angular or anguar2, Can you please guide me ?
Hi NoorToTah,

First of all, you need to run angular v1.x version in localhost. Secondly, you need to install node js and run the required command for angular js 2. You may refer to the documentation file inside your downloaded folder.

Best Regards,
Sean.
zbiskup PURCHASED
Hello Sean,

awesome template.

I have one small issue, login V2 is not mobile responsive.

Can you help.

Thanks, Zvonko
zbiskup PURCHASED
Oh and one more question, how can I trigger modal notification without click?
Hi Zvonko,

Thank you for your comment and report. Regarding your question,

1. To have a quick fix for Login V2, you may apply the following css
<style type="text/css">
@media (max-width: 767px) {
.login.login-v2 {
position: relative;
left: 0;
}
}
</style>

2. You may add the gritter notification by using the javascript. The following example is show the notification when page load.
<script>
$(document).ready(function() {
$.gritter.add({
title: 'This is a regular notice!',
text: 'This will fade out after a certain amount of time. Sed tempus lacus ut lectus rutrum placerat. ',
image: 'assets/img/user-3.jpg',
sticky: false,
time: ''
});
});
</script>

P.S Do not forget to include the required js / css for gritter notification

Best Regards,
Sean.
lommez PURCHASED
Hi,
I'm trying to build the application using webpack but without success.
In my machine i´ve webpack version 2.2.1

Here is the log generated with the error:

0 info it worked if it ends with ok
1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
1 verbose cli 'C:\\Users\\winuser\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'build' ]
2 info using npm@4.2.0
3 info using node@v7.7.2
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle color-admin@1.0.0~prebuild: color-admin@1.0.0
6 silly lifecycle color-admin@1.0.0~prebuild: no script for prebuild, continuing
7 info lifecycle color-admin@1.0.0~build: color-admin@1.0.0
8 verbose lifecycle color-admin@1.0.0~build: unsafe-perm in lifecycle true
9 verbose lifecycle color-admin@1.0.0~build: PATH: C:\Users\winuser\AppData\Roaming\npm\node_modules\npm\bin\node-gyp-bin;C:\Projetos\DiagnosticPortalLayer\node_modules\.bin;C:\Program Files\Docker\Docker\Resources\bin;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Git\cmd;C:\Program Files\TortoiseGit\bin;C:\Program Files\nodejs\;C:\Program Files\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files\Microsoft SQL Server\130\Tools\Binn\;C:\nuget;C:\Program Files\dotnet;C:\Program Files (x86)\Skype\Phone\;C:\Users\winuser\AppData\Roaming\npm;C:\Program Files (x86)\Microsoft VS Code\bin
10 verbose lifecycle color-admin@1.0.0~build: CWD: C:\Projetos\DiagnosticPortalLayer
11 silly lifecycle color-admin@1.0.0~build: Args: [ '/d /s /c', 'webpack' ]
12 silly lifecycle color-admin@1.0.0~build: Returned: code: 1 signal: null
13 info lifecycle color-admin@1.0.0~build: Failed to exec build script
14 verbose stack Error: color-admin@1.0.0 build: `webpack`
14 verbose stack Exit status 1
14 verbose stack at EventEmitter.<anonymous> (C:\Users\winuser\AppData\Roaming\npm\node_modules\npm\lib\utils\lifecycle.js:279:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:194:7)
14 verbose stack at ChildProcess.<anonymous> (C:\Users\winuser\AppData\Roaming\npm\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:194:7)
14 verbose stack at maybeClose (internal/child_process.js:899:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid color-admin@1.0.0
16 verbose cwd C:\Projetos\DiagnosticPortalLayer
17 error Windows_NT 10.0.10586
18 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\winuser\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "build"
19 error node v7.7.2
20 error npm v4.2.0
21 error code ELIFECYCLE
22 error errno 1
23 error color-admin@1.0.0 build: `webpack`
23 error Exit status 1
24 error Failed at the color-admin@1.0.0 build script 'webpack'.
24 error Make sure you have the latest version of node.js and npm installed.
24 error If you do, this is most likely a problem with the color-admin package,
24 error not with npm itself.
24 error Tell the author that this fails on your system:
24 error webpack
24 error You can get information on how to open an issue for this project with:
24 error npm bugs color-admin
24 error Or if that isn't available, you can get their info via:
24 error npm owner ls color-admin
24 error There is likely additional logging output above.
25 verbose exit [ 1, true ]
Hi Lommez,

Thank you for your comment and feedback. You may try to delete the node_modules folder and run the npm install command.

Best Regards,
Sean.
lommez PURCHASED
Hi Sean,
You mean the C:\Users\winuser\AppData\Roaming\npm\node_modules\ folder?
Because in the project root folder doesn´t have the "node_modules" until the command "npm install" is executed
Hi Lommez,

If you are using version 2.1, you might be able to see the node_modules inside the template_content_angularjs2. But for version 2.2, we have removed the folder due to some user is not able to extract the file because of the file path for node_module is too long for extractor.

For the npm error, you may try to refer to the following link
https://github.com/npm/npm/issues/12931

Best Regards,
Sean.
I am using the angular2 template, How can I use data-table to load after calling the API via services?
Hi Tyehia7,

You may pass the value to your view file and rerender the dataTables again. BUT of course, this is the jQuery way to do the simple dataTables. If you wish to fully use the dataTables in angular 2, you may refer to the following link:
https://www.npmjs.com/package/angular2-datatable

Best Regards,
Sean.
Hi, there is a bug on Login_v2. The login panel does not center on smaller resolution or mobile.
Hi Jimmylam,

You may use the following css to fix the issue.
<style type="text/css">
@media (max-width: 767px) {
.login {
top: 0;
}
}
</style>

Best Regards,
Sean.
Please ignore my comment. I just saw fixed you posted previously.
Hi, will you be updating to Angular 4 and support Angular CLI? Thanks.
Hi Jeejeejango,

Thank you for your comment and feedback. Yeah. We will update to Angular 4 in next version release as well.

Best Regards,
Sean.
Thank you for the reply. Do you have a rough timeline?

I noticed in your Angular 2 demo site, first time load always encounter "Error: Cannot match any routes. URL Segment: 'color-admin-v2.2/admin/angularjs2'". The Gritter notification is also not working.
Hi Jeejeejjango,

Yeah, you are right. The reason why the angular 2 first load is not working on demo site is because we do not install node js into our demo server. You might need to have some exact route in order to view the demo site.

Besides that, we are still can't tell you the exact date for next version release. This is because we are adding a new version of admin design (apple style design). Please stay tuned.

Best Regards,
Sean.
Thank you for your fast response. I have purchased the theme.
Hi, Seanngu

Please, add a folder named "blank folder", with all the static files and a blank page to start coding the template for new project.

I had to do much cleaning to get a basic view of the app safe and sound for my development.

Also, it is good for a development if you give documentation & example code for each plugin and components.
Hi Jingood2,

Thank you for your comment and feedback. Unfortunately there have no point for us to add our own documentation for each plugins. We do believe that this is your responsibility to study the plugins option from their official documentation.

Best Regards,
Sean.
Hello Sean,

I was wondering if it would be possible for you to add a dark version of the color admin?

Been trying to do it myself but just can't get the colours to work together :(
Hi Gannicus,

Thank you for your comment and feedback. We will add into our todo list for next version release.

Best Regards,
Sean.
Thanks, Sean! I very much appreciate your commitment to this template! Thanks for all the hard work!
Hi,

Is it for MVC as well?
Hi Maludasek,

Yeah, you are right. As long as you locate and include the required css / js file, there should be no problem to use our template in MVC framework.

Best Regards,
Sean.
Hi,
We are facing Build Issue that is "npm install never generates bundle.js. No error is show on console as well.". Please let us know what to do with it.

Thank you.

BT
Hi BT,

For your information, you might need to run the "npm run build" command in order to build the bundle.js

Best Regards,
Sean.
Hi Seanngu,

This is what we are getting after running "npm run build"....:

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.resolve has an unknown property 'extension'. These properties are valid:
object { alias?, aliasFields?, cachePredicate?, descriptionFiles?, enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, moduleExtensions?, modules?, plugins?, resolver?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }
Hi BT,

You may try to remove the node_modules folder and re-run the npm install command. After that you may try to run the npm run build. If the error still occur, make sure the latest node js has been installed in your working environment.

Best Regards,
Sean.
Hi Seanngu,

We are using

node v7.6.0
npm v4.1.2

We have done the mentioned steps but error still there. One more thing we I have web pack installed with -g

Regards,
BT
UNMET PEER DEPENDENCY @angular/common@2.1.2
├── UNMET PEER DEPENDENCY @angular/compiler@2.1.2
├── UNMET PEER DEPENDENCY @angular/core@2.1.2
├── UNMET PEER DEPENDENCY @angular/forms@2.1.2
After removing node_modules
Hi Besttours,

Unfortunately, you might need to google based on your error message. So far all our template user didn't face the issue like this,

Best Regards,
Sean.
Hi Sean.

Parsley Validation breaks when moving boxes.

Steps to reproduce:

1) Go to Color Admin Live Preview 2.2
2) Click on Form Stuff -> Form Validation
3) On Basic Form Validation -> Click Submit to trigger validation
4) Move the validation box anywhere (it can even still be in the same box as it was before)
5) Fill in the Name and Email address.
6) Click SUBMIT.
7) Validation on that form is now broken. You can click submit again and none of the required fields will be checked. Form will always be submitted.

In order to get the Validation to work again, you need to Reset LocalStorage.

Can you please suggest a fix for this?
Hi Galsoori,

Thank you for your comment and report. Here is the solution for quick fix.
(Fire an event after the position loaded / refresh)

FILE: apps.js
FUNCTION: handleLocalStorage
=================================
var handleLocalStorage = function() {
"use strict";
if (typeof(Storage) !== 'undefined' && typeof(localStorage) !== 'undefined') {
var targetPage = window.location.href;
targetPage = targetPage.split('?');
targetPage = targetPage[0];
var panelPositionData = localStorage.getItem(targetPage);

if (panelPositionData) {
panelPositionData = JSON.parse(panelPositionData);
var i = 0;
$.when($('.panel').parent('[class*="col-"]').each(function() {
var storageData = panelPositionData[i];
var targetColumn = $(this);
if (storageData) {
$.each(storageData, function(index, data) {
var targetId = $('[data-sortable-id="'+ data.id +'"]').not('[data-init="true"]');
if ($(targetId).length !== 0) {
var targetHtml = $(targetId).clone();
$(targetId).remove();
$(targetColumn).append(targetHtml);
$('[data-sortable-id="'+ data.id +'"]').attr('data-init','true');
}
});
}
i++;
})).done(function() {
window.dispatchEvent(new CustomEvent('localstorage-position-loaded'));
});
}
} else {
alert('Your browser is not supported with the local storage');
}
};

FILE: apps.js
FUNCTION: handleSavePanelPosition
=================================
var handleSavePanelPosition = function(element) {
"use strict";
if ($('.ui-sortable').length !== 0) {
var newValue = [];
var index = 0;
$.when($('.ui-sortable').each(function() {
var panelSortableElement = $(this).find('[data-sortable-id]');
if (panelSortableElement.length !== 0) {
var columnValue = [];
$(panelSortableElement).each(function() {
var targetSortId = $(this).attr('data-sortable-id');
columnValue.push({id: targetSortId});
});
newValue.push(columnValue);
} else {
newValue.push([]);
}
index++;
})).done(function() {
var targetPage = window.location.href;
targetPage = targetPage.split('?');
targetPage = targetPage[0];
localStorage.setItem(targetPage, JSON.stringify(newValue));
$(element).find('[data-id="title-spinner"]').delay(500).fadeOut(500, function() {
$(this).remove();
});
window.dispatchEvent(new CustomEvent('localstorage-position-refresh'));
});
}
};

JS
==============
window.addEventListener('localstorage-position-refresh', function(e) {
$('[data-parsley-validate="true"]').parsley();
});
window.addEventListener('localstorage-position-loaded', function(e) {
$('[data-parsley-validate="true"]').parsley();
});

P.S If you are using apps.min.js you might need to minify the apps.js in order to update the apps.min.js as well.

Best Regards,
Sean.
Thanks Sean. I can confirm your quick fix has solved the problem.
Hi Sean,

I'm having a problem with the top menu, when I select a menu that has a sub-menu instead of opening the sub-menu items the main menu disappears having to click again on the top menu item and when you open the sub-menu items Appear open. I did some testing and it seems that if I click the arrow instead of the menu description it works, is it possible for the description to have the same function?

Thank you,

Júnior
Hi,
Does your template include PSD files?
thanks
Hi Naturalint,

Thank you for your comment and feedback. Unfortunately, our template didn't include PSD files.

Best Regards,
Sean.

Write a comment

This is a great way to give the seller feedback and ask them questions about their item.

You must sign in to write a comment

Sign in or sign up to make a purchase

$30
5871Purchases

Licenses: Details »

Single application $30
Version:3.0
Type:
  • HTML Template
Bootstrap: Compatible with 4.x
Layouts:
  • Responsive
  • Fluid
  • Fixed-width
Browsers:
  • IE 10, 11
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
Uses Less:Yes
Uses Sass:No
Categories:
Tags: admin template, blog, bootstrap, css3, e commerce, forum, html5, jquery, one page parallax, responsive
Item#:WB0N89JMK
Released:3 years ago
Updated:4 months ago
Sold exclusively on WrapBootstrap
seanngu

seanngu

Signed up 4 years ago

Need a front-end theme?

About Bootstrap

Bootstrap is designed to help people of all skill levels – designer or developer, huge nerd or early beginner. Use it as a complete kit or use it to start something more complex.

Unlike other front-end toolkits, Bootstrap was designed first and foremost as a styleguide to document not only its features, but best practices and living, coded examples.

Built to support new HTML5 elements and syntax with progressively enhanced components.

Browser support

Bootstrap is tested and supported in major modern browsers like Chrome, Firefox, and Internet Explorer.

Tested and supported in Chrome, Safari, Firefox, Internet Explorer, and Opera.
  • Latest Chrome
  • Latest Firefox
  • Latest Safari
  • Latest Edge
  • Internet Explorer 9/10/11
  • Latest Opera

Features & includes

Bootstrap provides an unparalleled array of features and reusable components that let you hit the ground running: