Product Page margin

11 posts from 3 voices

• Started 5 months ago by Icarox
• Latest reply from Dude
• This topic is resolved

Tags:

• columns
• custom
• padding

1. 

   Icarox
   Member

   Hi,

   I'd like to change the padding of some issues in product pages, for instance "Related Products" all the way to the left, below Product image.

   Even show more related products, here is a link as an example:

   http://www.cuidatez.com/Screenshot1.jpg

   Thanks.

   Posted 5 months ago #
2. 

   Devin
   Moderator

   Hi Icarox,

   That isn't possible with the way the individual product pages are generated as they use a sidebar for the layout and it would require completely re-doing the pages to allow that content to expand all the way over.

   Regards,

   Devin

   Posted 5 months ago #
3. 

   Icarox
   Member

   Ok Devin,

   Thanks for your answer... ;-) And... is it possible to do 4 horizontal columns inside the short description?

   something like this:

   http://www.cuidatez.com/Screenshot3.jpg

   Rgds,
   Icarox.

   Posted 5 months ago #
4. 

   Devin
   Moderator

   You could use column shortcode to get the columns very easily. If you want the line borders, you'll need to create some new css instead of using the built in shortcodes.

   For example, put this into the visual editor for your product to get 4 columns:
   

   The product has a description and this is it!
   
   [one_fourth first]Content for 1/4 Column here[/one_fourth]
   
   [one_fourth]Content for 1/4 Column here[/one_fourth]
   
   [one_fourth]Content for 1/4 Column here[/one_fourth]
   
   [one_fourth]Content for 1/4 Column here[/one_fourth]
   
   Must have at least one line of text here to clear the columns!

   Make sure to keep that last line of text, it clears the columns so the add to cart button and such don't get messed up. The magic wand looking button in the visual editor tool bar will bring up the menu for the rest of the shortcodes.

   Regards,

   Devin

   Posted 5 months ago #
5. 

   Icarox
   Member

   Great Devin!!

   Works perfectly... I'll use the four column in html.

   Thanks a lot... great support!!

   Regards,
   Icarox.

   Posted 5 months ago #
6. 

   Icarox
   Member

   Oops, I realize one thing... if I put the columns....the "Add to Cart" button disappears...o:

   With columns:
   http://www.cuidatez.com/Screen_Products_wcollumns.jpg

   Without columns:
   http://www.cuidatez.com/Screen_Prod_wocollumns.jpg

   Every product is going to have this 4 columns ;)

   Rgds

   Posted 5 months ago #
7. 

   Devin
   Moderator

   You missed my last bit of instructions :)

   After you do the shortcode you *MUST* have at least one single line of text to clear the line and allow for the formatting to work properly.

   Regards,

   Devin

   Posted 5 months ago #
8. 

   Icarox
   Member

   Hehe.... sorry, I forgot to review that XD

   And... (sorry for being so picky...) Can I move the "Add to Cart" button above the short description, like I'm showing in this picture?

   http://www.cuidatez.com/Screen_Prod_changed_2.jpg

   Maybe in woocommerce-hooks.php?

   Thanks.

   Posted 5 months ago #
9. 

   Dude
   Dude

   I didn't test this mod but you can try it - open up abundance\woocommerce-config\config.php and replace:

   add_action( 'woocommerce_before_single_product', 'avia_title', 1, 2);

   with:

   add_action( 'woocommerce_before_single_product', 'avia_title', 1, 2);
   remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 30);
   add_action( 'woocommerce_before_single_product_summary', 'woocommerce_template_single_add_to_cart', 30 );

   Posted 5 months ago #
10. 

    Icarox
    Member

    Hi Dude,

    Works prefect! ;)

    Thanks!!!

    Posted 5 months ago #
11. 

    Dude
    Dude

    Hi!

    Great :)

    Best regards,
    Peter

    Posted 5 months ago #

RSS feed for this topic

Reply

You must log in to post.