Shopping Cart Module Button Styling

Hi,

Does anyone know how to change the CSS styling of the "Proceed to Checkout" button on the Hikashop Cart MODULE?

It if pulling off the:

a.hikashop_cart_button "class" (frontend_default.css file)

I don't want it to have the same styling as my "add to cart".


Would it make more sense to create another separate div id or class and adjust the php file in the module folder? If so, what code would I need to adjust/input in that php file?

Thanks for your reply,

I guess my issue is trying to get that module to use that different css styling. Which css file do I edit? Do I add a css class suffix in the backend module field?

I think I'm confused as to knowing how do I let that specific "proceed to cart" link go to the css styling you guys did on the demo.hikashop.com? Because right now, if I just copy that code, it won't do anything, won't I need to assign that "proceed to checkout" to the newly created class? How do I do that?

It seems like if I edit that file, the "add to cart" will also be affected.

Here is the demo site:
dd.smiwebsites.com - older version of site but button styling is still the same.

Using JAt3 template.

Hey Nicolas,

I don't think I'm retarded but am just not getting your solution. I tried inputting the same exact css code into the frontend in the config, and even tried it with the frontend-default.css in the media folder.

When I firebug the "proceed to checkout", that specific module is pulling from the same style of "add to cart". I can see if the proceed to checkout was asking for another divid or style, then it would be easy to edit via css by either the template or frontend file.

AM I missing something here?

Thanks for your help

Hey I appreciate you trying to help me with this.


Link:

www.dd2.smiwebsites.com

If you could tell me what's wrong, that would be great.

por favooorrrr tengo mi web y no me aparce el carro de compras ya le modificamos la linea y nada esta es www.drpcecuador.com gracias por la molestia de constestarme

Hi,

Sorry but I don't understand your issue. Do you want to customize the cart module in order to display an icon ?

Si amigo, ya cambie el codigo que vi en otro foro que pusieron pero no me funciona no me aparece el icono del tipico carro de compras, por lo demas el hickashop me parece genial, dame una mano porfavor, como viste en mi web solo me aparecen texto en el carro de compra si compro algo me sale un objeto o el carro de compra esta vacio que recien lo desactive, esto hice para corregirlo y no me funciono, como todo en Joomla! , se puede mostrar, pero esta no es una opción de Hika que traiga por defecto en su módulo "cart" . Deberás, bien trabajar con una plantilla para Hika, o realizar un desarrollo vía CSS, etc. Un ejemplo sencillo es ir al fichero de traducción System > Configuration > Languages >, editar el idioma, por ejemplo Spanish, buscamos la traducción de ADD_TO_CART y la sustituimos por

ADD_TO_CART="<i class="icon-cart" > </i>AÑADIR AL CARRITO"

La clase icon-cart mostrará a partir de ahora un icono de carrito en el botón añadir al carrito.
Joomla! 3 viene con Bootstrap (hoy 2.3) , que facilita la construcción de contenido predefinido, como los iconos.
Te dejo el enlace donde tienes muchas otras combinaciones de iconos
getbootstrap.com/2.3.2/base-css.html#icons
Icons by Glyphicons Icon glyphs 140 icons in sprite form, available in dark gray (default) and... -
getbootstrap.com

Hello,
Can you show me where do you exactly want to add your icon through some screenshot for example ?
Thanks.

Gracias por responder, quiero ponerle el carrito en la posición rigt fija asi como esta el boton del chat, pero en la parte de arriba,gracias nuevamente.

Gracias por responder, quiero ponerle el carrito en la posición rigt fija asi como esta el boton del chat, pero en la parte de arriba,gracias nuevamente.

The solution will just be to use some CSS code like :

#hikashop_cart .icon-cart {
background-image: url('YourCartIconURL');
}

Hi,

I tried to use this solution by copy and pasting the suggested CSS into the front css and changed the url to the location of the shopping cart in my site but it didn't work.

It still says "shopping cart empty" rather than a shopping cart icon.

I get a page 404. Is the forum program trimming the URL?

I read the documentation. But I am still not clear as to go about replacing the words "Your shopping cart is empty" words with just an icon of a shopping cart.

I tried using the CSS code I found in a related posting but it seem to not work.

I"m posting the CSS here.

#hikashop_cart .icon-cart {
background-image: url('/images/shoppingcart.png');
}

I also would prefer to change the font type, size and colour attributes of the cart when displaying "Total: $xx.xx". What attribute do I change?


Thank you in advance!