How to add the Hikashop Cart Icon

  • Posts: 220
  • Thank you received: 0
10 years 1 month ago #176727

-- HikaShop version -- : 2.3.4
-- Joomla version -- : 3.3.3
-- PHP version -- : 5.3.29
-- Browser(s) name and version -- : Chrome 35

Dear all,
I am trying to do the same cart like the demo website. I have changed the following places, but still can't see the correct icon look. Can you guys nice to help me? I am trying to figure out for almost a month. Appreciate that.

1 Hikashop->Display-View->Product->( My Template Name) ->Cart.php. Added the code of these:

<div class="moduletable-cart">
<h3>MY CART</h3>
<div class="hikashop_cart_module" id="hikashop_cart_module">
<div id="hikashop_cart" class="hikashop_cart">
The cart is empty </div>
<div class="clear_both"></div></div>
</div>

2 Hikashop->Configure->CSS->Front End CSS. Added the code of these-

.moduletable-cart {
margin-left: 20px;
margin-top: 20px;
}
.moduletable-cart h3 {
padding-left: 15px;
padding-top: 5px;
color: #FFF;
font-size: 12px;
background: url(../images/cart_top.png) no-repeat;
height: 25px;
}
.moduletable-cart #hikashop_cart_module {
background-image: url(../images/cart_center.png);
background-repeat: no-repeat;
background-color: #14CBEC;
margin-bottom: 20px;
margin-right: 5px;
padding-bottom: 10px;
padding-left: 15px;
padding-right: 10px;
font-size: 11px;
text-align: left;
}

3 Extention->Module Manager->My Cart->Module Class Suffix, Added " moduletable-cart"

Here the first file is the demo site--
demo.hikashop.com/index.php?lang=en



And my website shows like the second file here

Attachments:
Last edit: 10 years 1 month ago by clairewang.

Please Log in or Create an account to join the conversation.

  • Posts: 13201
  • Thank you received: 2322
10 years 1 month ago #176736

Hi,

You don't have to add this code:

<div class="moduletable-cart">
<h3>MY CART</h3>
<div class="hikashop_cart_module" id="hikashop_cart_module">
<div id="hikashop_cart" class="hikashop_cart">
The cart is empty </div>
<div class="clear_both"></div></div>
</div>

This is generated by Joomla.
Thanks to the point "3" the class "moduletable-cart" is added and then the css of the point "2" is applied on that.

Please remove the edition in the product / cart view. And could you give us a link to your website, it will be easier for us to see what's happening.

Please Log in or Create an account to join the conversation.

  • Posts: 220
  • Thank you received: 0
10 years 4 weeks ago #177517

Thanks a lot, dear. My website is :http://joomla3.facianohaircare.com/

I had put image under the template\images\ and did as you suggested but still get the problem

Please Log in or Create an account to join the conversation.

  • Posts: 82906
  • Thank you received: 13378
  • MODERATOR
10 years 4 weeks ago #177542

Hi,

The issue is that the top image doesn't exist: joomla3.facianohaircare.com/media/com_hi.../images/cart_top.png

You used that CSS:
background: url(../images/cart_top.png) no-repeat;
and you put it in the frontend CSS of HikaShop which is in media/com_hikashop/css so your browser is looking for the image in media/com_hikashop/images.
Either put the image in that folder or change the CSS to search in the correct folder where you put your image and it will work (and it's the same for the other images of the CSS).

The following user(s) said Thank You: clairewang

Please Log in or Create an account to join the conversation.

  • Posts: 220
  • Thank you received: 0
10 years 4 weeks ago #177588

Thanks a lot, dear. I have change it as you said. But the look of the cart column square isn't correct. Too much gray space and the two images are cut off. Where can I change it?
joomla3.facianohaircare.com/

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
10 years 4 weeks ago #177659

Hello,
Adding this kind of CSS code will probably do the job :

.moduletable-cart h3 {
width: 100%;
}

The following user(s) said Thank You: clairewang

Please Log in or Create an account to join the conversation.

Time to create page: 0.100 seconds
Powered by Kunena Forum