Change Design of product tabular

  • Posts: 10
  • Thank you received: 0
  • Hikashop Essential
6 months 2 weeks ago #361337

-- url of the page with the problem -- : anton.bof-shop.at/aepfel/product/105-bratapfel
-- HikaShop version -- : 5.0.4
-- Joomla version -- : Joomla! 5.1.0 Stable
-- PHP version -- : 8.1.27

Hi all

I'm really try to change the design of the tabular on my product site. After my update from Joomla 3. to 5. it changed and I absolutly don't find the properties to change the layout

At the moment the heads of the tabel is on the left site and the content is on the right side. But this doesn't work for the responsive design. Therfore the heads must on the top of the tabular and the content below.
On my old side it will be display correctly. It seems, that the configuation of both sides are similar and there is no override in the View files.

new: anton.bof-shop.at/aepfel/product/105-bratapfel
old: bof-shop.at/aepfel/product/105-bratapfel

I hope you can help me.
Cheers,
Markus

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

  • Posts: 83007
  • Thank you received: 13398
  • MODERATOR
6 months 2 weeks ago #361341

Hi,

Your new Joomla template has custom CSS in order to display the tabs like this.
It is made by the CSS code:

#hikashop_tabs_div > div, #hikashop_tabs_div #hikashop_comment_form {
  margin-left: 250px;
}
#hikashop_tabs_div .hikashop_tabs_content {
  border: none;
}
.hikashop_tabs_ul {
  margin: 0;
  float: left;
  width: 220px;
}
.hikashop_tabs_ul li {
  border: none;
  display: block;
  background: none;
  padding: 15px 0px;
  font-weight: normal;
  transition: all 200ms ease-in;
}
.hikashop_tabs_ul li.hikashop_tabs_li_selected {
  color: #f7335d;
  padding: 15px 10px 15px 20px;
  background: #f1f1f1 !important;
  border-left: 3px solid #f7335d;
}
.hikashop_tabs_ul li:not(:last-child) {
  border-bottom: 1px solid #f1f1f1;
}
in the file /media/templates/site/tp_shop/css/compiled-3d9f8f2f899cf8fcfd38aeb2b2713ad5.css from what I can see with the inspector tool of my browser. However, this is a CSS file compiled by your template. I don't think it's a good idea to just delete the CSS code in there. Because when the template recompile its CSS, it will probably be back.
I would recommend contacting your template provider in order to ask them what they recommend you do.

The following user(s) said Thank You: Tartaruga

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

Time to create page: 0.053 seconds
Powered by Kunena Forum