Pinterest をブログに埋め込み。幅600pxサイズも可能になった!

Pinterest の写真をブログに貼り付ける。大きいサイズ(幅600px)の写真も貼ることができるようになったよ!さっそくその方法を解説。

ソーシャルメディア、SNSで投稿した写真や動画をブログに貼り付けたい。そういうことはよくある。Pinterest にもそういう機能があるにはある。 こんな風にブログに簡単に Pinterest の写真を貼り付けることができるのだ。 方法は1行のタグを書くだけ。

<a data-pin-do="embedPin" href="http://jp.pinterest.com/pin/74098356345423037/"></a>

このタグは、Pinterest ウィジェットビルダー というツールを使うと簡単に作ることができる。 スマホで見る場合にはこれで何も問題ない。パソコンやタブレットで見た時にはどうだろうか。少し写真が小さい気がする。もう少し大きく見せたいがサイズ指定ができないのだ。 もともと Pinterest はサイズ指定したブログへの埋め込みが可能だった。しかし時代が早すぎたのか他人の写真をブログに貼り付けるという行為が強く批判されてしまった。 引用と盗用の線引きは難しい。 一般的に引用というのは以下の条件が必要である。
  • 引用する必然性がある
  • 本文が主、引用が従の関係である
  • 引用部を明確にする
  • 引用元を明示する
下の2つは Pinterest 側で対応可能であり問題はなかった。上の2つは引用する側の問題である。しかし、対応を迫られた Pinterest 側は著作権者に配慮すべく小さいサイズの固定ウィジェットを提供することになったのだ。 当時からブログに埋め込むことが良く行われていた YouTube はどうだろう。あまり問題になっていなかったように思うが、やはり YouTubu を貼り付けるだけの記事を作れば主従関係に問題が起こる。引用ではなく盗用ということになる。それは今も同じ。気をつけなければならない。 それから数年が経ち、インスタグラムという画像SNSが流行始めた。10代の女性の間では Facebook の利用者を上回るというデータも出はじめている。Facebook のオジサン現象が進んでいる。それくらいインスタグラムへ女性ユーザーが流れてきているのだ。  インスタグラム利用は10~20代女性で3割超え。10代女性はFacebookの26%を上回る そのインスタグラム。ブログに貼り付けるのは簡単である。但し普通に貼り付けると幅が658ピクセルになる。これをパソコンで見た時は大きすぎると感じるだろう。そこでサイズを指定してインスタグラムの写真をブログに埋め込む方法を書いた。  instagramブログ埋め込み。サイズ指定貼り付け方法! 但し非公式な方法なのでいずれ問題が起こる可能性もある。 さて時代が追いつき、ほとぼりが冷めたようで Pinterest もインスタグラムと同じように大きめの写真をブログに埋め込むことが可能になった。 但し固定サイズ。幅は600ピクセルだ。レスポンシブ(サイズ可変)なのでスマホの画面でも問題ない。 以前のような小さいサイズ(幅237ピクセル)と中間サイズ(幅345ピクセル)も可能である。 埋め込み写真サイズが3種類あるというのはブログ運営者にとってはありがたい。 埋め込みタグを簡単につくりたいが、先程紹介した Pinterest ウィジェットビルダー はまだ対応していないようだ。 どこにあるかというとデベロッパーツールのウィジェットビルダーにある。  Developers ウィジェットビルダー 便利になったPinterestウィジェットビルダーを使ってブログを書いてみよう! 但し、主と従の関係を間違わないようにご注意を! 今日も元気に楽しく♪ [amazonjs asin=”4798128198″ locale=”JP” title=”Pinterestビジネス講座”] [amazonjs asin=”B011236MGY” locale=”JP” title=”ピンタレスト・マーケティング入門”]

関連記事

[catlist search=”Pinterest” numberposts=5 order=desc]]]>

インスタグラムをWordPressブログに埋め込み、サイズ指定方法!

ブログに貼り付けたインスタグラムの写真が大きすぎる。って思ったことはありませんか?サイズ指定してブログに貼り付ける方法を書きました。

インスタグラムの投稿写真を自分のブログに貼り付ける方法はいろいろあります。

WordPressを使っているならショートコードという便利な機能があり、インスタグラム投稿のURLを記述するだけで埋め込むことができます。
試しに貼り付けてみます。

View this post on Instagram

