勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

微博(weibo)のシェアボタンを設置

      2018/05/09

中国最大のSNSである微博(weibo)のシェアボタンをサイト内に設置したかった。また設置ページごとにシェアするURLを変え、シェアボタンも任意で選択したい。以下に方法をメモ。

 

SNSのアカウントを作成

TOPページからだとなぜか上手くいかなかったので、こちらのページからSNSのアカウントを作成する。中国語だと分かりづらいという場合は、右下のセレクトメニューで「English」に言語を変更すると良い。たまたまかもしれないがページの表示・遷移が非常に遅かったり、Verification code部分が表示されなかったりという現象があった。ページリロードなどで気長に対応するしかなさそう。

001

 

また、メールアドレスで登録後に電話番号登録及びSMS認証があった。電話番号は例えば「090-1234-5678」の場合、Locationを「Japan」で選択し「9012345678」を入力する。「Get A-Code for fee」をクリックするとメールが届くので本文内のコードを入力して「Submit」で登録が完了するはず。ちなみにメールの送信者名が5桁の数字だったのでそれが認証コードと勘違いしてしまった。ちゃんと本文内のコードを確認する。

002

 

 

デベロッパー用ページで設定

こちらのデベロッパー用ページに行くとログインしたままの状態になっているはずなのでそのまま進める。新しいアプリを作成しようとすると個人情報の入力が求められるので、適宜入力する(ここの部分の画像はキャプチャーできていないので省略)。

その後ページ上部の一番左側のメニュー内にある「网站接入(ウェブサイトへのアクセス)」をクリック、ページ遷移後に「立即接入(即時アクセス)」をクリックする。※()カッコ内はGoogle翻訳。

003

「应用名称(アプリケーション名)」にアプリ名を入力する。フォームの横に「只能输入中文英文数字下划线和小数点」と出てきたら「中国語英数字のアンダースコアと小数点のみを入力できます」という意味みたいなので適宜変更する。

004

「应用分类(アプリケーションの分類)」はよく分からなかったのでデフォルトのままで「创建(作成された)」をクリックして初期設定完了。ダイアログが表示されクリックすると自動でページ遷移する。遷移後のページにApp keyがのっているのでメモっておく。

005

 

アイコンを用意する

公式で用意されているこちらのページがオススメ。アイコンを自作したりCSSでボタンを作る場合は必要ない。

 

シェアボタンの作成

表示させたい場所に以下を記述する。

本文とかで日本語が入る場合は以下でエンコードしておいた方が無難かも。エンコードした状態でテストしたところ正常に動いた。

 

テストしてみる

シェアボタン自体はfacebookやtwitterとそんなに変わらないので、問題なくテストできるかと思う。ただシェア後にどの部分に表示されるのか分かりづらかった。

表示されている部分の確認方法として、weiboにログインしているブラウザでTOPページを開くと自身のページに遷移する。その後ページ上部「Game」の横に自身のアカウント名のリンクがあるのでそちらをクリックする。そうするとシェアした内容が表示されているはず。

 

まとめ

weiboのシェアボタンを作成するにはfacebookのようにアカウント及びアプリを作成する必要あり。appkey作成までの道のりが少し長いが、作成してしまえば簡単に設置可能。

 - その他

  関連記事

images
PHPでyoutubeから更新分の情報を取得する(スクレイピング)

「○○のサイトから自動更新分を持ってきて 自サイトに反映させらへん?」と以前に聞 ...

other
RLoginで秘密鍵の使用

SSH接続ソフトのRLoginで秘密鍵を使用したかった。今まで使用したことが無か ...

other
シンタックスシュガー

探し物をしている時に「シンタックスシュガー」という 言葉があり、何それとなったの ...

other
スマホでブックマークした際のアイコンを指定する方法

■やりたい事 スマホでブックマークした時に作られるアイコンを指定させたい。 &n ...

other
SSHのクライアントソフトはTeraTermよりRLoginのが便利

SSHのクライアントソフトはずっとTeraTermを使っていたけど、どうもRLo ...

other
Cronと同じく指定期間に指定URLへアクセスしてくれるサイト

レンタルサーバー等でCronが未対応でも、ある程度Cron同様のサービスが使える ...

other
Dropboxでファイル復元

いざという時の為のメモ。 Dropboxで該当のファイルまで進んで右クリック、 ...

other
ファイルやクラス名等の命名規則

命名規則はちゃんとしといたほうが良いよと 先輩に教わったのでメモ。 ・クラス名は ...

other
ペッパーフラッシュ(Pepper Plugin API)

最近職場で「ペッパーフラッシュが云々……」という会話が 聞こえて(ペッパーフラッ ...

android_logo2-300x224
インテント

モバイルの人との話で「インテントがホニャララ~」という 会話があり、インテントっ ...