WooCommerce: Simplify/Clear the checkout page - woocommerce

According to the attached screenshot:
How can I remove the yellow marked content from the checkout page?
How can I change the text and remove/change the link for the text marked with a green arrow?
I point out the green box [Voucher 4889 has been added to your cart] - how can I remove the link right to the text [also marked with a yellow box]?
This should result in a very clear and simplified checkout form.
Update: Any CSS and template modification are not an option as the checkout has to be simplified in a plugin which will be installed and there is no way to force the webmaster to apply the modifications. The plugin should modify the checkout page on the fly for certain products.

Related

Cannot change button text

The site is build with wordpress and using the favetheme,houzes theme for real estate theme site, and what seems to be the problem here i cannot change this button text [Load more] so what i need is to know where can i edit the button text.
Thank you
i've tried elementor but its not showing the button i think its attached to the section which is for showing featured properites, i tried with edit page and the customize but i still couldn't change the text or the button it's self.
I changed it on back-end accessing cpanel, it was at shortcodes of houzes theme you can find, at property-cards-v5.php (you can check its name in elementor by trying to edit it) changed its content of Load More, it was attached to the section it was part of the slide show

Remove text on WooCommerce Shop Page for Product

I'm working on a woocommerce storefront for a client that has a custom-built theme (by someone else) and for the life of me cannot find where I need to go to remove the subtext over the product preview on the main Shop page (the "at vero...")
See below:
Inspect element shows:
When I went into the wc-template-functions.php file I found the product_loop but there is nothing in here that I see generating the paragraph below the product title. Before I write some css to locate the <p> child element under parent woocommerce-LoopProduct-link woocommerce-loop-product__link - is there someone within WC functions I can locate this? The product has no categories or tags as I thought this could be where it was coming from. My Google searches have resulted in nothing specific to what I'm looking to change on the shop page, just changes to the product page which I do not need.
you can simply hide using CSS instead of change in core files

Wordpress Woocommerce texts too close to each other

I have built my online shop in Wordpress, theme Ellie, and using Woocommerce plugin.
Issue is that the texts "View Cart" and "Checkout" are too close to each other in 2 different places: Footer and Cart widget on Shop page. Something wrong there.
Shop page
Footer
https://senjacosmetics.com/shop/
Really happy if you can help! I tried to research this but didn't find anything. I'm not a developer so cannot proceed on my own.
This is just small css issue. You can easily solve it by adding some css rule.
You can add following css rule in your theme's style sheet or if your theme supports custom css, then via that feature.
.woocommerce-mini-cart__buttons a.checkout{margin-left:15px;}
"woocommerce-mini-cart__buttons" is the class assigned to 'p' tag which contains both the links. "checkout" is one of the class assigned to the 'Checkout' link.
You can change the value of '15px' to anything you want depending on how much space you want between the two links.
Following is screenshot for your reference. I added the css rule to checkout link in developer console.
Hope this helps.

Removing the default link from image Wordpress

I am building a website in WordPress and I am facing an issue with gallery images. I used the plugin FooGallery to show the Grid Images and I also added the onclick to the FooBox to show the larger image.
But the problem is when I click on the image it is showing in two image box. first one is maybe WordPress default and second is the FooBox.
Link for the gallery: http://www.3rdeyeholographic.com/void/
Open this link and click on any one image and see what happen. It will show two image box but I want only one which is good in UI.
Try removing trx addons plugin to remove one of the popup.

Issue with WooCommerce Cart & Checkout Layout

Wordpress Version: 4.9.7
WooCommerce Version: 3.4.3
WooCommerce has caused layout issues with the Cart & Checkout page. It's any WooCommerce page with a table.
The table with classes of:
shop_table shop_table_responsive cart woocommerce-cart-form__contents
is causing issues. The WooCommerce CSS for the table sets a width of 100%, however the actual width shows as 4870px. The theme's parent element width is set as 1100px.
Why is the table's width much larger than that set by the theme?
There are no CSS declarations after that overwrites.
There are no issues with the products page or product page.
You can always remove default WooCommerce styles, the risk is that you may use some. Anyway it worth the check:
add_filter( 'woocommerce_enqueue_styles', '__return_empty_array' );
If this doesn't help, maybe post a link to the page so we can inspect the layout and CSS?
You might have unnecessary pre tag as a wrapper, causing the table to stretch:
<pre>[woocommerce_cart]</pre>
In order to remove it, you may install "Disable Gutenberg" plugin, then edit the Cart Page in Text tab, leaving only:
[woocommerce_cart]
I had the same issue. The root cause I found was caused by copy/pasting the short code from the woocomerce website directly into a visual editor (WPBakery Page Builder in my case).
The copy picked up the <pre> tag from the source and applied it when pasting, triggering a change of the style to preformatted without me noticing.
Two solutions to fix - depending on your Visual Editor and preference.
Simply changing back to the default Paragraph setting,
Highlight [woocomerce_cart]
Select Paragraph from the drop-down styles list
Update/Publish!
OR, Remove the <pre> tags manually
Change to a 'text' only view of the page code
Remove surrounding <pre> tags leaving [woocomerce_cart]
Update/Publish!
Sorry, can't embed images yet...
Image showing issue:
Image showing manual solution:
This should work for any other short codes pasted in as well, including [woocomerce_checkout] as mentioned in OP.

Resources