Skip to main content

Pages & Locations

OneTap Login can display the sign-in button and One Tap popup on various pages. This guide explains all available locations and how to configure them.

Default Locations​

With WooCommerce​

When WooCommerce is active, the plugin targets these pages by default:

PageOne TapButtonDefault
My AccountYesYesEnabled
CheckoutYesYesDisabled
CartYesYesDisabled
wp-login.phpYesYesDisabled

Without WooCommerce​

When WooCommerce is not installed:

PageOne TapButtonDefault
wp-login.phpYesYesEnabled
Custom login pagesVia shortcodeVia shortcode-

WooCommerce My Account Page​

URL: https://yoursite.com/my-account/

The My Account page is the primary location for Google sign-in.

What Appears​

  1. One Tap popup: In the corner (if user has Google session)
  2. Sign-In Button: Below or above the login form

One Tap Popup My Account

Configuration​

Settings > OneTap Login > General > Button Configuration
☑ Enable on My Account page

Button Placement​

The button appears based on your theme:

ThemeButton Location
StorefrontBelow login form
AstraAbove login form
FlatsomeIntegrated in form
DefaultBelow login form

WooCommerce Checkout Page​

URL: https://yoursite.com/checkout/

Enable Google sign-in on checkout for guest customers.

PRO Feature

Checkout page integration requires OneTap Login PRO.

What Appears​

  1. One Tap popup: Corner popup for quick login
  2. Sign-In Button: In the billing section or sidebar

One Tap Popup Checkout

Configuration​

Settings > OneTap Login > General > Button Configuration
☑ Enable on Checkout page (PRO)

WooCommerce Blocks Checkout​

For the new block-based checkout:

WooCommerce Checkout Block

  • Fully compatible with WooCommerce Blocks
  • Button appears in the customer information section
  • One Tap popup works as expected

Classic Checkout​

For the traditional shortcode-based checkout:

WooCommerce Classic Checkout

  • Button appears in billing details section
  • Positioned before or after email field
  • One Tap available for logged-out users

Checkout Behavior​

When a user signs in during checkout:

  1. Login completes without page redirect
  2. Billing fields auto-populate (name, email)
  3. User can complete checkout immediately
  4. Order associated with their account

WooCommerce Cart Page​

URL: https://yoursite.com/cart/

Enable sign-in prompts on the cart page.

PRO Feature

Cart page integration requires OneTap Login PRO.

What Appears​

  1. One Tap popup: Encourages account creation
  2. Sign-In Button: Near proceed to checkout

One Tap Popup Cart

Configuration​

Settings > OneTap Login > General > Button Configuration
☑ Enable on Cart page (PRO)

Use Cases​

  • Prompt users to sign in before checkout
  • Capture accounts earlier in the funnel
  • Enable cart persistence across devices

WordPress Login Page​

URL: https://yoursite.com/wp-login.php

The standard WordPress login page.

What Appears​

  1. One Tap popup: Top corner
  2. Sign-In Button: Below the login form

One Tap Popup wp-login.php

Configuration​

Settings > OneTap Login > General > Button Configuration
☑ Enable on wp-login.php

When to Enable​

  • Sites without WooCommerce
  • Admin/editor login convenience
  • Membership sites using WordPress login
Security Note

Users with Administrator, Editor, or Shop Manager roles will be redirected to standard login even if Google button is shown. This is a security feature.

Custom Locations (PRO)​

Shortcode​

Place the button anywhere using the shortcode:

[onetap_button]

With parameters:

[onetap_button theme="outline" text="signin_with" size="medium"]

See Shortcode Documentation for all parameters.

Page Builders​

Elementor​

  1. Add a "Shortcode" widget
  2. Enter [onetap_button]
  3. Adjust positioning in Elementor

Divi​

  1. Add a "Code" module
  2. Enter the shortcode
  3. Style the container as needed

Gutenberg​

  1. Add a "Shortcode" block
  2. Enter [onetap_button]
  3. Use block controls for alignment

PHP Function​

For theme developers:

<?php
if (function_exists('onetap_render_button')) {
onetap_render_button([
'theme' => 'filled_blue',
'text' => 'continue_with',
'shape' => 'pill'
]);
}
?>

One Tap Popup Behavior​

The One Tap popup appears based on these conditions:

Conditions to Show​

ConditionRequired
One Tap enabled in settingsYes
User has Google sessionYes
User not logged into WordPressYes
On enabled pageYes
Cookie consent given (if required)Yes
Not in cooldown periodYes

Cooldown Period​

Google implements a cooldown after users dismiss the popup:

DismissalsCooldown
1 dismiss2 hours
2 dismisses1 day
3+ dismisses2 weeks
Testing

Use incognito windows to bypass the cooldown during testing.

The popup appears in a fixed corner position:

PositionLocation
DefaultTop-right
RTL sitesTop-left
MobileTop-center

Button Placement Within Pages​

Login Form Integration​

The button integrates with login forms:

WooCommerce My Account:

<form class="woocommerce-form-login">
<!-- Username/password fields -->
<div class="onetap-button-wrapper">
<!-- Google button here -->
</div>
<!-- Submit button -->
</form>

WordPress Login:

<form id="loginform">
<!-- Username/password fields -->
<div class="onetap-button-wrapper">
<!-- Google button here -->
</div>
<!-- Submit button -->
</form>

Separator​

The plugin adds a visual separator:

──────── or ────────
[Sign in with Google]

This indicates Google sign-in as an alternative to username/password.

Mobile Considerations​

Responsive Button​

The button adapts to mobile screens:

Screen SizeButton Behavior
Desktop (>768px)Normal size
Tablet (481-768px)Slightly smaller
Mobile (<480px)Full width

Mobile One Tap​

On mobile devices:

  • Popup appears at top-center
  • Larger touch targets
  • Swipe-to-dismiss supported

Configuration Summary​

LocationSettingDefaultVersion
My AccountEnable on My AccountOnFREE
CheckoutEnable on CheckoutOffPRO
CartEnable on CartOffPRO
wp-login.phpEnable on wp-login.phpOffFREE
CustomShortcode-PRO

Best Practices​

E-commerce Sites​

  1. Enable on My Account (essential)
  2. Enable on Checkout (PRO) for conversion
  3. Consider Cart page for early capture

Membership Sites​

  1. Enable on wp-login.php
  2. Use shortcode on custom login pages
  3. Enable on relevant member pages

Blogs​

  1. Enable on wp-login.php
  2. Add shortcode to comment forms (if using login)
  3. Keep minimal for reader experience

Next Steps​