こんにちは。
本日は初心者ブロガーのためにコードをコピペするだけでリッチなコンテンツを実装できる方法をご紹介します。
難しいjavascriptやPHPなどの知識がなくともグーグル・マップやユーチューブの動画を貼り付けられたりできます。そんな初心者に優しい簡単なAPIの実装方法をレクチャーしていきます。（ワードプレスを使用している前提で説明します）
目次
スポンサーリンク
Youtubeの動画の貼り付け方法
知らない人はいないYoutubeですが、紹介したい動画などがあった時に簡単に自分のブログに実装することができます。
まず見たい動画ページに飛びます。
僕が大好きな炎上系ユーチューバーを例にとって説明します笑
画面左下の方の「共有ボタン」を押す
チャンネル登録ボタンのすぐ下にあります。
埋め込みコードを押して下のコードを全て選択してコピーしてください。
※この時必ずすべてのコードをしっかりコピーしましょう。（途中でソースが切れていると表示されません）
つぎにワードプレスの投稿編集ページに飛ぶ
右側のテキストタブを押す
コピーしてきたテキストをペーストする。
下記のように簡単に動画を貼れることができます。
ポケモンGOの動画ですが、、、笑
グーグル・マップの貼り付け方法。
地図またはルートをサイトに埋め込む方法です。ブログ紹介する場所をお知らせするのに便利そうですね。
まずグーグル・マップを開きます。
埋め込みたい地図やストリートビュー画像、またはルートを地図上に表示します。
共有ボタンを押す
地図を埋め込むタブを押し、ソースをコピー。
つぎにワードプレスの投稿編集ページに飛ぶ
右側のテキストタブを押す
コピーしてきたテキストをペーストする。
下記のような地図を埋め込めます。
グーグル・マップは下記のように共有できるものとできないものがあるらしいです。
共有できるものとできないもの
共有できるもの:
- 場所、ビジネス情報、住所
- ルートの検索結果
- ストリートビューの画像
共有できないもの:
- 保存した場所を含む地図（自分専用のため）
- 距離測定の結果を含む地図
- 地図そのもののスクリーンショットや画像
facebookのページを埋め込む
まず下記URLにアクセス。
URL：https://developers.facebook.com/docs/plugins/page-plugin
必要な情報を入力。
※ここでは詳しい入力の仕方は割愛しますが、上記URLに詳しく書かれているのでご参照ください。
コードを取得ボタンを押す
「iframe」タグを押し、ソースをコピーする。
つぎにワードプレスの投稿編集ページに飛ぶ
右側のテキストタブを押す
コピーしてきたテキストをペーストする。
埋め込み完了です！
twitterのつぶやきを埋め込む方法
おもしろいつぶやきや、ためになるつぶやきをブログで紹介する際はめちゃくちゃ便利です。そしてめっちゃ簡単です。
ツイッターにアクセス。
つぶやきの中の「・・・」を押す
プルダウン内の「ツイートをサイトに埋め込む」を押す。
ソースをコピーする
つぎにワードプレスの投稿編集ページに飛ぶ
右側のテキストタブを押す
コピーしてきたテキストをペーストする。
つぶやき設置完了。
＼タイムセール開催中／8時間限定！掘り出し物が見つかるかも https://t.co/8aNRrJN7Hv pic.twitter.com/L7VREax8Xa
— Amazon.co.jp (アマゾン) (@AmazonJP) 2016年7月22日
まとめ
いかがでしたでしょうか？
こんなに簡単にできるのかと驚いた方もいそうですね。
昨今は簡単に実装できる様々なプラグインやAPIが充実しています。こういったものをガンガン使えばサイトの質も上がりますし、何よりも作成がスムーズにできます。惜しみなく使うようにしましょう。
それでは！
