Larger product photo's as part of the page design

  • Posts: 138
  • Thank you received: 8
  • Hikashop Business
6 months 1 week ago #361394

Hi,

More and more shops have beautiful design as 1 of their main priorities for sales.
As convert experts agree that visuals are equally as important as specs, i think it's time for me to start working on this.

I don't want a normal image in the product description as that's the way it's been done the past 20 years, i would like it more stylish. Of course the stylish part (for example an image partially transparent or black/white for text overlay) can also be part of the description, but it's different from the old ways. But I see most modern shops with full with images inbetween. I will include an example. (or maybe go to the page in the url box for live viewing)



How can I implement such a thing on my product pages? Thanks.

Attachments:

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

  • Posts: 83007
  • Thank you received: 13398
  • MODERATOR
6 months 1 week ago #361396

Hi,

You can do that with custom CSS.
For example, with a bit of CSS modifications, I can reach this stage on one of your product pages:
i.imgur.com/fOQv35k.png
To do that, I had to disable this CSS for your template:
i.imgur.com/fH8bHfO.png
i.imgur.com/HLqeiHR.png
And add this CSS:
i.imgur.com/7WGDFgP.png

So basically, with customization of a bit of the HTML of the product / show_default view file override of your template, and a bit of CSS, you should be able to achieve this.
Since this is mainly things to be changed / overridden from your Joomla template, the best would be to check with your template provider if they could work on such customization for you. Since they know their template best, they'll know how to properly customize it to your needs so that you can still continue updating the template in the future without loosing the customization.
If they can't / won't, any web designer with enough knowledge in HTML and CSS should be able to do it.

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

  • Posts: 138
  • Thank you received: 8
  • Hikashop Business
6 months 1 week ago #361404

Hi,

The main issue is that my example is from a page that does this the modern way, many design(ed) images/infographics on many places on a product page, so let me ask it differently:

How can i add modules or components full width on a productpage? (like the related products is on the bottom)

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

  • Posts: 83007
  • Thank you received: 13398
  • MODERATOR
6 months 1 week ago #361406

Hi,

The related products on the bottom of your product details page already uses the full width made available by your Joomla template.

And if you want the content area of your template to use the full width of the browser window, then you can do it with CSS. For example:

.g-container {
    width: 100% !important;
}
And if you want this only for the product pages, then you can use this CSS instead:
.com_hikashop.view-product.layout-show .g-container {
    width: 100% !important;
}

As this is something relative to your template, and not much about HikaShop, you should normally ask this to your template provider, not us.

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

  • Posts: 138
  • Thank you received: 8
  • Hikashop Business
6 months 1 week ago #361412

Hi, are you somehow implying that i can use the related products container to fill with any of my other modules?
I don't understand how.

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

  • Posts: 83007
  • Thank you received: 13398
  • MODERATOR
6 months 1 week ago #361416

Hi,

I thought you asked how to have the related module take the full width of the window and not the restricted width allocated to the main area by the template.

If you want to add extra modules on the product page, you can either:
- select a position of your template in your module and use an extension like Advanced Modules Manager to restrict the module to only the type of pages "HikaShop product page".
- you could use a content tag like loadposition to add the module inside the description of the product.
- you could use a tag from the extension "modules anywhere" to add modules in a view override like product / show_default via the menu Display>Views.
What to do depends on what you need exactly.
Adding component pages on the product page will be difficult if the component you're talking about doesn't provide any way to include it's content elsewhere (that's why HikaShop has modules for products listings, so that you can include products listings anywhere in your website, not just as menu items).

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

  • Posts: 138
  • Thank you received: 8
  • Hikashop Business
6 months 1 week ago #361422

Yes i was afraid this would be the (only) option and i have installed modules anywhere some months ago for a first attempt but after install it crashed my complete site and i had to install a backup. So i would only have this done by an expert, but where to find one?

As this new way of product pages becomes the new industry standard, can you put it on the request list and take a look at the possibilities for future releases? Almost every big seller in America, england and my country has this new format now.

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

  • Posts: 83007
  • Thank you received: 13398
  • MODERATOR
6 months 1 week ago #361426

Hi,

Installing Modules Anywhere should not crash your website. If it does, I would recommend you contact the support of that extension. It's a popular extension, used by many Joomla users. They should be able to help you with this.
That's the first thing I would recommend.

Also, I didn't talk only about Modules Anywhere in my previous message. You could just use Joomla's loadposition tag to add modules on the product page via the description. Is there a problem with this ?

Regarding your last point, I'm still not clear about the "new way of product pages" you're talking about ?
From what I can see on the page of your example URL from your first message, it's basically a long page, with many pieces. You could do all that in the description of the product. And if you want it to be dynamically configurable, you can use the extension below:
www.joomlack.fr/en/joomla-extensions/page-builder-ck
With it, you can manage your products description (and Joomla articles), with a complete interface, with drag & drop, module insertion, advanced layouts, etc. It's quite powerful.
The free version there already allows for many things.
So I don't think HikaShop would have to add anything if that's what you want to do.

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

Time to create page: 0.074 seconds
Powered by Kunena Forum