Jump to content

[SOLVED] Having trouble reformatting the product page


Recommended Posts

In the first attachment is the product page as it displays by default.

The 2nd attachment is what I'd like it to look like.

Is this possible? I've been playing with the product.tpl file for awhile now and just can't seem to get it to look how I want.

Any help is greatly appreciated.


As shown in the 2nd attachment, I would like to:
remove image block
move "more info" to the top, left of the add to cart box (but remove the "More Info" tab), want this where the image block was
Show comments tag (as well as features, etc if I add them) at the bottom

15567_14iT1S8HOsSJIBcLnGoV_t

15568_hWuAgoJuvzKDtXAtTvgy_t

Link to comment
Share on other sites

I haven't test but you may try this after a backup of the original product.tpl file.

Locate


and suppress everything until

    

   <!-- left infos-->



You should see

   <!-- right infos-->



   <!-- left infos-->

       {if $product->description_short OR $packItems|@count > 0}




To remove the more info tab, locate

       {if $product->description}{l s='More info'}{/if}


and remove it (or comment it:

{*        {if $product->description}{l s='More info'}{/if} comment by mama2many yymmdd *}



To move the block, select

   {if $product->description}
       <!-- full description -->
{$product->description}
   {/if}



Cut it, and paste it the line after



Don't forget to add comments to explain all you've made.

Try it and after a few adjustments, it should work as you expect it.

Xavier



Link to comment
Share on other sites

Thank you very much. It took me a little while but I finally got it looking the way I want :)

I couldn't actually hide the image block completely because when I did - the add to cart function stopped working. I tried a couple fixes for that with no luck. That's ok though, I just changed the #primary_block #image-block code in global.css to make the block 100px both sides which is working out fine. I also changed the width's of the pb-right-column and pb-left-column in the global css to give the description a wider spot and narrowing the buy_block.

I've attached a screenshot showing how it looks now after changing the codes. Couldn't have done it without your help!

I am still having 1 minor problem, and it's probably just because I've been looking at the code too long and am overlooking something super simple.

But in the buy_block where it shows price, attributes, etc - I can't get those all to align up right. I've been using the FF addon to find the codes, and can get some stuff to move and not others. I'd like to center the price - I've tried changing the float, tried text-align, margins, etc with no success.
Also I've been trying to center the dropdown box and the quantity box under their titles and can't seem to get that either. Guess I could always try again tomorrow after my eyes have had a break.

15578_l03s0jRZcp5fwRkmU4mx_t

Link to comment
Share on other sites

Hi

To center the price bloc, edit product.tpl in your theme.
add division centerprice like this


{* Added by mama2many yymmdd center price *}
               {if !$priceDisplay || $priceDisplay == 2}
{convertPrice price=$product->getPrice(true, $smarty.const.NULL, 2)}
                       {l s='tax incl.'}
               {/if}
               {if $priceDisplay == 1}
{convertPrice price=$product->getPrice(false, $smarty.const.NULL, 2)}
                       {l s='tax excl.'}
               {/if}
 {* Added by mama2many yymmdd center price *}



Then edit ccs/globals.css

Locate #primary_block form#buy_block  span.our_price_display {


and change it to obtain

/* Added by mama2many yymmdd center price */
p.centerprice1 {
   text-align: center;
}
#primary_block form#buy_block  span.our_price_display p.centerprice1 {



In fact you just have to add a

tag to have text-align:center; works!

Xavier

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...