News:

Looking for documentation? Take a look on our wiki

Main Menu

Product Page Display looks really bad need to style or select a theme

Started by David Bellamy, March 04, 2013, 04:20:18 AM

Previous topic - Next topic

David Bellamy

Product Page Display looks really bad. Need to style or select a theme.
Attached is an example of out of the box using Rocket Theme Quasar.

I just want to reposition and maybe re-size the photo and bring the pricing and add to cart up to the right and on the same level. Then just bring up the description. I just want a simple basic easy to follow display.
I am working on a local server and will upload once I get the shopping cart product display and category display working correctly.
All suggestions welcomed.

Thanks

David B.


[attachment cleanup by admin]

jenkinhill

Your display is heavily influenced by the RT/Gantry css, so as well as making VM template edits you will also need to look at the related css.

You can easly rearrange the layout with just basic HTML, PHP and css knowledge. The aim is to create template overrides with your revised layout, so the revisions do not get overwritten with VirtueMart updates.

The product detail templates are in  joomla_root/components/com_virtuemart/views/productdetails/tmpl/

The edited override file(s) should be placed in joomla_root/templates/(your_template)/html/com_virtuemart/productdetails/

Plenty of references in the forum.
http://forum.virtuemart.net/index.php?topic=90935.0
http://forum.virtuemart.net/index.php?topic=98505.0
http://dev.virtuemart.net/projects/virtuemart/wiki/Hints_for_the_use_of_the_template_system
http://www.ostraining.com/blog/joomla/overrides
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

David Bellamy

Kelvyn,
Thanks you very much for your explanation. I read every link and followed your instructions in terms of making a copy of the default.php file and creating the new override file in the new location. Once I got there I encountered a problem. I don't how to read or edit the default.php file. I can open it and edit. Just don't know what to edit to change the layout. I just want the basic image on the left and product details on the right with the description below.
I opened firebug and inspected the image area and found the line of html that  I needed to edit. It was the image width that was causing the problem. It was set to 50% and I changed it to 40% in firebug and the display changed to the correct layout that I wanted. I am not able to find that html file to edit it and I don't know what to edit in default.php to create an override. Please help.

David Bellamy

I used CSS to correct all of my layout and display issues. Now that this is done should I make copy of default.php and put in the override folder. Did default.php update dynamically as a result of the changes that I made or do I have to manually edit the php file and copy and place in the override folder. If I do not do anything will I lose changes when I update virtuemart?
Thanks
David

jenkinhill

Add your new css to the end of your Joomla template css file so it will not be overwritten when VirtueMart updates.

Make a directory (your_joomla_template)/html/com_virtuemart/productdetails/  and put any edited product detail default.php in there to act as override.
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

David Bellamy

Thank you O Fearless Leader!
You are truly a Superhero.
Able to turn pure darkness into light at the stroke a keyboard and other cool things like jumping over a continent in a single bound and recusing foot soldiers.

Thanks again!