web-dev-qa-db-ja.com

カスタムアイコンを使用したソーシャル共有リンク

次のカスタム共有アイコンの作成に関する確かな最新情報を探しています。

  • フェイスブック
  • ツイッター
  • Google +
  • LinkedIn
  • Pinterest

私が取得し続けているすべてのドキュメントは、ソーシャルのような/共有ボタンの使用に関するもののようです-ほとんどの場合、私はあまり魅力的ではないと思います。 socialite.jsのようなものは、「ネイティブ」のような/共有ボタンを使用するときに生じる他の問題のいくつかに対処するのに役立ちます（他に何を呼ぶべきかわかりません）。

すべての参考資料/チュートリアルまたはガイダンスは素晴らしいでしょう。

乾杯。

facebooktwitterlinkedingoogle-pluspinterest
71
bigmadwolf

以下、さまざまなサービスURLを提供します

ツイッター

http://Twitter.com/home?status=[TITLE]+[URL]

ディグ

http://www.digg.com/submit?phase=2&url=[URL]&title=[TITLE]

フェイスブック

http://www.facebook.com/share.php?u=[URL]&title=[TITLE]

StumbleUpon

http://www.stumbleupon.com/submit?url=[URL]&title=[TITLE]

おいしい

http://del.icio.us/post?url=[URL]&title=[TITLE]]&notes=[DESCRIPTION]

Linkedin

http://www.linkedin.com/shareArticle?mini=true&url=[URL]&title=[TITLE]&source=[SOURCE/DOMAIN]

スラッシュドット

http://slashdot.org/bookmark.pl?url=[URL]&title=[TITLE]

テクノラティ

http://technorati.com/faves?add=[URL]&title=[TITLE]

タンブラー

http://www.tumblr.com/share?v=3&u=[URL]&t=[TITLE]

Reddit

http://www.reddit.com/submit?url=[URL]&title=[TITLE]

Googleブックマーク

http://www.google.com/bookmarks/mark?op=edit&bkmk=[URL]&title=[title]&annotation=[DESCRIPTION]

ニュースバイン

http://www.newsvine.com/_tools/seed&save?u=[URL]&h=[TITLE]

Ping.fm

http://ping.fm/ref/?link=[URL]&title=[TITLE]&body=[DESCRIPTION]

Evernote

http://www.evernote.com/clip.action?url=[URL]&title=[TITLE]

Google+

https://plus.google.com/share?url=[URL]
177
Baskaran

これらのリンクを簡単に更新してください。ここにGoogle+のリンクがあります

https://plus.google.com/share?url=[URL]

これらのリンクを新しいウィンドウで開く場合は、hrefの後に次のjavascriptコードを追加します。

onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"

このjavascriptコードは、Twitter、Google +、Facebookで動作します（他にもあるかもしれませんが、他のソーシャルネットワークはテストしていません）。

WordPressの例：

<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" onclick="javascript:window.open(this.href,'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;">Here you can add text, image, whatever.</a>
15
Ratko Solaja

必要なソーシャルメディアのカスタム共有リンクを以下に示します。

Facebook

http://www.facebook.com/sharer.php?u=[EncodedURL]

Twitter

http://Twitter.com/share?text=[TITLE]&url=[URL]

Google +

https://plus.google.com/share?url=[EncodedURL]

LinkedIn

http://www.linkedin.com/shareArticle?mini=true&url=[EncodedURL]

Pinterest

http://pinterest.com/pin/create/button/?url=[EncodedURL]&media={[MEDIA]}&description=[TITLE]

他のソーシャルメディアのカスタムURLリンクと実装ガイドは、ここから入手できます- カスタムソーシャル共有リンクの作成方法

7
JoyGuru

Grzegorzによって提案された解決策は非推奨であり、実際にそれを行う最善の方法ではありません。 Facebookの場合、JS SDK（ https://developers.facebook.com/docs/reference/javascript/ ）をロードし、カスタムボタンをクリックしてUIフィードメソッドを呼び出すだけです。 UIメソッドの詳細： https://developers.facebook.com/docs/reference/javascript/FB.ui/

Twitterの場合： https://dev.Twitter.com/docs/Tweet-button#build-your-own

LinkedIn、Google +などには他のオプションもありますが、頭の中でそれらがわからないので、すべてが選択肢を提供しているかどうかはわかりません。

検索を続けてください。たぶん十分に深く掘り下げていないので、Twitterのリンクを見つけるのに2分かかりました:)

7
Claudiu

Facebook共有の場合は、このリンクを任意のオブジェクトに追加するだけです。

<a href="http://www.facebook.com/sharer.php?u=<url to share>
&t=<title of content>">link or image</a>

