【リアルタイム更新】iPhone Xの在庫状況をチェックする方法 - ドコモ・au・ソフトバンク

最終更新 [2014年7月15日]



キーワード:アカウント, サイト作成, 登録,



facebookやTwitterなどSNSで使うよく見るシェアボタンをオリジナル画像またはスタイルシートなどで作成したオリジナルに変更する方法です。

各コードとWordPressで使う際のサンプルを記載しています。

usedoorでも現在、Facebookのシェアボタン(いいね!じゃないよ)とツイートするボタンをオリジナル画像にしています。
適切な設定を行うことで自分が設定したいオリジナル画像をシェアボタンとして使うことができるようになります。

usedoorでもシェアボタンを増やしていこうかと悩み中です。
オリジナル画像シェアボタンの組み込み方はこのエントリにまとめていきます。

OGPを指定しておこう

またSNSボタンを配置するにあたってヘッダーに「OGP」というものを導入しておく必要があります。
絶対に必要というわけではないのですが、自分側で設定しておくことでシェアされた時に自分が表示させたいように表示させることができるようになります。
Open Graph Protocol(通称:OGP)の設定方法 【wordpressサンプルあり】


ではオリジナルシェアボタンの導入を代表的なところから。


facebookのシェアボタンをオリジナル画像に変更する

Facebook シェアボタンの基本形
<a title="facebookでシェアする" href="http://www.facebook.com/sharer.php?u=【シェアしたいURL】&t=【記事のタイトル】" target="_blank">
<img src="【画像URL】">
</a>
Facebook シェアボタンをWordPressで使う場合のサンプル
<a title="facebookでシェアする" href="http://www.facebook.com/sharer.php?u=<?php echo("http://" . $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"]); ?>&t=<?php echo trim(wp_title( '', false)); ?>" target="_blank">
<img src="【画像URL】>
</a>

↑はURLに現在の記事のURL(これはWordPressというかPHPですが。。)、タイトルにWordPressのwp_titleを使ってtrimしているというものです。

この方法でハメたのがコレ↓


クリックしてみてください~
タイトルとURLがハマった状態でFacebookにジャンプします。

そのままシェアしてもらえると嬉しいなぁ。。

Twitterのツイートボタンをオリジナル画像に変更する

ツイートボタンの基本形
<a href="http://twitter.com/share?url=【ツイートしたいURL】&text=【ツイートしたいタイトル】&via=【@につけたいユーザー名】&related=【ツイートに関連するユーザー】&hashtags=【ハッシュタグ】" target="_blank">
<img src="【画像URL】">
</a>
ツイートボタンをWordPressで使う場合のサンプル
<a href="http://twitter.com/share?url=<?php echo("http://" . $_SERVER["HTTP_HOST"] . $_SERVER["REQUEST_URI"]); ?>&text=<?php echo trim(wp_title( '', false)); ?>&via=sitename" target="_blank">
<img src="<?php echo $twimg; ?>">
</a>

この方法でハメたのがコレ↓


クリックしてみてください~
タイトルとURLがハマった状態でツイート画面が立ち上がります。

つぶやいて欲しいなぁ…

いろんなシェアボタンいろいろと書いていきます!

いまから色々なシェアボタン、オリジナルバージョンの埋め込み方を追記していきます!
末永く、またご指摘や方法を教えて頂ける方からのご連絡もお待ちしています!


< この記事をシェア >




usedoorの新着記事をチェック!

記事を書くヤル気が出るのでフォローよろしくお願いしますm(._.)m


このFacebookやTwitterなどSNSのシェアボタンをオリジナル画像にする方法【WordPressも対応】の最終更新日は2014年7月15日です。
記事の内容に変化やご指摘がありましたら問い合わせフォームまたはusedoorのTwitterまたはusedoorのFacebookページよりご連絡ください。

キーワード:アカウント , サイト作成 , 登録 ,




新着記事

【予約開始はいつ?】「Nintendo Labo(ニンテンドー ラボ)」を予約・購入する方法 – 価格・発売日などまとめ

ゲーム

ダンボールとニンテンドースイッチが合体!発売日は4月20日で価格は税別6,980円~です。

【iPhoneも対応!?】Youtubeの背景が黒になる『ダークテーマ(ダークモード)』を設定する方法

Youtube

夜や暗い場所での動画視聴に最適な公式モード!見た目もブラックでカッコいい

【Clova Friends】LINE無料通話の設定方法

ガジェット

けっこう使えるかも!LINE通話が出来るのは「Clova Friends」だけ!

【3,000円以上利用で1,000dポイント還元!】ドコモ口座払いキャンペーンで3,000dポイントGETする方法

キャンペーン

キャンペーンは1月・2月・3月と計3回実施されるので、すべてに参加すれば全部で3,000ポイントもらえます。


≫ 新着記事をもっと見る



usedoorTOPへ戻る

usedoorをフォロー


  • 注目の使い方

    『Twitterデータ』一覧を確認&カスタマイズをオフにする方法 – 自分のプライバシーデータの利用を制限

    年齢や性別が入っててちょっと怖いと話題の『カスタマイズとデータ』 オフにもできるけど…


    ドコモの月額料金を徹底的に安く&おトクにする方法 – 毎月の料金が高い…という人は読んでみて!

    契約・プランの見直し、各種割引の適用、オプション変更など自分がやっているドコモ回線の維持費を安くする方法+αをまとめました


    LINEのモバイルデータ通信量を抑える設定方法 – 画像や動画周りを節約!

    LINEが原因で通信規制を受けている人は一度設定をチェック!


    イヤホンジャックのないiPhoneで有線イヤホンと充電ケーブルを同時に接続する方法 – belkinの分岐アダプタレビュー&同様のアイテムまとめ

    『3.5mm Audio+Charge RockStar F8J212BTWHT-A』レビュー。当たり前だけど充電と有線イヤホンが同時に快適に使えました


    注目の記事をぜんぶ見る

  • 最新記事

    【予約開始はいつ?】「Nintendo Labo(ニンテンドー ラボ)」を予約・購入する方法 – 価格・発売日などまとめ

    ダンボールとニンテンドースイッチが合体!発売日は4月20日で価格は税別6,980円~です。


    【iPhoneも対応!?】Youtubeの背景が黒になる『ダークテーマ(ダークモード)』を設定する方法

    夜や暗い場所での動画視聴に最適な公式モード!見た目もブラックでカッコいい


    【Clova Friends】LINE無料通話の設定方法

    けっこう使えるかも!LINE通話が出来るのは「Clova Friends」だけ!


    【3,000円以上利用で1,000dポイント還元!】ドコモ口座払いキャンペーンで3,000dポイントGETする方法

    キャンペーンは1月・2月・3月と計3回実施されるので、すべてに参加すれば全部で3,000ポイントもらえます。


    最新記事をもっとチェック

  • 使い方 カテゴリー

    暮らし
    趣味
    節約・稼ぐ
    WEB
    デジタル
  • キーワード

    Amazon Android apple au Chrome iOS iOS 8 iPad iPhone iPhone 6 iPhone 6 Plus iPhone 6s iPhone 6s Plus iPhone 7 iPhone X iPhoneおトク Kindle MNP PC SIMフリー SoftBank Windows windows 10 オトク キャッシュバック クーポン スタンプ スマートフォン セキュリティ ソフトバンク タブレット ドコモ ドコモオトク ドコモオンラインショップ レビュー ワイモバイル 写真 削除 動画 新規契約 機種変更 注目・ピックアップ 無料 登録 非表示
  • usedoorをフォロー


  • あわせて読みたい記事