[Resolved] How to change the layout?

Home Forums Support [Resolved] How to change the layout?

Home Forums Support How to change the layout?

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #1573667
    Paul

    hi, how are you?

    please kindly check the URL link about my issue below:

    https://prnt.sc/vzdrxo

    1- i do not want to show the price, that is to say the number 1
    2- i do not want to show the content of the number 3
    3- i want to move content of the number 2 to the position of the number 4

    Also, i attached my the product link in the private information and please check it

    looking forward to your reply
    thanks in advance
    regards

    #1573699
    Leo
    Staff
    Customer Support

    Hi there,

    This question is sort of out of the scope of our support forum here as the theme itself doesn’t decide what displays in WooCommerce single product page as that’s all handled by WooCommerce itself.

    The CSS below should help you to get started:

    1 & 2 Try this CSS:

    .woocommerce div.product p.price, .woocommerce-variation-add-to-cart {
        display: none;
    }

    3. Try this CSS:

    .single-product .entry-summary {
        display: flex;
        flex-direction: column;
    }
    .woocommerce-product-details__short-description {
        order: 2;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1573718
    Paul

    Hello Leo,

    Yes, I know that this is out of the scope of our support.

    Thanks much for your help and they are Ok with my questions. And I’m sorry that i m not good at the css code.

    Again, can you help me again with the last one?

    1- how to adjust the space between a, b, and c? https://prnt.sc/vzf0lw
    the space of the number 1 is small and the space of the number 2 is two big?
    if section b moves down a little and it looks nice.

    2- how to delete the tab of ” additional information” by CSS code?

    Thanks again for your help
    regards

    #1573834
    Leo
    Staff
    Customer Support

    Try this CSS:

    .woocommerce div.product form.cart {
        margin-bottom: 0em;
        margin-top: 1em;
    }
    .woocommerce-tabs li#tab-title-additional_information {
        display: none !important;
    }
    #1573903
    Paul

    hi Leo,

    Realllllllly thanks toooo much for your help and kindness. Added that code and everything look so beautiful and nice.

    Very much appreciating the excellent service from Generatepress.

    Would you like to advise where I CAN check or learn some code or documents helps about woocommerce? If possible, please show me the websites or URL link for that.

    Thanks much again.

    #1573933
    Paul

    hi, leo

    now I am using Smart Slider Pro 3 for my homepage.

    1- https://prnt.sc/vzkckd
    if I change top padding from 50 to 0, you will find this issue (https://prnt.sc/vzk1ue)for BreadCrumbs in the product page. But space 1 (https://prnt.sc/vzk0rn) of the homepage will disappear.

    if i change top padding from 0 to 50, BreadCrumbs in the product page is https://prnt.sc/vzk91n, but space 1 (https://prnt.sc/vzk0rn) of the homepage will come back. because it is a long distance from the background color of the body and looks not good

    so, how to adjust them to satisfy the space from the homepage and BreadCrumbs?

    2- If I move the smart slider up with a height of number 2 (https://prnt.sc/vzk0rn), how and where do I adjust the settings?

    Looking forward to your reply and thanks in advance.
    Regards

    #1574139
    David
    Staff
    Customer Support

    Hi there,

    instead of adding your slider to the Page content.
    Create a Hook Element:

    https://docs.generatepress.com/article/hooks-element-overview/

    Add your slider shortcode to the hook content.
    Select Hook: generate_after_header
    Check: Execute Shortcodes
    Set your Display Rules for the page(s) you want it displayed on. For your home page the Location is: Front Page

    This will place the slider immediately below your site header which is outside of the padding main container.

    #1574183
    Paul

    hello david,

    thanks so much for your help and very very useful for this issue.

    I’m sorry that there is a new issue and pls check this screenshot https://prnt.sc/vzr25b

    how to move this part up to the line of white background?

    Thanks in advance
    regards

    #1574256
    David
    Staff
    Customer Support

    Ok – the best thing to do when you want to have a page that has full width content is to set the Content Container to Full Width in the page editor:

    https://docs.generatepress.com/article/content-container/

    Install the GenerateBlocks plugin:

    https://wordpress.org/plugins/generateblocks/

    Now all of your page content will be full width without padding. You can add your Slider back to the page as the first block and remove the hooked slider.

    Use the Container Block that comes with GenerateBlocks to create each section you require. You can set its inner container width and padding for each section.

    You may also want to replace the core Columns Block with the GB Grid Block as this has full responsive controls.

    #1574283
    Paul

    hi david
    thanks for your fast response and kindness.

    i will try the method you told me above.

    now we can not create the Element or add extra CSS code for adjusting the space of the slider?

    regards
    paul

    #1574481
    David
    Staff
    Customer Support

    It is possible to fix a bunch of things with CSS but that generally can spiral into one fix requiring another, and as you’re using Full Width content in the page it is best to go down the route i suggested, it will save a lot of headaches over time.

    #1578254
    Paul

    hello david,

    how are you?

    i already installed the GenerateBlocks plugin and Lightweight Grid Columns plugin

    1- If using Hook Element you told me in the first time, the final screenshot is https://prnt.sc/w1m8jq

    2- If using GenerateBlocks plugin you to me in the second time,

    First, installed this plugin, then block the Hook element of the first banner from smart slider pro 3,

    I will go back to the page of HOME to add one Container, copy the shortcode of the first banner from smart slider pro 3 in the Container (https://prnt.sc/w1mcdx)

    After i saved the changes, then the screenshot of the homepage is https://prnt.sc/w1mdag

    I dont want the space 1, 2, 3

    I want to keep this https://prnt.sc/w1lvmo

    Finally, i dont want have extra spaces and also i need this responsive Product Carousel from Smartslider3. we already bought this service and want to use them directly.

    One more thing, Can i make this responsive Product Carousel with the GenerateBlocks plugin and Lightweight Grid Columns plugin ??

    #1578420
    David
    Staff
    Customer Support

    The simplest solution is just to build your page with the GenerateBlocks plugin.
    But first you need to set the Content Container to Full Width – see here:

    https://docs.generatepress.com/article/content-container/

    This will remove all of the Themes paddings and margins and make every element fill the width of the page.

    You can now add your Slider Block – this will have no gap above it or content padding.
    Below the Slider add a Container Block, within the Container block add your other content.
    Add a new Container Block for each ‘section’ you want to create.

    This method allows you to have Full Width and Contained content.

    No the GenerateBlocks plugin doesn’t have a carousel/slider option at this time.

    #1579158
    Paul

    hello david,

    i will check them carefully and thanks for all helps and your time.

    take care and best regards

    #1579603
    David
    Staff
    Customer Support
Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.