それ以外の場合：申し訳ありませんが、私はあなたを助けることができません。

4
Grzegorz Ciwoniuk

ボタンおよび共有カウントを異なるソーシャルからカスタマイズするためネットワークおよびURL共有サービスでは、プロキシサーバーを使用できます。ソーシャルボタンサーバー Meddelare はまさにこれを行います（FYI、私はMeddelareの開発者です）。

Meddelare ：これは、AddThisやShareThisなどの共有サービスに代わる、オープンソースで自己ホスト型の代替手段です。プロキシサーバーを自分で実行するため、ソーシャルネットワークの追跡からユーザーのプライバシーを守ることにもなります。ユーザーは、共有ボタンをクリックすることを決定した場合にのみ追跡にオプトインします。ページにアクセスしたからといって暗黙的になることはありません。

いくつかのバージョンがあります： スタンドアロンサーバー 、 Express.jsサーバーのミドルウェア 、および別の 完全にカスタム化されたソリューションのバックエンド 。

Screenshot of a Meddelare example

サーバーから取得するJSON/JSONPとスクリプトの使用法については、 Meddelareの例 を参照してください。

3
Joel Purra

これは、phpでのfacebookの私のソリューションです。他のソーシャルネットワークでも同様のことができると思います。

function customFShare() {
    $like_results = @file_get_contents('http://graph.facebook.com/'. get_permalink());
    $like_array = json_decode($like_results, true);
    return (isset($like_array['shares']) ) ? $like_array['shares'] : "0";
}
function fShareButton() {
    return "<a data-share='http://www.facebook.com/sharer/sharer.php?u=". $your_url_here ."' href='#' rel='nofollow'><i>Icon</i> <span>". customFShare() ."</span></a>";
}

HTML

<div class="facebook-share">
    <?php echo fShareButton(); ?>
</div>

JQuery

jQuery(document).on("click",".facebook-share > a", function (e) {
        e.preventDefault();
        var winHeight = 350,
            winWidth = 520,
            winTop = (screen.height / 2) - (winHeight / 2),
            winLeft = (screen.width / 2) - (winWidth / 2),
            link = $(this).data('share');
        window.open(link, 'sharer', 'top=' + winTop + ',left=' + winLeft + ',toolbar=0,status=0,width=' + winWidth + ',height=' + winHeight);
    });

アイコンとカウンターのある素敵なFacebookボタンが表示されます。

1
zarcode

定期的に更新および再テストされるgithubリポジトリ。約50または60個のサービスが一覧表示されます。

https://github.com/bradvin/social-share-urls

これは、受け入れられている答えよりもはるかに優れています。 NewsVine、Delicious、Slashdot、Ping.fmなどは、現在すべて存在しないサービスです。さらに、いくつかの重要なもの、Skypeなどがありません。

0
HoldOffHunger

ここの答えはどれも、OPの質問に実際に答えているようには見えません。だからここに私の試みがあります：

多くのソーシャルネットワークでは、ロゴの使用方法、アイコンやその他のリンクの共有方法に関するガイドラインガイドラインを実際に提供しています。いくつかは、その主題に関して他のものよりも柔軟です。

もちろん、ほとんどの場合、それらはあなたのデザインにあまりうまくフィットせず、あなたはあなた自身のテーマ/ウェブサイトの色でそれらをカスタマイズしたいかもしれません。

「あなた自身のリスクでこれを行う」はおそらくあなたが得る最高の答えです。

私は弁護士ではありません（これは法的助言ではありません！）が、さまざまな記事で読むことができるものから、sellingアイコンセットのあるウェブサイトカスタマイズされたソーシャルネットワークロゴは、製品リストから削除するように求められました。

Facebook、Twitter、またはその他のソーシャルネットワーク会社が、個人のブログやWebサイト用にアイコン/ロゴをカスタマイズしたとして訴える可能性はほとんどありませんが、自分をカバーしたい場合は、検討することをお勧めしますガイドラインに従って...

ソーシャルネットワークブランドガイドラインへのリンクは次のとおりです。

Webで "[ブランド名]ブランドガイドライン"を検索して、ほぼすべてのソーシャルネットワークでこれらのガイドラインを見つけることができます。

詳細については、上記の情報のソースを参照してください。

お役に立てれば。

0
MrUpsidown

Twitterリンク形式 http://Twitter.com/home?status= [TITLE] + [URL] は廃止され、Twitter iOSアプリでは機能しなくなりました。

代わりに使用

https://Twitter.com/intent/tweet?text=[TITLE]+[URL]

ソース： https://dev.Twitter.com/web/Tweet-button

0
xyz