91 comments

DyaGa PURCHASED
Also, I found a problem. See script.js file at line 820.
There is a code:

$('[href="#' + $activeHash + '"]').parent().addClass('active');

In case of setting thumbnail url like: `<a href="product-page.html#one"`> the code doesn't add `active` class for `li` element.

The solution could be in using `data-hash` attribute for thumbnail link.
Hi,
Thank you again for spotting the issue and provided solution. I'll add necessary fixes in future update. Regards
DyaGa PURCHASED
And one more feature request. On the `Shop Grid` pages you have added a button `Add to cart`, but the problem in that some products has sizes, so before adding product to the cart you have to select which size you want to add.

So, a solution could be like this. When user clicks on `Add to cart` system should show him a list of sizes and only after selecting a required size the system will add a product to the cart.

Or, another solution. A lot of ecommerce systems has a feature called `Quick view` - modal widnow where user can see short info about product, select size and add product to the cart.

It will be good if you can implement this two features.
I don't seem to be able to change the izi.Toast values successfully.

If I run iziToast.success it should be green, but it always stays grey. Any idea how to fix this?
Hi,
Please check component page. I explain how to use it. I created data api for it. http://themes.rokaux.com/unishop/v1.3/components/toasts.html

Regards
That's fine if you are simply adding the value to a button. But if you want to generate a toast after say an ajax post there is no way to set the color.

I have tried using iziToast.success and tried color: 'green' - but neither of these work. Obviously simple adding data-type='success' has no effect after an ajax post.
Well, in this case please check iziToast official docs http://izitoast.marcelodolce.com/
Hope you find the way to make it work with ajax.
cma018 PURCHASED
Hi , now the mega menu is 100% length, how can i make its content same width as the menu. thanks
Hi,
Please follow the instruction in this screenshot
https://drive.google.com/open?id=0B5VQ-ad9V-fjQlY3cVY4OFJ6bXM
cma018 PURCHASED
thanks, resolved, need to make change in scss and recompile though
on shop-grid-ns.html
<div class="grid-item" *ngFor="let rec of records">

only shows 4 items of products
what is wrong on me ?

thank you
-peter-
item number 5,6,7 and so on are hidden behind the <div class="isotope-grid cols-4 mb-2">

this isotope grid cannot auto height , its fix 2px

how to fix it ?

thank you
-peter-
when i add style to this <div class="isotope-grid cols-4 mb-2" style="min-height:1000px">

it can show 12 items of products , but i have 16 items of product

hot to fix it ? to make isotope auto height ?

thank you
-peter-
Hi Peter,
Do you see the same problem with my demo site? If yes, please specify what Browser / OS you are testing on. Also let me know what you are using for development: SASS or pure CSS. Regards, Roman
Hi Roman ,,

your demo site , live preview is verry verry good , i use google chrome 61 on windows 10 64

i use angular 4 , bootstrap 4-beta , and inside index.html i add this : <link rel="stylesheet" media="screen" href="assets/scss/styles.scss">

thank you for your answer
-peter-
this is my index.html on my angular 4 :

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>SisKA - Sistem Komputer Akuntansi</title>
<base href="/">

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">

<!-- css -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" >

<!-- js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" ></script>

<!-- UNISHOP THEME -->
<!-- SEO Meta Tags-->
<meta name="description" content="Unishop - Universal E-Commerce Template">
<meta name="keywords" content="shop, e-commerce, modern, flat style, responsive, online store, business, mobile, blog, bootstrap 4, html5, css3, jquery, js, gallery, slider, touch, creative, clean">
<meta name="author" content="Rokaux">
<!-- Mobile Specific Meta Tag-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<!-- Favicon and Apple Icons-->
<link rel="icon" type="image/x-icon" href="assets/favicon.ico">
<link rel="icon" type="image/png" href="assets/favicon.png">
<link rel="apple-touch-icon" href="assets/touch-icon-iphone.png">
<link rel="apple-touch-icon" sizes="152x152" href="assets/touch-icon-ipad.png">
<link rel="apple-touch-icon" sizes="180x180" href="assets/touch-icon-iphone-retina.png">
<link rel="apple-touch-icon" sizes="167x167" href="assets/touch-icon-ipad-retina.png">
<!-- Vendor Styles including: Bootstrap, Font Icons, Plugins, etc.-->
<link rel="stylesheet" media="screen" href="assets/css/vendor.min.css">
<link rel="stylesheet" media="screen" href="assets/scss/styles.scss">
<!-- Main Template Styles-->
<link id="mainStyles" rel="stylesheet" media="screen" href="assets/css/styles.min.css">
<!-- Modernizr-->
<script src="assets/js/modernizr.min.js"></script>
<script src="assets/js/vendor.min.js"></script>
<script src="assets/js/scripts.min.js"></script>
<!-- END OF UNISHOP THEME -->

</head>
<body>

<app-root></app-root>

</body>
</html>
Why is $.ajax not coming up as a function. I have to add jquery which then conflicts with things like modal????
Is this using a slim version on jquery?
Hi,
Yeap. I used slim version. Just replace with full jquery you need. Regards
so replace vendor.min.js with jquery-3.1.1.js ??? You haven't added anything else to the vendor file?
Do you use grunt setup I've provided with the template? If yes, you just need to replace jQuery inside src/vendor/J's and run grunt command to re-compile vendor.min.js.
That worked thanks.
Great. You are welcome!
button does not show ini input-group-btn
<div class="input-group">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Go!</button>
</span>
<input type="text" class="form-control" placeholder="Search for...">
</div>

but if ya remote styles.min.css , its show

i can't use this theme , may i get back my money ?

thanks you
-peter-
button does not show ini input-group-btn
<div class="input-group">
<span class="input-group-btn">
<button class="btn btn-secondary" type="button">Go!</button>
</span>
<input type="text" class="form-control" placeholder="Search for...">
</div>

but if ya REMOVE styles.min.css , its show

i can't use this theme , may i get back my money ?

thanks you
-peter-
Hi,
You have to contact WrapBootstrap support to request refund. At the moment template doesn't support buttons inside input groups.
Regards
can I open it in visual studio 2013?
Hi, sure you can open it in any text editor.
kingsley PURCHASED
Do you use grunt setup I've provided with the template? If yes, you just need to replace jQuery inside src/vendor/J's and run grunt command to re-compile vendor.min.js.

Hi Rokaux, can you provide me the re-compile vandor.min.js with the ajax as function ?

I am not sure how to use the grunt.

thanks
Hi,
Please check your mailbox. Just sent re-compiled file. Regards
kingsley PURCHASED
i received it. thank you for your prompt reply..
You are very welcome ;)
I need to reinitialize the downcount on items added dynamically on a page.

Can you help me with that?

Thank you
Hi,
Could you send me PM with example of your ajax code. Regards
kingsley PURCHASED
hi
i notice when using the shop-single.html

when click on the magnifier to view the picture (picrture in square e.g. 300x300 ) in full screen the image seem to be stretch horizontally.

but when i check on PhotoSwipe, their picture show into the original dimension.
Hi,
The size of large image is controlled via data attribute data-size="1000x667". If your image 300x300 you have to change this attribute respectively.
Best regards
What does your 1.4 update mean for those of us that are just using the Distribution version? I am working on integrating your template into our shopping cart and it is a little frustrating dealing with updates, especially when scripts are all put in one file. I understand the load advantages of doing this but difficult to adapt to customized versions.
Hi,
Distribution files that are affected:
- vendor.min.css - updated Bootstrap from Beta 1 to Beta 2 (https://blog.getbootstrap.com/2017/10/19/bootstrap-4-beta-2/);
- vendor.min.js (only updated Bootstrap scripts)
- styles.min.css (some compatibility fixes)
- scripts.min.js (some fixes and improvements, see changelog)
Thanks, that's helpful. What do you suggest when customizing the templates for adding new custom css? I have been updating/changing styles.css but now I have to do a file compare to not lose my customizations.
Hi,
I understand your frustration. But customizing template is similar to customizing Bootstrap. You have to keep your styles separately from original framework styles to be able to update safely. My recommendation would be to keep your custom css in separate file and then combine them in one file on production. That's why I prefer modular SCSS system. It's more easy to maintain + most of the time you customize some general things like colors, fonts, etc. which can be customized via single variables.scss file. And after update you need to compare only one small file instead large .css file. But that's my point in favor of using SASS instead of vanilla CSS.
All points well taken. Thanks for responding.
Hi, I am new to HTML designing, I have used content of shop-grid-ns.html in my page but unable to see products grid. Its setting product item to display none. I am not sure what I have to set and where its applying this condition to set display none.
Please let me know.

Thanks,
Naveed
Hi Naveed,
Have you used latest Unishop version 1.4? And what Browser/OS you are tested it on?
Regards,
Roman
Yes, I am using latest version with chrome. If I execute downloaded version then all good. but when I copy product listing section in my own designed page, it don't display product items. Not sure what I am doing wrong.

Naveed.
zanart PURCHASED
Can I change the mega-menu so it opens on click, as opposed to on hover.?
Hi,
It's not possible out of the box.
In order to do that you would need to add custom JS. Something like:
$('.has-megamenu').on('click', function() {
$(this).find('.mega-menu').addClass('visible');
});
Then you have to add another JS to hide all mega menus when you click off the menu link. And also add 'visible' class to css.
This not step-by-step guide just an idea how to achieve behavior you want.

Regards
dwright71 PURCHASED
Great template and easy to integrate into .Net Core
- one thing though, the shopping cart drop-down needs a scrollbar around the cart items within it because there's currently no size limit. I don't think it's necessary to show all cart items, but showing the top-n within a box with a max height and overflow-y scrollable would be a good addition.

Regards,
DWright71.
Hi,
Thank you for the feedback, very much appreciated. I will consider adding this feature in one of future updates.

Best regards,
Roman
uonick PURCHASED
Hi!
Best way to apply green theme?
Hi,
If you don't need to customize styles than the best way is change link to styles-2ecc71.min.css in the head of your html document. This is default green skin.
If you do need to customize styles I would recommend using SASS. In this case you simply change $brand-primary variable in _variables.scss

Regards

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

$18
570Purchases

Licenses: Details »

Single application $18
Version:1.4
Type:
  • HTML Template
Bootstrap: Compatible with 4.x
Layouts:
  • Responsive
Browsers:
  • IE 11
  • Latest Chrome
  • Latest Edge
  • Latest Firefox
  • Latest Safari
Uses Less:No
Uses Sass:Yes
Categories:
Tags: blog, bootstrap 4, business, cart, e commerce, modular, online shop, responsive, sass, store
Item#:WB0148688
Released:3 months ago
Updated:2 weeks ago
Sold exclusively on WrapBootstrap
rokaux

rokaux

Signed up 1 year ago

Need an admin 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: