3

Googleのチュートリアルを使用してサインインを実装しましたが、ボタンが使用しているWebサイトのデザインに実際には適合していません。代わりに、グラフィックデザイナーが作成した画像を使用したいと思います。現在、サインインボタンにカスタム画像を使用することは可能ですか?

4

2 に答える 2

17

gapi.signin.renderを使用して、指定したコンテナーをサインインボタンとしてレンダリングできます。たとえば、HTMLコードに次のようなものがある場合:

<button id="mySignIn">SignIn</button>

Javascriptの呼び出しは次のようになります。

gapi.signin.render("mySignIn", { 
  'callback': signinCallback, 
  'clientid': 'CLIENT_ID', 
  'cookiepolicy': 'single_host_origin', 
  'requestvisibleactions': 'http://schemas.google.com/AddActivity',
  'scope': 'https://www.googleapis.com/auth/plus.login'
});

また、ブランディングガイドラインに従うことを忘れないでください。

于 2013-03-08T02:04:40.383 に答える
-3

次のコードは、ログインボタンをページに追加するために使用されますか?

<span id="signinButton">  
   <span 
      class="g-signin" 
      data-callback="signinCallback" 
      data-clientid="CLIENT_ID" 
      data-cookiepolicy="single_host_origin" 
      data-requestvisibleactions="http://schemas.google.com/AddActivity" 
      data-scope="https://www.googleapis.com/auth/plus.login">  
   </span>
</span>

クラス「g-signin」を自分のクラスに単純に置き換えようとしましたか?

グーグル自体にg-signinが必要な場合、実際のサインインボタンがどれであるかを判断するために、いつでもサブクラスを追加できます。

<span class="g-signin custom" ...></span>

CSSでは、これは次のように表示されます。

.g-signin .custom {
/*properties*/
}
于 2013-03-07T14:24:50.867 に答える