Submit a request

Login With Facebook

Follow

Comments

8 comments

  • Avatar
    admin

    This is great! You should make the code you show on this page as text so I can copy and paste it into my site!

  • Avatar
    admin

    What counts as a Newer Theme? I have the Base Theme, but it doesn't seem to be working.

  • Avatar
    Michael Fahrenbruch

    What happens if a customer already has an account and clicks login with Facebook?
    Does it link that account to Facebook?

  • Avatar
    Brian Gluck

    Copy&Paste would be very nice; but I'm happy enough with getting this feature!

  • Avatar
    John Lenertz

    Since I rewrote it you might as well copy & paste it.

    <ac:visibilityarea id="btnFacebookLogin">
    <div class="form-signin">
    <div class="pad-10 pad-t-only">
    $$FACEBOOKLOGINBUTTON$$
    </div>
    </div>
    <p style="text-align: center;">- or -</p>
    /ac:visibilityarea

    <ac:visibilityarea id="LinkedLoginServices">
    <div class="panel panel-default">
    <h3 class="panel-heading no margin MyAccountSectionHeader"? Linked Login Services</h3>
    <div class="panel-body">
    <div class="pad-10 pad-t-only">
    $$FACEBOOKLINKACTION$$
    </div>
    </div>
    </div>
    /ac:visibilityarea

    Michael - customers can link their existing account to Facebook. Login, click MY ACCOUNT, scroll down & link.

  • Avatar
    Michael Fahrenbruch

    John - I did see the feature for customers to link their account, I was just hopeful there was something more automated.
    Instead of requiring existing customers to go to their account page and linking to facebook it would be nice if there were something like a prompt to put in the password tied to that account, or maybe an email sent to that account, and clicking a button to verify the account.

    Don't get me wrong, I'm happy to see this feature, and I'm excited to use it. I just wondered how we could make it easier for existing customers to link their account.

    Thanks for the text, and the response.

  • Avatar
    Mallory Welch

    @admin - To answer your question, all responsive themes should have this functionality. However, if you cannot get it to work on your store front, try adding the $$FACEBOOKLOGINBUTTON$$ merge code into the customer login header widget of your theme using the Widget Layout. Hope this clarifies that.

  • Avatar
    Jack Beukelman

    What John wrote above had some < brackets missing. Seems that saving the post deleted them.
    Just be aware that the ac:visibilityarea is enclosed with <>

    Here is how I did mine. Did a slight modification to make it look natural in my web site. It actually works pretty cool.

    <!-- FB code -->
    <div>
    <p style="text-align: center;">- or -</p>
    <ac:visibilityarea id="btnFacebookLogin">
    <div class="form-signin">
    <div class="button">
    $$FACEBOOKLOGINBUTTON$$
    </div>
    </div>
    /ac:visibilityarea
    <!-- end FB code -->
    and for CSS on the customer login page I added this.
    .FacebookButton { background-color: #4c66a4; color: #fff; }
    .FacebookButton:hover { background-color: #364c7c; color: #fff; }
    .FacebookButton .icon-facebook { font-size: 1.2em; }

    This didn't seem to fit anywhere nor do anything when I added it that I could see so I left it off.
    .form-signin input, .form-signin button { position: relative; font-size: 16px; height: auto; padding: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; }

    and for the Customer my account page I did this.
    <!-- FB code -->
    <div>
    <ac:visibilityarea id="LinkedLoginServices">
    <div class="panel panel-default">
    <h3 class="panel-heading no margin MyAccountSectionHeader"> Linked Login Services</h3>
    <div class="panel-body">
    <div class="pad-10 pad-t-only">
    $$FACEBOOKLINKACTION$$
    </div>
    </div>
    </div>
    /ac:visibilityarea
    </div>
    <!-- end FB code -->

Please sign in to leave a comment.