[Skip to main content](#vessel-content)

#   product images and add to cart graphic

##

- **[rshenje](/forum/user/4439-rshenje "View rshenje's Profile")**
- [![rshenje's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/4439-rshenje "View rshenje's Profile") Topic Author
- [ Offline](/forum/user/4439-rshenje)

Less More

- Posts: 21
- Thank you received: 0
-
-

14 years 8 months ago [\#40000](#40000) by [rshenje](/forum/user/4439-rshenje "View rshenje's Profile")  *[product images and add to cart graphic](/forum/2-general-talk-about-hikashop/40000-product-images-and-add-to-cart-graphic#40000 "I would like to change two things on my site: a) I have two images for each product and my product is currently displaying as two thumnails and the main image. The problem is the main image is the same size as the two thumnails underneath the main image. How can I change the main image so that it is larger than the thumnails? See   www.african-brand.com , click on any categoty listing and display a selected product to see what I mean. An example is on this link   www.african-brand.com/index.php?option=c...category&#95;pathway=552  b)How can I rationalise the link I provided in one above? Ideally I would like it to just show as   www.african-brand.com/index.php?{categor...b-Category}/{product } e.g.   www.african-brand.com/index.php ? {Music}/{South African}/{weding-specials-vol3-no-one-is-perfect}?  c) If you have visted the site above you would have seen that the add to cart graphic if I may call it that is very lame. How can I use the one on your demo site or other?  Thanks in advance")* was created by *[rshenje](/forum/user/4439-rshenje "View rshenje's Profile")*

I would like to change two things on my site:
a) I have two images for each product and my product is currently displaying as two thumnails and the main image. The problem is the main image is the same size as the two thumnails underneath the main image. How can I change the main image so that it is larger than the thumnails? See [ www.african-brand.com](http://www.african-brand.com), click on any categoty listing and display a selected product to see what I mean. An example is on this link [ www.african-brand.com/index.php?option=c...category\_pathway=552](http://www.african-brand.com/index.php?option=com_hikashop&ctrl=product&task=show&cid=5256&name=wedding-specials-vol3-no-one-is-perfect&Itemid=166&category_pathway=552)

b)How can I rationalise the link I provided in one above? Ideally I would like it to just show as [ www.african-brand.com/index.php?{categor...b-Category}/{product](http://www.african-brand.com/index.php?{category}/{Sub-Category}/{product)}
e.g. [ www.african-brand.com/index.php](http://www.african-brand.com/index.php)? {Music}/{South African}/{weding-specials-vol3-no-one-is-perfect}?

c) If you have visted the site above you would have seen that the add to cart graphic if I may call it that is very lame. How can I use the one on your demo site or other?

Thanks in advance

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzItZ2VuZXJhbC10YWxrLWFib3V0LWhpa2FzaG9wLzQwMDAwLXByb2R1Y3QtaW1hZ2VzLWFuZC1hZGQtdG8tY2FydC1ncmFwaGljP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86320
- Thank you received: 14276
-
-

14 years 8 months ago [\#40211](#40211) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Re: product images and add to cart graphic](/forum/2-general-talk-about-hikashop/40000-product-images-and-add-to-cart-graphic#40211 "I would like to change two things on my site: a) I have two images for each product and my product is currently displaying as two thumnails and the main image. The problem is the main image is the same size as the two thumnails underneath the main image. How can I change the main image so that it is larger than the thumnails? See   www.african-brand.com , click on any categoty listing and display a selected product to see what I mean. An example is on this link   www.african-brand.com/index.php?option=c...category&#95;pathway=552  b)How can I rationalise the link I provided in one above? Ideally I would like it to just show as   www.african-brand.com/index.php?{categor...b-Category}/{product } e.g.   www.african-brand.com/index.php ? {Music}/{South African}/{weding-specials-vol3-no-one-is-perfect}?  c) If you have visted the site above you would have seen that the add to cart graphic if I may call it that is very lame. How can I use the one on your demo site or other?  Thanks in advance")*

Hi,

a/ I looked at your page but the small thumnails don't have the same size as the big thumnail.
The small ones size is restricted in CSS with a height parameter so that can be changed in the CSS of HikaShop. For the size of the big thumbnail, that can be configured in the Files tab of the configuration with the corresponding options if you're using the latest version of HikaShop.

b/ You should turn on SEF in the joomla configuration. Then, in the configuration of HikaShop, there are some parameters in order to configure the way your SEF links will be generated.

c/ The add to cart button uses the CSS of buttons of your template. Your template apparently doesn't define any CSS for buttons, that's why it's displaying as a normal button.
You can either add custom CSS to your template so that your buttons have some styling like we did on our demo website:
.hikashop_product_quantity_main .hikashop_product_stock .button {
color: #167E93;
font-weight: bold;
background-image: url(../images/add_cart.png);
background-repeat: no-repeat;
background-position: right;
height: 32px;
padding-right: 40px;
background-color: transparent;
cursor: pointer;
}

Or you can just change the option "button display" from normal to CSS so that it uses a predefined CSS included in HikaShop.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzItZ2VuZXJhbC10YWxrLWFib3V0LWhpa2FzaG9wLzQwMDAwLXByb2R1Y3QtaW1hZ2VzLWFuZC1hZGQtdG8tY2FydC1ncmFwaGljP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[rshenje](/forum/user/4439-rshenje "View rshenje's Profile")**
- [![rshenje's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/4439-rshenje "View rshenje's Profile") Topic Author
- [ Offline](/forum/user/4439-rshenje)

Less More

- Posts: 21
- Thank you received: 0
-
-

14 years 8 months ago [\#40310](#40310) by [rshenje](/forum/user/4439-rshenje "View rshenje's Profile")  Replied by *[rshenje](/forum/user/4439-rshenje "View rshenje's Profile")* on topic *[Re: product images and add to cart graphic](/forum/2-general-talk-about-hikashop/40000-product-images-and-add-to-cart-graphic#40310 "I would like to change two things on my site: a) I have two images for each product and my product is currently displaying as two thumnails and the main image. The problem is the main image is the same size as the two thumnails underneath the main image. How can I change the main image so that it is larger than the thumnails? See   www.african-brand.com , click on any categoty listing and display a selected product to see what I mean. An example is on this link   www.african-brand.com/index.php?option=c...category&#95;pathway=552  b)How can I rationalise the link I provided in one above? Ideally I would like it to just show as   www.african-brand.com/index.php?{categor...b-Category}/{product } e.g.   www.african-brand.com/index.php ? {Music}/{South African}/{weding-specials-vol3-no-one-is-perfect}?  c) If you have visted the site above you would have seen that the add to cart graphic if I may call it that is very lame. How can I use the one on your demo site or other?  Thanks in advance")*

"b/ You should turn on SEF in the joomla configuration. Then, in the configuration of HikaShop, there are some parameters in order to configure the way your SEF links will be generated."

I have done this assuming the parameneters you are talking about are the four configuration issues under Hikashop&gt;&gt;Configuration&gt;&gt;Main&gt;&gt;SEF url options. There was no improvement after changing to the following configuration:
Simplified breadcrumbs: No
Activate smaller url: Yes
Category SEF name: category
Product SEF name: product
Is there somewhere else I should be looking at?

"c/ The add to cart button uses the CSS of buttons of your template. Your template apparently doesn't define any CSS for buttons, that's why it's displaying as a normal button."
I use the css you supplied. I think you gabe me the wrong css. Look again on your demo website you see the add to cart styling with the colour change on hovering on +/- for cart and the blue basket icon. Thats the styling I am looking for. Could you re-send the styling?

Lastly, if you take a look at the hikashop category listing menu on [ www.african-brand.com](http://www.african-brand.com) i.e. "our store", after changing settings for css on Hikashop&gt;&gt;Configuration&gt;&gt;Display&gt;&gt;CSS&gt;&gt;Front-end CSS File to "default" the menu intems are not aligned to the right as one would expect. which Css settings should I change? Wonder if you could give me the css used on the dem site as well, might use an altered version of that.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzItZ2VuZXJhbC10YWxrLWFib3V0LWhpa2FzaG9wLzQwMDAwLXByb2R1Y3QtaW1hZ2VzLWFuZC1hZGQtdG8tY2FydC1ncmFwaGljP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86320
- Thank you received: 14276
-
-

14 years 8 months ago [\#40494](#40494) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Re: product images and add to cart graphic](/forum/2-general-talk-about-hikashop/40000-product-images-and-add-to-cart-graphic#40494 "I would like to change two things on my site: a) I have two images for each product and my product is currently displaying as two thumnails and the main image. The problem is the main image is the same size as the two thumnails underneath the main image. How can I change the main image so that it is larger than the thumnails? See   www.african-brand.com , click on any categoty listing and display a selected product to see what I mean. An example is on this link   www.african-brand.com/index.php?option=c...category&#95;pathway=552  b)How can I rationalise the link I provided in one above? Ideally I would like it to just show as   www.african-brand.com/index.php?{categor...b-Category}/{product } e.g.   www.african-brand.com/index.php ? {Music}/{South African}/{weding-specials-vol3-no-one-is-perfect}?  c) If you have visted the site above you would have seen that the add to cart graphic if I may call it that is very lame. How can I use the one on your demo site or other?  Thanks in advance")*

b/ You should turn on SEF in the joomla configuration. The options you're talking about are in the HikaShop configuration.

c/ I gave you the CSS for the add to cart button, not for the +/- as you didn't requested it.
For that you should use:
.hikashop_product_quantity_main .hikashop_product_stock td a {
color: #14CBEC;
font-weight: bold;
background: url(../images/add_white_dot.png) no-repeat center;
padding-left: 15px;
padding-right: 15px;
padding-top: 3px;
padding-bottom: 3px;
margin-top: 3px;
}

Please note that for the CSS to display the same, you will have to have the images as well.

d/ You should add the CSS below for that:
.hikashop_category_list_item{ float: none !important; }

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzItZ2VuZXJhbC10YWxrLWFib3V0LWhpa2FzaG9wLzQwMDAwLXByb2R1Y3QtaW1hZ2VzLWFuZC1hZGQtdG8tY2FydC1ncmFwaGljP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

Board Categories HikaShop Install &amp; Update Product &amp; Category Display Content Creation Sales and Orders Orders management Reports &amp; Statistics Customers Checkout Payment Methods Shipping Methods Import &amp; Export (CSV, XLS…) Specific Features Affilation Taxes Wishlist Vote Carousel &amp; Slider Mass Actions Filters &amp; Search Discount &amp; Coupon Feature Request Integrations Showcase General Talk about HikaShop Development HikaShop 3.0 Beta Translation Commercial Jobs HikaShop Components HikaMarket Market: Feature requests Market: How to? Market: Bug Report HikaSerial General talk about HikaSerial Serial: Bug Report Serial: How to? Support en Français de HikaSerial (French Support) HikaSubscription HikaAuction Auction: Feature requests Auction: How to? Auction: Bug report Hikashop around the world Support en Français (French Support) Russian FAQ. Курс выживания с Hikashop. Частые вопросы и о Расширения Hikashop Наши сайты на Hikashop 日本語版サポート(Japanese Support) Thai German Archives Bug Report How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.064 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)

[](#top)
