Did you build your store with another tool? Offering Facebook as a provider ID option for Customer Registration isn't currently supported for stores built using Web Hosting tools.
Important: Customer Registration is not supported in Microsoft-based browsers (such as Edge) released before April, 2019. It is also not currently supported on mobile devices.
If you want to offer this option, you'll need to create and provide a valid Facebook Application ID and Application Secret when enabling the Allow Facebook ID option in Checkout & Registration Manager. Both the Facebook Application ID and Application Secret are required by Facebook for authentication purposes.
If your store uses custom checkout CSS: See our important notes for stores using custom checkout CSS. You'll need to edit your custom checkout CSS file to enable this feature, or to modify your checkout CSS settings to use either default styles or configurable styles.
Important: Due to recent Facebook updates, there are some additional steps you will need to complete if you have previously created your Facebook Application ID and enabled Facebook registration. First, you will need to make sure that your storefront is secure via Security Manager. Next, follow these updated steps on the How do I get a Facebook Application ID? Help Page:
After you've created a Facebook application ID, you'll need to enable this feature in your store.
- Sign in to your My Services page.
- Click the Store link.
/msdyn_blobfile/$value)
- Go to Checkout & Registration Manager.
/msdyn_blobfile/$value)
- Go to Global Settings.
/msdyn_blobfile/$value)
- Click the Customer Registration tab.
/msdyn_blobfile/$value)
- Under Customer Registration Settings, select the Customer Registration Enable radio button.
/msdyn_blobfile/$value)
- Next to the Allow Facebook ID option:
- Select the Customers can register using their Facebook ID radio button.
/msdyn_blobfile/$value)
- Enter your Facebook Application ID in the Application ID field and your Application Secret in the Secret field.
/msdyn_blobfile/$value)
- Click the Save button.
/msdyn_blobfile/$value)
- Return to Store Manager and publish your order settings.
/msdyn_blobfile/$value)
- Go to Store Editor to preview the changes to your register and sign-in pop-ups.
/msdyn_blobfile/$value)
- Publish when ready.
/msdyn_blobfile/$value)
Notes for stores using custom checkout CSS
If your store uses custom checkout CSS, the Facebook logo wont be enabled and displayed by default in your store's Customer Registration register and sign in pop-ups. Instead, you may see what should be the Facebook logo replaced with a second Turbify logo. In addition to enabling the Allow Facebook ID option in Checkout & Registration Manager, you'll also need to either edit your custom checkout CSS file, or change to the Default setting.
Edit your custom checkout CSS file
- Go to Checkout & Registration Manager.
- Go to Visual Customization.
/msdyn_blobfile/$value)
- Go to Custom Styles.
/msdyn_blobfile/$value)
- Download your current custom checkout CSS file by clicking the Download custom CSS file link.
/msdyn_blobfile/$value)
- When the CSS file is open for editing, find both instances of provider-sprite.gif and replace these with provider-sprite-yagf.gif.
- Add the following CSS styles to the custom CSS file, as the CSS styles are shown below:
li#yscp_facebook a {background-position:0 -150px;}
li#yscp_facebook a:hover {background-position:-150px -150px;} - Save the changes you've made to your custom CSS file.
- On the Custom Styles page:
- Go to the Upload CSS File section of the page.
- Click the Browse button and locate the updated custom CSS file on your computer
- Click the Upload button.
/msdyn_blobfile/$value)
- Publish your Order Settings.
/msdyn_blobfile/$value)
Change to the Default or Configurable Styles setting
Alternately, you may change your custom checkout CSS to Default or Configurable Styles in Checkout & Registration Manager to enable the Facebook logo on your Customer Registration register and sign in pop-ups. Note: Performing the following steps will overwrite the custom CSS you currently have in place. This option is not recommended if you wish to retain your custom checkout CSS.
- Go to Checkout & Registration Manager.
/msdyn_blobfile/$value)
- Go to Visual Customization.
/msdyn_blobfile/$value)
- Change your settings to either Default or Configurable Styles.
/msdyn_blobfile/$value)
/msdyn_blobfile/$value)
- Publish your Order Settings.
/msdyn_blobfile/$value)