ワードプレスで、漫画やツイッターのつぶやきを埋め込む方法。初心者必見。

埋め込み ブログ運営

記事の中に色々埋め込む方法

WEB漫画を記事の中に埋め込む方法

管理人の フラッキー(@FurakkY)です。漫画を閲覧できる公式サイトに行くと、画像の様に、ブログに貼り付けられる様になっている所があります。しかし、このコード。じつは、このままコピーするだけでは、コンテンツが正常に表示されず、コピーしたコードがそのまま出てきてしまいます。試しにそのままやってみる事にします。

この様に困った事になりました。初心者の私は、てっきりコードをそのままコピーするだけで、元のサイトと同じ様にコンテンツが表示されるものだと思っていたので、解決に少々手こずりました。今回の記事では、この問題の解決方法をご紹介いたします。

プラグイン iframe をインストール

まず上の画像のプラグインをインストールして、有効化してください。次にコピーしたコードのカッコの部分を変更してください。<→ [ ・>→ ] カッコの部分をこの様に変えていただくと、コンテンツが表示されるようになります。こんな説明だと分かりにくいと思うので、比較画像を上下に掲載しておきます。上の画像が元の形で、その下がカッコだけを変えたものです。見比べていただくと、上下でカッコの形が違うのが分かると思います。

そのままコピーしたコード


カッコの形を変えたコード

 

カッコの形を変えて、無事にコピーできると、下の様に表示されます。以前の記事でも掲載した読みきり漫画ですが、是非読んでいただきたいので、再度掲載しておきます。

ツイッターのつぶやきを埋め込む方法

ツイッターのつぶやきを記事に埋め込む方法も、紹介しておきます。これも、最初は、埋め込みたいつぶやきの右上にある下向きの矢印から、「ツイートをサイトに埋め込む」をクリックして、コードをコピーすれば、埋め込まれるのかと思っていました。ところが、実際にはそうではありませんでした。これも、解決に手こずったので、併せて書き残しておきます。

ワードプレスの記事投稿画面の左上にある円の中に+が入ったアイコンをクリックすると、ツイッターのアイコンがあります。それをクリックすると、 URL 入力欄が出てくるので、そこに埋め込みたいつぶやきの「ツイートへのリンクをコピー」を選んで、入力欄に貼り付けると、上の様につぶやきが表示されます。

まとめ。備忘録を兼ねて書きました。

現時点の私は、記事の投稿を始めてまだ半月ほどです。いわば初心者中の初心者です。しかし、それ故に、今後同じ事で困る方が出てくるかもしれない。そういう方に、この記事を役立ててもらえば嬉しいという気持ちで、この記事を書きました。知っている人からすれば、当たり前の事も知らない人からすれば、思いがけない所で、つまづく事もあるので、私と同じ様な初心者の方にも、ご理解いただけるように分かりやすさを意識して書きました。以上で今回の記事を終わります。

コメント

タイトルとURLをコピーしました