Community Forums

Modify Product Page Layout

Template support & advice for OpenCart v1.x

Modify Product Page Layout

Postby dsk2006 » Sat Feb 04, 2012 6:35 pm

Hello, i have a question about the layout of product page in default template. how i can get the price inside a tab and all other fields in a tab on the right side of the image ?

Here an example: http://themes.webiz.mu/opencart/apparel/index.php?route=product/product&product_id=69

My OpenCart Version is: 1.5.1.3

Thanks for any help,

Sebastian Korbel
Hello World !
Sebastian Korbel
http://www.webdesignlivorno.com
dsk2006
 
Posts: 3
Joined: Sat Feb 04, 2012 6:31 pm
Location: livorno

Re: Modify Product Page Layout

Postby yellow_cake » Sun Feb 05, 2012 5:24 am

This will require some work in the product.tpl and stylesheet.css file.

For example: If I wanted to move the "Add to Cart" button, I would move this code in product.tpl
Code: Select all
      <div class="cart">
        <div><?php echo $text_qty; ?>
          <input type="text" name="quantity" size="2" value="<?php echo $minimum; ?>" />
          <input type="hidden" name="product_id" size="2" value="<?php echo $product_id; ?>" />
          &nbsp;<a id="button-cart" class="button"><span><?php echo $button_cart; ?></span></a></div>
        <div><span>&nbsp;&nbsp;&nbsp;<?php echo $text_or; ?>&nbsp;&nbsp;&nbsp;</span></div>
        <div><a onclick="addToWishList('<?php echo $product_id; ?>');"><?php echo $button_wishlist; ?></a><br />
          <a onclick="addToCompare('<?php echo $product_id; ?>');"><?php echo $button_compare; ?></a></div>
        <?php if ($minimum > 1) { ?>
        <div class="minimum"><?php echo $text_minimum; ?></div>
        <?php } ?>
      </div>

right after <?php echo $description; ?> and before </div>
in the following code:
Code: Select all
  <div id="tab-description" class="tab-content"><?php echo $description; ?></div>

By doing this, you are moving it to the Description Div. After You have moved it, you will need to edit the layout to how you would like in the stylesheet.css.

Note: Pay attention when moving some of the code around. For example, if you're moving the "product-info" Div, be sure to also keep the "php if" code along with it.
See Example:

Code: Select all
<?php if ($options) { ?>                <---- Don't forget to keep this line before the Div
<div class="options">
......
.......
......
</div>
<?php } ?>                               <---- And this one after the Div


I know this isn't a direct fix answer to your question but hopefully it will get you on the right track.
yellow_cake
 
Posts: 25
Joined: Fri Feb 03, 2012 10:28 am

Re: Modify Product Page Layout

Postby dsk2006 » Sun Feb 05, 2012 6:49 am

Thank's a lot i will try it out today and i let u know :-)

Thanks for the great reply,

Sebastian
Hello World !
Sebastian Korbel
http://www.webdesignlivorno.com
dsk2006
 
Posts: 3
Joined: Sat Feb 04, 2012 6:31 pm
Location: livorno

Re: Modify Product Page Layout

Postby Bg-foxx » Tue Feb 28, 2012 6:18 pm

dsk2006 wrote:Hello, i have a question about the layout of product page in default template. how i can get the price inside a tab and all other fields in a tab on the right side of the image ?

Here an example: http://themes.webiz.mu/opencart/apparel/index.php?route=product/product&product_id=69

My OpenCart Version is: 1.5.1.3

Thanks for any help,

Sebastian Korbel


Hi Sebastian. Did you manage to change the product.tpl layout to the one on the link in your initial post? I am trying to achieve the same result but I don't trust my programming skills to get to the same result :-[

Any info is appreciated.

Ivan
Bg-foxx
 
Posts: 37
Joined: Tue Feb 21, 2012 6:55 pm

Re: Modify Product Page Layout

Postby spartanproducts » Mon Jul 21, 2014 8:36 pm

Hi, I just stumbled upon this and was wondering if you could help me out. I'm trying to achieve the same thing, only, where is says description and review, is there a way to create more tabs along that line? and if so, is there a way to fit a custom t-shirt designer within one of those?
spartanproducts
 
Posts: 3
Joined: Fri Jul 18, 2014 1:15 pm


Return to Template Support

Who is online

Users browsing this forum: No registered users and 23 guests

Hosted by Arvixe Web Hosting