Since we switched to CDN a long time ago and demo import files are not bound to the download file, we regret to inform you that at the moment Bridge users won't be able to do demo import.

This problem is reported and technical service from CDN is working on fixing this issue.

We hope it will be resolved in less then 24hours Thank you for understanding.

Okay
  Public Ticket #1771123
CSS code for product
Closed

Comments

  • iandrlifestyle started the conversation

    Hello,

    I have installed this plugin (see bellow) to be able to not display product images and more but I would like to find the right css code for it (for all single-products images or only some of images if I want to). Please can you help me.

    PLUGIN: WooCommerce Product Details Customiser  (no longer updated since 4 years so I would prefer to find css codes):

    Toggle the display of various components on product details pages.

    Display (OR NOT DISPLAY IF LEFT UNCHECKED):
    Product Images (unchecked)
    Product Tabs
    Upsells
    Related Products

    Could it be something like this?

    .woocommerce .single-product .image { display:none !important; }

    or for one single-product image only:

    .woocommerce .single-product .image-id-8665 {
        display: none!important;
    }

    Thanks

    UPDATE:

    I saw a video that shows how to remove the placeholder, but I was wondering if I want to do this only for one product image, what could it be?

    WooCommerce. How To Remove Products Images Placeholder

    remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 ) ;

    Also, I found this: 
    https://wordpress.org/support/topic/remove-product-image-placeholder/

    But if I want to remove the placeholder only for few products, how will I do that let say for these products without removing the placeholder image for the rest of the products? :

    GREATEST GIFTS 2
    ID: 8665 

    BUDDHA SPIRIT
    ID: 8671

    02. Ask Me Like a Song | UNCONDITIONAL
    ID: 8648 

    08. Être Sans Âge (You Belong) | SPIRITUAL BEINGS ON A HUMAN JOURNEY
    ID: 8644

    Attached files:  printscreens for woocommerce question.pdf

  •  1,610
    Qode replied

    Hello, 

    We are sorry for the delay in responding. 

    The following custom CSS should do the trick if you want to remove images from all products: 

    .woocommerce.single-product .product .images {
        display: none;
    }
    .woocommerce.single-product .product .summary {
        width: 100%;
        float: none;
    }
    

    If you want to remove it from particular product only, you have to include unique product class. It can be found in the source code, when you inspect the product page using some browser inspector ( DevTools in Chrome - F12 -> Elements tab ): 

    https://monosnap.com/file/6dRW6I3GZNwn6WRNbLq79B10NnwZmQ

    ...use the following CSS, just replace product ID: 

    .woocommerce.single-product .product.post-517 .images {
        display: none;
    }
    .woocommerce.single-product .product.post-517 .summary {
        width: 100%;
        float: none;
    }

    Let us know if you need further assistance. 

    Best regards, 

    Qode


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Thank you, it works :)

    Yes, I have something else I need.

    I would like the css code to remove individually if I want for all the products or only one product.

    I mean maybe I will keep the reviews and share button for certain products and not for others or...

    Well, what would be the css code to remove all what you will see in the images in pdf file?

    Here are some css code that I found somewhere but it's not necessarly good for what I want.

    and also, very very important, I would like that it does the same for mobile phone, not just on regular computer. thanks

    .woocommerce .woocommerce_tabs .panel h2, .woocommerce .woocommerce-tabs .panel h2 {display:none !important}

    ul.tabs {display: none;}

    ul.products .count { display:none !important; }

    .woocommerce .product_meta {display: none;}

    p.woocommerce-result-count { display: none; !important; }

    form.woocommerce-ordering { display: none; !important; }

    add_filter('loop_shop_per_page', create_function('$cols', 'return 100;'));

    Thanks

    Attached files:  to remove individually.pdf

  •  1,610
    Qode replied

    Hello, 

    To remove those elements from all single products use the following custom CSS: 

    /* single product remove sku, cat, share, desc, reviews */
    .single-product .summary .product_meta, 
    .single-product .summary .social_share_holder, 
    .single-product .summary .woocommerce-tabs .description_tab, 
    .single-product .summary .woocommerce-tabs .reviews_tab {
        display: none;
    }
    

    If you want to remove them from particular product page, you have to use unique product class and add it to your CSS selector. It can be found in the < body > tag: 

    https://monosnap.com/file/R7oBZ5gq92hlr3HhAk1s0UTLFmAkDC

    For example, to remove them from this product page: 

    https://anael.auctions-encheres.com/product/tones-of-creation-131313/

    ...the CSS should be: 

    /* single product remove sku, cat, share, desc, reviews */
    .single-product.postid-8672 .summary .product_meta, 
    .single-product.postid-8672 .summary .social_share_holder, 
    .single-product.postid-8672 .summary .woocommerce-tabs .description_tab, 
    .single-product.postid-8672 .summary .woocommerce-tabs .reviews_tab {
        display: none;
    }
    

    Hope this helps. 

    Best regards, 

    Qode


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Thank you for your answer.

    But what if I want to keep SKU but remove CAT?

    For now, if I put ........  product meta, the SKU and the CAT are removed, but if I want only CAT to be remove and keep SKU, is there a way ?

    Also, in my previews email, I did ask you how to remove sort by   and also Showing 1–12 of 16 results 

    and, I would like to know how to show the 16 products on one page instead of 12

    https://anael.club/shop/

    Thanks

  •  554
    Qode replied

    Hi,

    Sorry for a late response. We try to login and check a settings for a shop but unfortunately we cant login with old credentials. Please send us a new one and we will take a closer look. Thanks. 

    For a remove a Sort By and Showing label please use a this custom CSS code. 

    .woocommerce .woocommerce-ordering, .woocommerce .woocommerce-result-count{
        display: none!important;
    }

    Let me know if you have any additional questions.

    Best Regards,
    Mike


    \r\n

    Customer Support

    \r\n

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Hello Mike,

    Thanks for that!

    I have transfer the site on anael.net  and it's live now. I will close anael.club soon. It was for building it only.

    I have a couples on things that I remarked still not working properly, or look not nice (for example when I buy a product, it's very strange how it look like afterward.

    I will prepar printscreen and details and submit a ticket here (with new credentials) to get help to fix everything. I'll be back soon. Just need the time to prepar everything at once instead of sending too many emails one after the other. 

    thanks.

  • iandrlifestyle replied

    Hello again Mike,

    but before I prepare all this, I still need to know how I put the 16 products on one page instead of 12 products on 1 page and the last 4 on the second page:

    https://anael.net/shop/

  •  554
    Qode replied

    Hi,

    You are welcome. Please give us a credentials to check a template, because by default unfortunately there is not a chance to change a product number. You can try to use a this 3rd party plugin to fix that:
    https://wordpress.org/plugins/woocommerce-products-per-page/

    We are here if you have any additional questions.

    Best Regards,
    Mike


    \r\n

    Customer Support

    \r\n

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  •   iandrlifestyle replied privately
  •  1,610
    Qode replied

    Hello, 

    We are sorry for the delay in responding. 

    At the moment, all 16 products are shown on your shop page, it appears that you have found a solution in the meantime: 

    https://monosnap.com/file/TZd0lPIRAJ9l2lYZi5RQOAr621YUwu

    On product pages such as this one: 

    https://anael.net/product/greatest-gifts-2/

    ...the list of songs is not part of the theme - it's generated by some third party plugin that we haven't tested with our theme: 

    https://monosnap.com/file/BwC0BiFaNalrC3K7cPLU00jHcV9lGN

    When the 'Buy' icon is clicked, the user is redirected to product page such as this one: 

    https://anael.net/product/04-willows/

    ...where he/she can hit Add to Cart button to add product to basket: 

    https://monosnap.com/file/JGq9ehAphcrQpHdVFx10zXv5hR0ZeS

    The Cart dropdown works well at our end: 

    https://monosnap.com/file/keNOdqAl8idhTaIrj9wugJwWffACEy

    If you find that the problem persists, please describe exact steps to reproduce the problem. 

    2) As for shipping setup, please consult WooCommerce documentation: 

    https://docs.woocommerce.com/document/setting-up-shipping-zones/

    If you have additional questions regarding this you can contact WooCommerce support: 

    https://woocommerce.com/contact-us/

    Best regards, 

    Qode


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Hello,

    Yes, I have no problem about what you showed me. It's not the problems.

    The problems... I found why. I was because of parralax on and the arrow up for mobile device. People told me that the site was going bad/mad. I fixed both things and after that it was ok.

    For the drop down cart, it works, but if you remove the products in the cart, you will see the font colors is dark blue over background dark blue, I want to put it white and I don't know how without affecting all the rest of the site.

    All the rest of the problems like you can find in the pdf files I sent you, are design related problems, otherwise, everything works fine now.

    For the shipping not apprearing, ok, I will read the woocommerce documentation or contact them.

    So, please, look at the pdf files I sent you and see how everything that's left to be fixed can be fixed and tell me :)

    Thanks

  •  1,610
    Qode replied

    Hello, 

    Thank you for your feedback and sorry for a late reply. 

    1) To change the text color in the cart dropdown please add the following CSS into Qode Optinons -> Global Options -> Custom CSS field: 

    .shopping_cart_dropdown ul li {
        color: #fff;
    }
    

    2) As for the height of the title area, please navigate to Qode Options -> Header and Footer -> set Responsive title image option to Yes and check the pages: 

    https://monosnap.com/file/2tFZVnmQAYBihBsfAvDS5yfIaD6Q66

    The same option is available on page level, in the page admin. 

    3) Regarding the styling of the Order received page, we'll have to install additional plugin to get to that page. Please explain the issue related to this page in more detail. Thank you. 

    Best regards, 

    Ian


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Hello Ian,

    1. Thank you for the css code for the cart dropdown.

    2. The Height of Responsive Title Images is a subject that was talked few weeks or month ago. I tried many thing and I prefer to keep NO in the Header/Footer Qode Options.

    3. What plugin are you talking about to style the order receive page?  I sent you pdf files with all the details and the problems it makes, haven't you receive them? If so, all that must be fixed is in there with explanations. 

    Thanks

  •  1,610
    Qode replied

    Hello, 

    2) Since you want to keep the option  Responsive Title Image set to No, the solution is to increase Title height on global level - we have set this option to 370: 

    https://monosnap.com/file/7HQwhR71EhZDJnUnvz2tq7qkTSRc7C

    In the admin of the Cart page, the local Title height setting was 180px: 

    https://monosnap.com/file/GKdMhesxVWUb11B183uW1kdrMkDwwZ

    We have removed this local Title height setting in order global setting ( 370 ) to be applied:

    https://monosnap.com/file/FWFAjhMPyZkTr2dgpPLBXBYYoopif6

    The result: 

    https://monosnap.com/file/FKS15n9dnjnMdETWs3tcDtqbPSOfgY

    You have to do the same for other pages ( Checkout, Shop..) just navigate to the page admin and set the local Title Height option to default (empty field) in order global Title height setting ( 370 ) to be applied.

    3) Please note that we receive a lot of tickets each day and it is not possible to go through PDFs, we simply do not have enough time. Besides, we can answer up to 3 questions posted in a single comment - for additional questions you can always submit new tickets. We'll still try to help you with some of the issues here. 

    3 - 1) Regarding this: 

    https://monosnap.com/file/wpZOwEE79yl5v7PpFGgYK04z60dOEM

    ...if you are referring to title area height, you just have to set the local Title Height option ( in the admin of the Checkout page ) to default - empty field as we explained above. 

    3 - 2 ) To left-align product column on the checkout page: 

    https://monosnap.com/file/WJ4rRgvsGGKMYcmNWVwPoG9vG4RXoL

    ...add the following CSS into Appearance -> Customize -> Additional CSS field:

    .woocommerce form.checkout table.shop_table td:first-child, 
    .woocommerce form.checkout table.shop_table th:first-child {
        text-align: left;
    }
    

    The result should be: 

    https://monosnap.com/file/iUEDgdhMYHbDTAWbNxt5r5Rna43jaD

    3 - 3 ) Regarding the missing shipping address on the Checkout page, you have to add shipping methods for each zone as explained here: 

    https://devanswers.co/shipping-address-missing-woocommerce-checkout-enable/

    https://stackoverflow.com/questions/40243862/woocommerce-how-to-show-shipping-fields

    You can also consult WooCommerce documentation or contact their support. 

    As for other issues, please submit separate tickets with up to 3 questions, we cannot handle all in a single ticket. Thank you for your understanding. 

    Best regards, 

    Ian


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Ok, now I understand why we seem to not understand each other...

    I started to create pdf files because you were not receiving my images (printscreen) for a reason you didn't know.

    Ok, noted, I will separate all what's left to fix. thanks

    P.S.: I will not create any more pdf files for my printscreens, so I hope you will be able to see my images. We'll see...


    >>>3) Please note that we receive a lot of tickets each day and it is not possible to go through PDFs, we simply do not have enough time. Besides, we can answer up to 3 questions posted in a single comment - for additional questions you can always submit new tickets. We'll still try to help you with some of the issues here. 

  •  554
    Qode replied

    Hi,

    We waiting for a your reply to see does we will see a images and to resolve your issues. Thanks for understanding. We are here if you have any additional questions.

    Have a nice day! 

    Best Regards,Mike


    \r\n

    Customer Support

    \r\n

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  •   iandrlifestyle replied privately
  •  1,030
    Qode replied

    Hello,

    Bridge theme is most selling theme on Themeforest, and have a lot of advanced features. So it's better then other themes because of that. And updates for Bridge theme are more often. 

    So with this facts we think you should have taken Bridge theme instead. 

    Let us know if there is anything else.

    Best Regards,

    Nicolas


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!

  • iandrlifestyle replied

    Ok Nicolas, I take note. Since I have paid already for Elision the full amount 59 usd  (which mean nearly 90  $ for Canadiens),  and now,  I truly realized that it was a mistake for me to take Elision instead of Bridge, I hope that I could find a coupon on the internet to get Bridge at a better price for me. So,  I'll check around. Thanks.

  •  1,030
    Qode replied

    Hi,

    We are here for you if you need any help.

    Best Regards, 

    Nicolas


    Customer Support

    Stay up-to-date with the latest Bridge updates and our new themes. Get the news delivered to your inbox!