News:

Support the VirtueMart project and become a member

Main Menu

Change order elements of product layout view

Started by Langagemachine, October 14, 2019, 15:46:10 PM

Previous topic - Next topic

Langagemachine

I would like to find an alternative when configuring the bootstrap in the VM config.
The loading cursor who seeks and turns indefinitely.
When i look product view with my phone, the text is beside the image and I'd like the text and other elements to be below the image
I thought to override product layout view.
It's possible to change order of elements ?
And how can i do ?

I have the last joomla and virtuemart version

Regards.

jenkinhill

Quote
I have the last joomla and virtuemart version

So you have Joomla 3.0.12 and VirtueMart 3.6.3.10163 or 3.6.2.10159? 

It looks like you are using the VMBeez template. Changing the Layout Bootstrap version in VM config will have no real effect as only the BS4 CSS is partly written. Use None (Legacy)

To change the order of the elements you will need to edit template files and create overrides. Start with components/com_virtuemart/views/category/tmpl/default.php


Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Langagemachine

Hi, no it s a template i made with template ck creator.

Ok for the /category/tmpl/default.php is correct for change product detail page ?
Can you inform waht part of code i change it ?
Regards


Langagemachine

I look this
<div class="vm-product-container">
<div class="main-image">
<div class="vm-product-details-container">

jenkinhill

Ah, sorry, I was working on a category view layout for a client and did not reprogram the brain into productview mode.

A simple way to move the price block using default VM templates is by CSS override;
.vm-product-details-container {    float: none;  }
Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Langagemachine

Ohh sorry
Virtuemart
3.6.2 10036  :)
I try this
Where is the files css please ? components\com_virtuemart\ ?????

jenkinhill

I always use a custom.css containing all my override styles for the Joomla template and any loaded extension elements that need styling. I code the template header so this file is loaded after all other CSS files.

I gave you that code snippet, but if you want it only to be used on a small (phone) screen then you would have to make it conditional on the display size.
Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

Langagemachine

Thanks Super Hero for your reply.
Im' not a speshitpillt to override css.
I can override template of virtuemart. Think you it's possible.
I just know what is the template for product detail.

Mande

Langagemachine

Hi i have the solution from S42 to VM Forum fr
Here the issue:
Add to SITEJOOMLA/templates/TEMPLATE_NAME/css/custom.css

the media query :
@media (max-width: 768px) {
.vm-product-container .vm-product-media-container {
float: none;
width: auto;
}
}

;)