Fixing CSS for Radio Button - WooCommerce - wordpress

The problem: Radio Button for shipping options successfully goes to selected state which clicked, but does not show a black dot in the selected item to show to the user that it's been selected.
This is on this WooCommerce checkout page of my site. Sorry, the only way to go there is to first select an item on the store, then proceed to checkout: https://dayhikesneardenver.com/shop/
I've inspected the using google chrome inspect page and cannot for the life of me figure out if this is an issue with: 1) My Uncode theme styles, 2) WooCommerce styles, or 3) something else.
Thanks for any insight on this.

When removing the "webkit-appearance: none" property on the radio button form or changing it (webkit-appearance: checkbox) the button appears checked.
The properties
I think something else is overwritting the original style of the button.
Before
After

Related

Buddypress members widget tab switching issue

When I click on the buttons shown by the arrows in the picture in the Buddypress member widget, it sends them to the /members/ page.
https://prnt.sc/wle-fYU8by2S
Normally, when the buttons on that page are clicked, the buttons need to change, not the page.
Please help with this.
for example: it should show the people who are the newest when you click on the newest button, when you click on the active button, it should show the ones that are active.

Woocommerce change variation image on click

I changed the dropdown box on my product page to radio buttons using javascript, which works fine.
The problem is that now, the image does not change anymore when changing the product variation.
On the default dropdown box that woocommerce gives for variations, there was some sort of function happening, which changes the current-image attribute inside the product form element. I am trying to replicate this on my radio buttons.
My radio buttons look something like this:
<label for="green">green</label>
<input class="attached enabled" type="radio" name="colors" id="green" value="green">
I have tried to find the code where woocommerce does this inside the template folder, but I think this is happening in one of the woocommerce hooks, or in the woocommerce javascript file.

How can I hide or show some text fields on checkbox click in Woocommerce

I have some text field i.e in custom size(length,with) of product.
I want include a check box , when i click on check box , custom size fields will show/hide on checkbox click.please help me how i can perform this without any code customization.
I had tried some plugins but they add text fields but not show/hide them on checkbox click
First of all you need to add some scripts to make the code work. That is, you need to capture the checkbox click and analysing checked is true or false, you have to write code to show or hide the fields. A simple jQuery function is sufficient.
Or you can use product option plugins to make it work. I don't know which plugin you have used. I have used this one for my client. Try this if you need a plugin.

How to disable Wordpress top menu link?

How to disable top menu link in Wordpress to avoid redirect to another page on click. I only need to show submenus.
Give the menu item link a the value #.
Then you'll need some Javascript to prevent default link clicking action.
E.g. with jQuery:
$('.class').click(function(e){
e.preventDefault();
});
// replace class with whatever the selector of the link is. To cover ALL menu items that have sub menus (and have the WP classes), you can use '.menu-item-has-children a'
Add custom link to menu item (Put # value on link)
Log into your WordPress administration panel. Navigate to Appearance, and select Menus:
Navigate to Links on the left and type in the URL you want to have for this menu button, add Link Text to specify what the tab will say, and then click Add to Menu:
Optionally, if you would like to control whether your menu link opens in a new tab when clicked, check the “Link Target” advanced property from within Screen Options to reveal this setting on individual menu items:
Refresh the site and you will see your new custom page and link in the navigation menu.

Missing Woocommerce add to cart button

please help my add to cart button is missing
Site:http://emceecouture.com/shop/mc728/#.Uwx05fSSz1g
I really have no idea where to retrieve it back
simplest workaround is to change class of div containing product quantity and add to cart button (/woocommerce/single-product/add-to-cart/variable.php).
i.e. from
<div class="single_variation_wrap">
to
<div class="single_variation_wrap_mod">
to fool js which is adding style="display:none" even when you remove it from html code.
I can't understand why woocommerce developers decided to hide this button and add js to show it after someone selects variation, rather than (as every other ecommerce on the planet) show add to cart button, and focus on the attributes if someone haven't selected one.
IMHO this is an UX fail.

Resources