I am having trouble overriding the default styling that comes with WooCommerce. Specifically, I am trying to hide certain fields that display on my checkout page (see screenshot of the code). I mocked up my page on Code Pen and my css is working fine, so I am not sure why it doesn't work on my styles.css of my child theme. Any help is appreciated!
.variation li div:first-child {
display: none; }
https://codepen.io/jagorski/pen/oZBYrd
Clear the browser cache & try this:
.variation-JobListing:first-child {
display: none !important;
}
Related
I was given the task of customizing a specific section of a website. This section is primarily made by an Event Manager Plugin on WordPress. This plugin allows users to create their own events that will be published in a calendar page. The thing is, I need to get rid of the page header only on the pages created by this plugin, that will have an URL similar to this: http://mypage.com/eventos/user-event-name
So, I only need to apply the code .site-header { display: none; } ONLY to the pages that have this /eventos/something URL. Can this be done?
When I put the above code on the Custom CSS of my theme it gets rid of the header across the whole website, and I don't want that.
I have absolutely no background in CSS so I most definitely am using the wrong definitions here. Thanks in advance, hope someone can help me!
You can check if there is evestos in URL and add a class to body
like this
add_filter( 'body_class','my_body_classes' );
function my_body_classes( $classes ) {
$url = strpos($_SERVER['REQUEST_URI'];
if($url, "/eventos/")) {
$classes[] = 'eventos-page';
return $classes;
}
}
After that you can add css to that class like for example
.eventos-page .site-header {
display: none;
}
I've been trying to remove the "Return to Shop" button from the WooCommerce 'empty cart' page, but without much luck. Closest I've found is the snippet below from 2015, which did work for someone back in the day, but doesn't work for me now. Does anyone know why, or have a better way?
.empty-cart-block .button.active {
display:none !important;
}
To remove the Return to shop button in WooCommerce shop page, copy the template file located in /wp-content/plugins/woocommerce/templates/cart to your child-theme like /wp-content/themes/childtheme/woocommerce and simply delete the button.
Just use this simple line of CSS code:
.woocommerce-cart .return-to-shop { display: none !important; };
Code goes in styles.css file of your active child theme (or active theme). Tested and works.
It will hide, not remove:
a.button.wc-backward {
display: none;
}
I’m trying to remove WooCommerce product image in my WP page (I'm using eStore template). I don’t need the product image to be shown, but when I remove the product image using the following PHP snippet, I get a blank space where the image is supposed to be, and it looks terrible:
remove_action( ‘woocommerce_product_thumbnails’, ‘woocommerce_show_product_thumbnails’, 20 );
I've tried to remove the image placeholder by inserting the following CSS snippet, but nothing happens:
.single-product .product .summary {
width: 100% !important;
float: none !important;
}
Could you please give me some guidance on this?
Note - this code come from: Remove WooCommerce image
Just make the image gallery area display as nothing and 100% should fill the area. I tried the following with your CSS on the default template and it worked for me:
.single-product .product .images { display:none; }
And here is an example page for those wondering:
https://demo.themegrill.com/estore/product/shoe-for-men/
Koda
the image variable/object is being shown on this template you are using. if you cannot figure that out, just do a super hacky:
divName img {
display:none;
}
and move on to learning how to manipulate the templates inside WooCommerce for better flexibility. You could even write a function to hide this image...
With WooCommerce, I would like to hide or remove FEATURED checkbox from product pages settings in the Backend (Admin), see the screenshot below.
I have tried with CSS display:none but it does't work.
Any help will be appreciated
Thanks
(source: imgh.us)
Yes it's possible with a custom function hooked in admin_head wordpress hook, that will inject in the admin head some CSS rules. Here we target the product post types pages.
Here is that code:
add_action('admin_head', 'hiding_and_set_product_settings');
function hiding_and_set_product_settings(){
echo '<style>
.post-type-product #catalog-visibility-select p:nth-of-type(2),
.post-type-product #catalog-visibility-select label[for=_featured],
.post-type-product #catalog-visibility-select input[type=checkbox] { visibility: hidden !important; display none !important;}
</style>';
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
This code is tested and works.
See this screenshot of my test raw server:
Currently putting together a webcomic website. I have no need for post content / comments. Just looking to post a daily/weekly comic and leave it at that.
Current Site: http://anarchyplants.com
I've tried to disable the post edit box on the admin end as well as searched high and low on removing that "Comments(0)" on the mini nav bar.
Currently using Wordpress and ComicPress theme.
(http://comicpress.org/) w/ Comic Easel Plugin (it's required)
If someone more Wordpress versed that I can shed some light and teach me how to achieve this, I'd be more than grateful.
You could disable this from your css. Just place it in your child themes style.css file. It's not recommended that you remove the post edit box... How else would you publish your content?
/* Will hide the comments on the "mini navbar" */
#comic-nav-wrapper > tbody > tr > td:nth-child(3){
display: none;
padding: 0;
}
To remove the content from the post, you could simply:
/* Remove the post content */
.post-content{
display: none;
}