Tagged: 

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1065207

    Hi,

    I’m testing out Woocommerce with my website and theirs a couple of things that I hope you can help me with:

    Shop Page:
    1. Make the shop page titles above the images them, adjust the size of text and aligning text center?

    2. Make the “Check Me Out” text bigger on the shop page and remove the cart image or change it?

    3. Make the gaps between the images bigger and bring the images slightly in more leaving more space on the side of the images? .(I wish the shop layout to be similar to this). This would mean the images will need to be slightly smaller right?

    Single shop pages
    1. Make the image bigger, hence moving the information more towards the right?

    2. Moving the button (“Check Me Out”) underneath the description?

    3. Removing extra text such as “Category…” and the little text where it says “Description” above the the big “Description” title

    I understand some of these things are really small changes so can you also tell me the name of files to change some things myself please?

    All help is appreciated.
    Thank you.

    Zak

    #1065703

    Hey ZakMun,

    Unfortunately, it would require quite some time and customization of the theme to achieve this, so I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

    Best regards,
    Basilis

    #1065710

    Hi,

    That’s fine. Could you at least tell me the names of the files that I should look at in order to edit the styles of the pages?

    Zak

    • This reply was modified 5 years, 2 months ago by Zak.
    #1066140

    Hi,

    Those are inside the /woocommerce/ template filder.

    Best regards,
    Basilis

    #1067725

    Hi,

    I’ve been able to make most of the changes, however there’s 2 things which I can’t seem to do

    1. I’m trying to add padding between the images and on the left and right hand side of the screen
    2. Making the size of the product boxes smaller.

    This website is the best example I can give to show you what I’m trying to say.

    Are you able to help me with that?

    Thanks
    Zak

    #1069650

    Hi,

    What is your web site URL?

    Best regards,
    Basilis

    #1069728

    Hi Basilis,

    So this is my website.

    Thanks
    Zak

    #1071363

    Hi Zak,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (min-width:768px){
        .products.columns-3 {
            width: 80%;
            margin: 0 auto;
        }
        .shop_columns_3 .products .product {
            margin: 0 4% 1% 0;
            width: 30.6%;
        }
    } 
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1071511

    Hi Victoria,

    Thank you for the code but unfortunately I used the code in the quick CSS and in the editor CSS and neither of them worked.

    Is their anything else?
    I’ve changed the menus now. I’m now using the product grid on my pages.

    Thanks
    Zak

    #1073066

    Hi Zak,

    https://cl.ly/3ef0a44d157a The code works even in the setup you have now. If it does not apply on your end. there can be an error in the css before it. Please validate all the code you have in your Quick css or add the code I gave you on top in your Quick css.

    Best regards,
    Victoria

    #1073083

    Hi Victoria,

    Yes, it does work. The problem was that Chrome wasn’t updating the changes. I checked it in Microsoft Edge and it looks good.
    Thank you

    I have one final request if possible.
    Are you able to make the product section box (from the title of the product to the “Check Me Out” button) in the shop page slightly smaller? Like the height of it so the shop page looks smaller.
    I hope that make sense

    After that this thread can be closed

    Kind Regards
    Zak

    #1073745

    Hi Zak,

    Yes, it can be the browser cache.

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    .woocommerce-product-details__short-description p {
        margin: 0;
    }
    #top .inner_product_header {
        padding: 5px 10px;
        min-height: 60px;
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1073954

    Hi Victoria,

    Thank you for all your help!

    Thread can be closed.

    Best Regards
    Zak

    #1074211

    Hi Zak,

    Great, I’m glad Victoria could help you out. I’ll close this thread for now then, please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Woocommerce Shop page and single page layouts’ is closed to new replies.