首页 > 解决方案 > 如何在 fb:login-button 上应用自定义 CSS?

问题描述

我想在 facebook javascript sdk 按钮上应用自定义我自己的 CSS。我已经使用下面的这个按钮进行 Facebook 登录。

<fb:login-button id="fblogin" max-rows="1"  width="100px" size="xlarge" class="facebookbutton" scope="public_profile,email" show-faces="false" onlogin="fbLogin();">
                                    Sign up with Facebook
  </fb:login-button>

I have applied CSS like below but this not apply on facebook button.

#fblogin{
width:100% !important;
color:Green !important; 
}

标签: jqueryfacebook-javascript-sdk

解决方案


第 1 步:在您的页面上包含一次JavaScript SDK,最好是在开始正文标记之后。

<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v3.2&appId=yourID&autoLogAppEvents=1"></script>

第 2 步:将此代码放置在您希望插件出现在页面上的任何位置。

<div class="fb-login-button" data-size="large" data-button-type="continue_with" data-auto-logout-link="false" data-use-continue-as="false"></div>

源页面


推荐阅读