Clef & Woocommerce

Hello,

Yes, the Clef for WP plugin works with the WooCommerce plugin including Woo’s custom roles.

If by “standard login form” you mean WP’s default form at wp-login.php, then turn OFF the “Show Clef wave as primary login option” to display the Clef login button below the password form.

If by “standard login form” you mean the WooCommerce /my-account/ page, then two things:
(1) the “register with your phone” button works by simply turning on the register with Clef option (see how to turn this one here.)

(2) you can add “login with your phone” button either by editing the “my account” page template to include the Clef shortcode or by adding the following snippet to /templates/myaccount/form-login.php at line 44:

do_action( 'login_form' );

Ok thanks
What i want is to integrate Clef on custom front end page, where users can link their phone with their account after they login with password.

Let’s they are is a custom front end page “Link with Clef” and when they enter the page(they have to be already logged in) they are able to link their account to their phone so that next time they can login with Clef..
Is this possible to achieve?

This would be awesome because it really sucks for common users to see the back end of the WordPress :/

Anything is possible with the Clef API :-). But if you are asking whether this feature is available on the current wpclef plugin, no, unfortunately not.

Oh i don’t know how to code..If your programers would tell how to do this it would be great..

I think that it would make most of the users switch to passwords if the plugin has an option to add front end linking with Clef for wordpress websites.. ??
I want my users to use Clef badly but the problem is back end linking with Clef..
Please consider adding this to issue to road map or something ??

Cheers

Hi there,

(2) you can add “login with your phone” button either by editing the “my account” page template to include the Clef shortcode or by adding the following snippet to /templates/myaccount/form-login.php at line 44:
do_action( ‘login_form’ )

works like a charme! Thanks LO for the hint! I implemented Clef today in my Webshop and thanks to Clef, I can offer my customers an easy and convenient way to Login. (and myself to the Backend, wuuhuuu :D)

Maybe got a clue how to put the Register with phone / Login with phone in the center of the whole Login / Register Frame? ‘Cause now they’re left orientated ?? it’s cosmetics, I know… If there is a simple Solution and I just don’t get it? See it here on the Login(Woocommerce “MyAccount” Page) https://physiomaterial.ch

Thanks for the help and sunny greetings from Switzerland.

@blackfundi

For center aligning the button manually (unfortunately, it is not customizable in the Clef for WP plugin itself), you can try something like this:

1. Assuming you are using the Jetpack custom CSS module (or something similar) or don’t mind directly editing your theme’s stylesheet

2. Add this selector to the custom CSS:

div.clef-button-container {
	margin-left: 25px;
}

Change the 25px to whatever amount is appropriate for achieving centering on your page.

@blackfundi
How exactly did you make the login page of your site?

@lo
I would like to integrate Clef perfectly into WooCommerce. The first step to doing that involves showing register with clef on the checkout page instead of the default WooCommerce registration with username and password. Any idea how to do this?

@niket

Step one: enable register with Clef button.

Step two: the Woo login page currently uses a non-standard hook. So you have to follow the workaround in this reply (above) to get the Clef “login with your phone” button to appear. We (Clef) are working with Woo to see if they can add the standard hook so that this workaround is not required.

Regarding step 1:
Yes, I am aware of this. It enables WordPress user registration using Clef which happens through wp-login.php. But it doesn’t apply to the online shopping use case since a normal shopper on a standard WooCommerce site won’t even be visiting that page as it’s not a part of the checkout flow.

Regarding step 2:
It introduces a “login with your phone” on the /my-account page. Does that button also do registration?
Even if it does, it still suffers from the same limitation as I previously pointed out – the first time user won’t see it during checkout.

@niket Currently, the closest thing to “perfect integration” between Woo and Clef is enabling login and registration on the Woo my-account page. Additionally, you can use this redirect plugin to send Woo users to their my-account page upon login. Further integration will require some coding on the Woo side of things, perhaps even a Clef plugin for WooCommerce. We’d love to do such a project, but we’ll have to wait until we have the engineering resources to devote to it.

On that my-account page, no, the login button does not do registration too. There is a separate button and a separate form for registration.

I can’t see a form-login.php in Plugins->Editor->WooCommerce in my backend. Can you confirm?

P.S. A one-page checkout system (WC already has a paid extension for this) with Clef integration would do wonders.

@niket the path to the file within the Woo plugin directory is /templates/myaccount/form-login.php. You might have to get at it via FTP rather than the online editor.