ドレッシングを作ろう。 . 酢とオイル。 そこに何を加えるかでバリエーションは無限に広がる。 酢の替わりに柑橘系の何かでも良い。 . . . #日記 #写真 #日常 #料理 #ライフスタイル #写真好きな人と繋がりたい #写真日記 #家庭料理 #日常生活 #トマト #サラダ #キッチン #手づくり #ミニトマト #日常風景 #台所 #調理 #オリーブオイル #ボール #酢 #ドレッシング #オイル

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

このブログもWordPressを利用しているので便利なショートコードを使いたいと思うのですが、貼り付けた写真が大きすぎて困ることもあります。上の写真は説明のために貼り付けてるわけです。こんなに大きくなくて良いのです。

写真を見せたい時はそれで良いのですが、小さく貼り付けたい時もあるわけです。キャプションを省きたいこともあるわけです。

 こんな風に小さく控えめに貼り付けしたいわけです。

View this post on Instagram

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

その方法を解説します。

インスタグラムの公式埋め込み機能でサイズ指定

インスタグラム公式の埋め込みコード

公式埋め込み機能を利用します。

 インスタグラムの写真や動画を自分のブログに貼り付ける[公式]方法

まずこの方法でブログに貼り付けます。

キャプションあり

View this post on Instagram

ドレッシングを作ろう。 . 酢とオイル。 そこに何を加えるかでバリエーションは無限に広がる。 酢の替わりに柑橘系の何かでも良い。 . . . #日記 #写真 #日常 #料理 #ライフスタイル #写真好きな人と繋がりたい #写真日記 #家庭料理 #日常生活 #トマト #サラダ #キッチン #手づくり #ミニトマト #日常風景 #台所 #調理 #オリーブオイル #ボール #酢 #ドレッシング #オイル

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

キャプションなし

View this post on Instagram

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

埋め込みコードのサイズ指定

ソースコードの中をみて幅を指定している箇所を見つけ出します。

埋め込みコード

max-width:540px; min-width:326px;

の箇所です。
最大の幅が540px(以前は658pxでした)になっているので、お好みのサイズに変えます。
max-width:320px; min-width:300px; に変えてみました。

View this post on Instagram

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

指定の大きさに貼り付ける事ができます。
非公式な方法なので自己責任でお願いします。

インスタグラム埋め込みembedをブログに貼り付ける方法。

インスタグラムの写真や動画を自分のブログに貼り付ける方法。自分のアカウントへのリンクや「いいね!」「コメント」の数も表示される公式の埋め込みコードです。

インスタグラムの写真をブログに貼る方法

まぁ、すぐに対応するだろうなぁとは思っていたんです。

何がって?

インスタグラムのブログへの貼り付け(Embed)です。

難しいことをしなくてもインスタグラムのブログへの貼り付け(Embed)が普通にできるようになりました。

[adsenseb]

写真の貼り付け

おうちごはん。 . ジャーマンポテト?玉ねぎの代わりにニンニクの芽。 . ニンニクの芽をたくさんお裾分けしていただいた。 . 切ってるときからフワーッとニンニクの深い香りが漂う。 . ニンニクの芽。残りは茹でて冷凍保存しています。 . きっと何に使っても美味しいはず。 . 炒め物しか思いつかないんですけど・・・他に何かオススメの利用方法をご存じですか? . . . #料理 #手料理 #家庭料理 #料理好きな人と繋がりたい #料理写真 #料理男子 #おうちごはん #日常 #日常生活 #日常写真 #日常風景 #写真好きな人と繋がりたい #写真 #フライパン #フライパン料理 #ジャガイモ #ベーコン #ベーコンポテト #炒め物

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

動画の埋め込み

三つ葉 回してみた。 次は何を回そうかな😄 ・ #ベランダ菜園 #三つ葉 #まわる

ひつじさんさん(@hatamoto_s)がシェアした投稿 –

今までもできてたとはいえ埋め込みに不安だった人たちも、公式embedの登場で安心してブログに貼り付けできますね♪

貼り付け方法

右下のシェアボタンをクリックするとEmbed ボタンが表示される。

埋め込み

表示された「Embed」をクリックするとEmbed用コードが開きます。

Embed

そのコードをコピーしてブログに貼り付けるだけです。

ブログに貼り付けるEmbedコード

自分のInstagramへのリンクやお気に入り、コメントの数も表示されるのが嬉しいですね。

サイズを指定して貼り付ける方法もあります。

[adsensemidlink]

関連記事

 インスタグラムをブログに埋め込み。サイズを指定して貼り付ける方法!
 インスタグラムの使い方を学ぶ
 ツイッターにインスタグラムのリンクURLを貼るのは迷惑かもしれない事案発生?
 インスタグラムの位置情報を追加できない時の設定確認と作成方法。