I have a problem that i try to change somthing in my site and no matter whhat i try its still there
Rule :
.woocommerce form .form-row-wide, .woocommerce-page form .form-row-wide { clear: both; }
Change:
.woocommerce form .form-row-wide, .woocommerce-page form .form-row-wide { clear: inherit!important; }
Don't work :
i tried from the customize
through the the actual path of the css
try to delete the all section
tried in min.css and regular.css
Path:
https://obeyyourbody.com/wp-content/themes/astra/assets/css/minified/compatibility/woocommerce/woocommerce-grid.min.css?ver=3.9.2
Checkout Page for the issue:
https://obeyyourbody.com/checkout/
Related
i have one little but very weird CSS issue with my personal site. I found one CSS glitch on one button into my account page from Woocommerce.
when check CSS for that button, i found this class that use that settings:
.woocommerce a.button, .woocommerce-page a.button, .woocommerce button.button, .woocommerce-page button.button, .woocommerce input.button, .woocommerce-page input.button, .woocommerce #respond input#submit, .woocommerce-page #respond input#submit, .woocommerce #content input.button, .woocommerce-page #content input.button {
border: 1px solid #ddd;
background: #fff !important;
box-shadow: none;
}
if i untick background: #fff !important; then button is back to normal look. I searched everywhere to find that CSS class, but looks like that class dont exist.. How to find where is posted that CSS and modify the class. This is test logins if someone want to check , because issue is not visible without login.
User = test
Pass = test5
URL
Any help?
The style that you have identified is the one that causes the trouble. It is not present in an external stylesheet. Instead, it has been added inline. You may view it by Right click -> View Source.
To modify the style, either look in the custom styles added from the Appearance > Customize > Additional Styles or in the theme's header.php file and make the necessary changes.
Hi everyone,
Is there anyways to put product without using product name? My products don't have name. Anyone who can help please respond.
Thanks,
Best Regards.
You can use a CSS to do so.In listing page you can use following CSS :
ul.products h2.woocommerce-loop-product__title {
display: none;
}
It might be differ base on version.
For compatibility with future updates of your theme and plugins, I've found a better way to do this is through WooCommerce hooks. To remove the title from your Single Product Page, you should put the following two lines in your theme's main functions.php.
in this titla field is not coming on product insert.
remove_action('woocommerce_single_product_summary','woocommerce_template_single_title', 5 );
Other way is but in this your title is coming but you hide that because of you don't want to see that.
.woocommerce li.product .entry-header h3 a, .woocommerce-page li.product .entry-header h3 a {
display: none;
}
.woocommerce .price, .woocommerce-page .price {
display: none;
}
I hope this worth to you
I'm working on a WordPress site (using a child theme of Divi) & having an issue with the WooCommerce Shop. The individual Product pages are not displaying the Add to Cart button or the price. Those elements are there (I can highlight over them on the page & click the area where the button should display) but they're hidden for some reason. Anyone know how to make them display?
Here is an example page. Thanks!
I saw your product page, It just a CSS issue, put the following css snippet on your theme's style.css
.woocommerce button.button.alt {
background-color: #a46497 !important;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price {
color: #77a464 !important;
}
I have a product page here: http://www.noliftpalletmover.com/order/
I would like to always show Add to Cart rather than having it appear on hover. I have tried some CSS fixes but to no avail. Any suggestions?
In your stylesheet http://www.noliftpalletmover.com/wp-content/themes/konstruct/assets/css/style.css?ver=1.1.1 at line number 6421, position of add to cart button (class name .woocommerce .products li .add_to_cart_button, .woocommerce-page .products li .add_to_cart_button) is set to "absolute". Remove "position", "left", "right" and "z-index" from that class declaration. And comment out class declaration at line number 6165 which as transform: translateY. That should do the trick for you.
Hope this helps.
You can use a plugin like Simple Custom CSS to add the following CSS to your site:
.woocommerce .products li .add_to_cart_button, .woocommerce-page .products li .add_to_cart_button {
position: inherit !important;
bottom: 0 !important;
margin-top: 15px !important;
}
If this answers your question please mark it as the answer :)
I am using Woocommerce plugin for my shopping cart and I have trouble with links and it is only for Woocommerce pages. When I click on a.button div it moves for 4px to the top. I cant find source of this issue. Try to click on thumb or on black button down there.
http://valeka.net/higher/?post_type=product
Can you help me to see what am I missing?
It's likely a border-top: 4px in normal state vs a border-top: 0px when :active possibly from an inherited reset style sheet for the :active state.
For example when disabling the following:
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
...
{
// margin: 0px;
The movement seems to not affect the add-to-cart button anymore (but it still affects the product image).
For button.button you have:
.woocommerce a.button:active,
.woocommerce button.button:active,
.woocommerce input.button:active,
.woocommerce #respond input#submit:active,
.woocommerce #content input.button:active,
.woocommerce-page a.button:active,
.woocommerce-page button.button:active,
.woocommerce-page input.button:active,
.woocommerce-page #respond input#submit:active,
.woocommerce-page #content input.button:active
{
top: 1px;
}
Once removed this will stop the filter button from moving 1px when active.
Found it:
this here is causing the image & button to go up:
.woocommerce ul.products li.product:active,
.woocommerce-page ul.products li.product:active {
margin-top: -1px !important;
}
layout-1200.css => line° 2992, disable it, or remove it.
When seeing the name off the CSS file, i guess, you have to do it in an override, or in all CSS (i think there will be mobile CSS's to)