MT Ghost Theme - we had a 3rd party start the website because of time. The problem is, I am not able to change anything. There is a lot of "white space" on the product detail page that makes the main image small, the right column "related products" images are actually bigger than the main product image. The image cloud zoom is small. I can go into the configurations and change the swatches size, but nothing else seems to change anything. How do I override there CSS upload they originally did without doing another CSS upload to change the column sizes? I look all through these discussions and anything I tried on the product design tab or on the category custom design tab has worked. Any ideas?
-
If the styling you have now was done by CSS, it will probably require CSS to override or change it. The Design tab in the products & categories is for XML, not CSS. However you can use this area to add a call to a custom css sheet for just this product or category page. Can you provide the URL of your site?– Steven JCommented Aug 15, 2017 at 17:32
Add a comment
|
2 Answers
I don't know if this is exactly what you want, but if you want to update a product page template, you have to do this:
Go to app/design/frontend/{package}/{theme}/layout/local.xml then add the code bellow before </layout> tag
<catalog_product_view>
<reference name="root">
<action method="setTemplate">
<template>page/2columns-left.phtml</template> //or 2columns-right.phtml
</action>
</reference>
</catalog_product_view>
Dont forget to clear a cache.
Jamie, thank you for writing back and posting your URL. I have found the issue and believe I have a resolution for you. I believe the problem lies in your view.phtml file - but depending on what you find there, may actually be set from your theme's configuration area in the admin.
What I'm seeing:
<div class="product-essential show-grid">
<form action="..." method="post" class="col-lg-9 col-md-9 col-sm-12 col-xs-12" id="product_addtocart_form">
This col-lg-9 col-md-9 is what is limiting your main product area from expanding to the full width of the page, thus leaving the blank spot. You can find this code in your /app/design/frontend/PACKAGE/THEME/catalog/product/view.phtml file. It will either be hardcoded or have PHP calls to variables which are being set by your configuration.
If it's hardcoded - change col-lg-9 col-md-9 to col-lg-12 col-md-12 - save the file and clear your cache. You should see the product area take up the missing portion. This will not override the right-column layout, as it uses CSS styles with percentages to fill up the given area.
If it's PHP calls to variables, look through your theme's settings. I found documentation for your theme but did not see any mention of column settings in it's configuration.
There is also this empty area of code sitting below it:
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 col-md-3"> </div>
This is "filling" up the blank space, but is easily hidden or removed (unless it's being used elsewhere as a false right-column. To temporarily hide it, add style="display: none !important;" - save the file, and clear your cache. Browse around your site's product pages to see if anything is missing. The changes mentioned above would push this area below the product description tabs and above the footer area you have setup.
