Hika Shop page styles break with a joomlart temp.

  • Posts: 197
  • Thank you received: 5
  • Hikashop Business
11 years 9 months ago #95536

I built a shop in Joomla 3.0 and while I was using the default template, the shop styles looked like a nice grid with rounded corner boxes, which pretty much is fine as far as my client is concerned.

I then loaded a Joomlart template (Zite) with which I am familiar. Immediately all the Hikashop pages lost their styling and layout. So while in the default Joomla 3.0 template the products diusplay in a nice grid with obvious CSS styling, in Ja Zite they are completely unadorned and each product displays above the next.

In addition, in both templates the category Image is humongous and I haven't been able to figure out how to make it smaller.

I have looked at both templates with firebug and it looks like they both have the Hikashop CSS inserted in the <head>, but I wasn't able to find a reason for the styles not displying. I gfigure they may be getting overriden at some point, but so far no culprit.

Here is the default template:




And here is what it looks like when I load zite:




What I need is just being pointed in the right direction. I can probably figure out the rest myself.
Thank you for your help.

Attachments:

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

  • Posts: 197
  • Thank you received: 5
  • Hikashop Business
11 years 9 months ago #95542

Well, at least I found where the products are being styled, which is in the template.css file of the default template. That explains why the new template does not style the product display.

Does that mean that I have to create my own css styling in order to have a default view of the shop or have I missed some switch in the administration?

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

  • Posts: 13201
  • Thank you received: 2322
11 years 9 months ago #95600

Hi,

In HikaShop > Config > Display > CSS, you can change the value of the option "Front-end CSS File" to "none" to not use the HikaShop css file.
If you have conflict with you default template and the new one, it's not related on HikaShop.

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

  • Posts: 197
  • Thank you received: 5
  • Hikashop Business
11 years 9 months ago #95694

Thank you for your replay. I had already done that, but there is something I don't understand.

When I load the default template in Joomla 3.0 Hikashop is styled as shown in the screenshot above. If I turn off the custom css file, nothing changes. That's because those styles are actually in the template css file and not in hikashop. In fact, in either template, setting the frontend CSS file on or off seems to make no difference at all.

That's puzzling because without the code in the default template, things like calculating the width of the columns in the shop doesn't work at all. Each product or category takes the entire row and it ignore how I set the columns in the administration of the shop. That seems strange to me because the shop should not be relying on a joomla template for things like that. I can understand the styling of the product pictures, titles, etc. but the columns should still work, yet they don't.

I basically need to know if I need to go ahead and copy the styles from the Joomla's Protostar template or if there is another strategy I can use. I also want to make sure that it's not this template I am using acting up. I am pretty sure that hika shop should have at least a basic default layout and style, but that's not the case in this build I am working on. It seems that either Hika shop is completely unstyled or Protostar's css is overriding it. The former seems more likely because there is no style in the Joomlart template at all. Regardless of what I set as css file in the backend.

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

  • Posts: 197
  • Thank you received: 5
  • Hikashop Business
11 years 9 months ago #95713

I think I am getting a bit of a grasp on this.

I have created 2 pages and I assigned a different template to each.

This is the joomla 3.0 default template: seogarden.com/pear/index.php?option=com_...t=listing&Itemid=137

And this is the Ja Zite Joomlart template: seogarden.com/pear/index.php?option=com_...t=listing&Itemid=135

The page is identical and in hikashop I set it to show the default hikashop CSS file.

It's clear that something is a bit strange, because along with not recognizing the styles such as round corners, border, etc. It also doesn't recognize the columnar display.

In firebug if one goes to seogarden.com/pear/index.php?option=com_...t=listing&Itemid=137

<li class="span3 hikashop_category hikashop_category_column_1 hikashop_category_row_1">

The relatiove CSS that orders the categories in columns is:

.row-fluid .span3 { width: 23.4043%;}

However, when I go to seogarden.com/pear/index.php?option=com_...t=listing&Itemid=135

and look at <li class="span4 hikashop_category hikashop_category_column_1 hikashop_category_row_1">

There is no trace of the equivalent css rule. Yet, the css file containing the rule is there. To make sure, I even added it to the template.css of the zite template and it's simply not recognized. This is totally baffling. All I want is for hika shop to work in any template I load but it seems it only works with the default template in Joomla 3.0. It makes no sense.

I am going to leave the pages as they are. I am not expecting anyone to do the work for me, I just would like to understand why loading any template other than the default joomla 3.0 template produces a completely unstyled hika shop without a grid. Thank you.

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

  • Posts: 26168
  • Thank you received: 4030
  • MODERATOR
11 years 9 months ago #95749

Hi,

Your template "zite" is not a bootstrap template. It does not respect the recommendations of Joomla 3 templates.
You can deactivate the bootstrap mode in HikaShop in the configuration : "display" / "General display" / "Use bootstrap design".

At this moment it would no more use the bootstrap styles (span4, etc).

Regards,

Jerome - Obsidev.com
HikaMarket & HikaSerial developer / HikaShop core dev team.

Also helping the HikaShop support team when having some time or couldn't sleep.
By the way, do not send me private message, use the "contact us" form instead.

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

  • Posts: 197
  • Thank you received: 5
  • Hikashop Business
11 years 9 months ago #95855

Thank you. I saw it was using bootstrap, but obviously Joomla 3 is too new for me and I didn't know it used Bootstrap. That makes perfect sense. Thanks

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

Time to create page: 0.091 seconds
Powered by Kunena Forum