WordPress.org

Forums

WooCommerce - excelling eCommerce
[resolved] 'Single Product' Page - Adding top margin (above product title/ header) (5 posts)

  1. CRMacDonald5
    Member
    Posted 1 year ago #

    Hey everybody,

    I'm looking for help in adding some space above the product title in the single product page within the text block.

    Specifically, I would like to add spacing above the 'Paradigm Curve | Byzantine' product title here:

    http://paradigmcurve.com/?product=paradigm-curve-byzantine

    Any help in this regard would be greatly appreciated!

    Cheers*

    https://wordpress.org/plugins/woocommerce/

  2. CRMacDonald5
    Member
    Posted 1 year ago #

    Solved-

    I edited the following child theme file:

    ...child-theme/woocommerce/single-product/title.php

    Before edit:

    if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

    ?><P>
    <font color="white"><h2 itemprop="name" class="product_title entry-title"><?php the_title(); ?></h2></font>

    After edit:

    if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly

    ?><P>
    <font color="white"><h2 itemprop="name" class="product_title entry-title" style="margin-top: 2em"><?php the_title(); ?></h2></font>

    Hopefully this helps future inquiries people may have relating to this subject.

    Cheers*

  3. CRMacDonald5
    Member
    Posted 1 year ago #

    EDIT:

    I've found an alternative way to customize the size, colour, and padding of the Woocommerce 'Single Product' page title:

    - Dashboard > Appearance > Editor > style.css
    - Add the following coding:

    .product_title {
    color: #ffffff !important;
    font-size: 18px !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    }

    That's it. Hope this helps others*

  4. CRMacDonald5
    Member
    Posted 1 year ago #

    EDIT:

    Ok, the coding I just posted works very well; however, while it customizes the product title, the padding applies to the title while leaving the product image in its original spot (now slightly above the product title).

    So here is the final edit:

    .product_title {
    color: #ffffff !important;
    font-size: 18px !important;
    }

    .single-product .product { padding-top: 10px !important; }

    This allows you to edit the color and font size of the single product title, while adding space/ padding to both the single product image AND the single product title. This makes it aesthetically more uniform and even.

    Cheers*

  5. Spilopmager
    Member
    Posted 4 months ago #

    Thx, CRMacDonald5 for your code.

    After spending hours looking for a solution like this - with many solutions not working at all. Your code worked perfectly and made it possible for me (with almost no knowledge of php) to tweek my homepage.

    So thx a lot !!!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WooCommerce - excelling eCommerce
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic