WordPress関連コラム  2020.8.20

ワードプレスに引用する方法!守らなければならない4つのルールとは?

ワードプレスでブログを運営している人なら、読者の心にささるものを書きたいですよね。

根拠のある文章を引用することで信憑性が高まったり、魅力ある画像を用いることでブログの価値が上がります。

ではどのような方法で引用できるのでしょうか?

また必ず守らなければいけないルールはあるのでしょうか?

ここでは文章や画像の引用方法をご説明し、引用する際の注意点や守るべきルールもお話していきます。

引用方法や注意点を頭に入れ、正しく活用していきましょう。

ワードプレスの旧エディタ・新エディタで文章を引用する方法

さっそくワードプレスで文章を引用する方法をご説明します。

旧エディタのビジュアルで挿入する方法、テキストエディタで挿入する方法、新エディタで挿入する方法の3つがあります。

どれも難しい操作はないため、数回繰り返してみればすぐに慣れるでしょう。

ご自身が使うワードプレスのバージョンに合わせてそれぞれの方法を試してみてください。

旧エディタ(ClassicEditor)のビジュアルエディタで引用を挿入する方法

まずは、旧エディタのビジュアルエディタで引用を挿入する方法からご説明していきます。

旧エディターとは、WordPress バージョン 4.9以前の標準エディタのことです。

基本的にビジュアルエディタを使ってブログを書き進め、最後にHTMLエディタで細かい修正をされている方が多いと思うので、挿入もビジュアルエディタを使って入れるとスムーズでしょう。

STEP1.引用タグを使って挿入する

始めにビジュアルになっていることを確認します。

引用したい部分をドラッグし、範囲を指定します。

ツールバーの中にある「❝」のアイコンをクリックします。

ワードプレス引用方法

すると引用したい部分の前にアイコンと同じマークが付きます。

ワードプレス引用方法

これで引用タグの挿入は完了です。

STEP2.引用元のリンクを貼る

肝心なのは引用元のリンクを貼ることです。

文章を引用する際は、必ず引用元のリンクを貼る必要があります。

なぜなら引用元となるページを作った方に著作権があるからです。

よく「〇〇より引用」や「参照:〇〇」といった文面を目にしますよね。

これが引用元のリンク先を示しています。

文章を引用した場合は「~より引用」を用い、画像を引用した場合は「参照~」と表示するのが一般的です。

ワードプレス引用方法

リンクを貼る方法ですが、引用元となるページを開き、URLをコピーします。

ワードプレスに戻り、リンクを貼り付けたい箇所を選択したら、リンクの挿入/編集ボタンをクリックしてください。

ワードプレス引用方法

先ほどコピーしたURLを貼り付け、矢印ボタンをクリックすればリンクの貼り付けは完了です。

新しいタブで開くように設定したい場合は、矢印の横のリンク設定を開きます。

ワードプレス引用方法

「リンクを新しいタブで開く」にチェックを入れておきましょう。

ワードプレス引用方法

リンクを新しいタブで開くようにしておくと、読者のページ離脱が少なくなるのでおすすめです。

旧エディター(Classic Editor)のテキストエディタで引用を挿入する方法

次に旧エディターのテキストエディタで引用を挿入する方法をご説明します。

ビジュアルエディタと手順は同じですが、ボタンの位置や表示の仕方に違いがあるため覚えていきましょう。

STEP1.引用タグを使って挿入する

まずテキストになっていることを確認します。

ビジュアルエディタのときと同じように、引用したい部分をドラッグし、範囲を指定します。

テキストエディタの場合「b-quote」のタグが引用タグになるのでそちらをクリックしてください。

ワードプレス引用方法

すると引用したい部分の前後に「blockquote」が表示されます。

ワードプレス引用方法

これで引用タグの挿入は完了です。

STEP2.引用元のリンクを貼る

続いて引用元のリンクを貼り付けます。

手順はビジュアルエディタと同じように、まず引用元のURLをコピーします。

リンクを貼り付ける箇所を選択し、「link」と書かれたタグをクリックしてください。

リンクを挿入/編集画面になるのでURLの欄にコピーしたものを貼り付け適応させましょう。

ワードプレス引用方法

新しいタブで開くようにしたい場合は、リンク設定から行ってください。

プレビューで確認してみると以下のように表示されます。

ワードプレス引用方法

これで、引用の作業が完了です。

新エディタ(Gutenberg)で引用を挿入する方法

続いてWordpress5.0から採用された新しいテキストエディタであるグーテンベルクを使った引用方法をご説明します。

グーテンベルクにはブロックとして各項目が分かれています。引用ブロックは一般ブロックの中に含まれていて「引用」と表示されているところから挿入が可能です。

STEP1.引用タグを使って挿入する

まずは「+」のアイコンをクリックします。

ワードプレス引用方法

テキストから「引用」ボタンを探し、クリックします。ワードプレス引用方法

すると引用を入力…と表示されている部分が出てくるので、そちらに引用したい文章を入力していきます。

もちろんコピペで大丈夫です。

ワードプレス引用方法

続いて引用元を入力…と表示されている部分にリンクを貼り付けていきます。

STEP2.引用元のリンクを貼る

引用元を入力…という部分に引用元のサイト名やタイトルを入力します。

引用元のところに入力したテキストの中で、リンクを設定したい部分をドラッグで選択し、上部のツールバーにある「リンク」アイコンをクリックします。

ワードプレス引用方法

 

するとリンク先のURLを入力する画面が表示されるので、引用元のURLをコピペしてEnterキーを押せば引用元のリンク貼りが完成します。

このとき「新しいタブで開く」にもチェックをしておくと、新しいタブで開くようになります。

ワードプレス引用方法

右側の矢印ボタンを押すと以下のように表示されます。

ワードプレス引用方法

これで完成です。

そもそも引用ってなに?

引用とは他の人が作ったページの文章や画像をコピーしてご自身のページに掲載することを言います。

引用するにあたり、他の人が作った文章や載せている画像には著作権というものがあります。

著作者に引用させてもらうことを報告する必要はありませんが、「使わせてもらいました」という意味を込めて引用と記載をし、リンク先を貼る必要があるのです。

覚えておきたい引用するときの4つのルール

引用方法をご説明してきましたが、どの方法も簡単な操作で挿入することが出来ます。

あわせて覚えておきたいのは引用するときのルールです。

引用と記載する以外に4つのルールがあります。

  • 引用の書き方
  • 引用と参照を使い分ける
  • 引用部分の削除や付け加えはNG
  • 引用を使いすぎない

それでは、順に見ていきましょう。

ルール1.引用の書き方

まず注意したいのは、引用の書き方です。

引用した部分とご自身が書いた部分がはっきり区別出来るような工夫をしないといけません。

ここから先が引用部分と一目で分かるようにするには「」や引用符をつけると分かりやすいです。

背景色を変えたり枠線で囲むのも分かりやすくなるコツです。

せっかくご自身で書いた文章が引用したものと思われないためにも、区別をつける工夫を忘れないようにしてください。

ルール2.引用と参照を使い分ける

引用と参照の違いについても覚えておきたいところです。

引用は他の人が書いた文章や事例などを、ご自身が書く文章の中に用いて紹介することです。

対して参照は、図や文書・データなど資料に多く用いられます。

参照は照らし合わせて比較するために載せるものだと区別しておきましょう。

ルール3.引用部分の削除や付け加えはNG

また、引用部分の削除や付け加えはNG行動になります。

引用する元の文章には、著作権があるため一切改変をしてはいけません。

引用元の文章を一部削除したり、ご自身の意見を付け足すのはもちろん、句読点を加えることもNGです。

どうしても改変を行って引用したいとお考えの場合は、著作者の承諾が必要になります。

ただし引用元の文章が長く、伝えたい部分にスポットを当てて引用したい場合は削除が可能です。

「前略」や「以下略」と明記することを忘れず、割愛しましょう。

ルール4.引用を使いすぎない

引用を使い過ぎすぎないことも注意しておきたいポイントです。

もちろんブログに彩りを加えるために引用するのは悪いことではありません。

しかし引用を使いすぎてしまうと、あなたのブログが他人の文章や画像を寄せ集めてきたオリジナル性のないものになってしまいます。

適度に引用を用いることを頭に入れ、引用はあくまで補完の目的で挿入していくと良いでしょう。

引用のルールを守らないとどうなる?

引用のルールを挙げましたが、引用のルールを守らないとどうなってしまうのでしょうか?

著作権法違反でトラブルになったり、SEOで不利になったりとご自身が困ってしまう可能性があります。

著作権法違反でトラブルになるかも・・・

さきほどからお話しているように、引用元となる文章や画像には著作権があります。

「これは引用したものである」とはっきり記載がされていないと、著作権違反でトラブルになる可能性があります。

著作者から「引用と記載してください」や「削除してください」という通告に対処し大事にならないこともありますが、民事上の請求や刑事罰が課せられるかもしれません。

具体的には損害賠償を請求されたり、新聞広告での謝罪など名誉回復の措置を請求されます。

刑事罰となれば、10年以下の懲役または1000万円以下の罰金もしくはそのどちらもが課せられることになります。

このようなトラブルを回避するためにも、引用する際にはルールを守り正しく引用しましょう。

SEOで不利になるかも・・・

SEOで不利になることも考えられます。

SEOは検索エンジンで検索結果の上位に表示させるテクニックのことですが、引用であると記載しないことがなぜ影響するのでしょう?

それはGoogle検索エンジンが「このWebページはコピーサイトである」と認識するからです。

コピーサイトと認識されてしまうと、コピー元の方が検索上位に表示されますので、どんどん順位を落としてしまいます。

せっかくSEO対策をしていても、コピーサイトとして弾かれてしまったら意味がありません。

著作権の問題にも触れてくるため、必ず引用のルールは守るようにしましょう。

画像を引用する方法と注意点

画像を引用する方法も覚えておくと便利です。

基本的に文章を引用する時とやり方は同じなので、旧エディタと新エディタそれぞれのやり方と同じ手順で進めていきましょう。

画像の場合も文章と同じで引用符をつけ、リンクを貼る等のルールを守らなければいけません。

画像を引用する時に気を付けたいのは肖像権とパブリシティ権の2つです。

肖像権は、画像や写真に写っている人がもつ権利で、許可なく引用するとトラブルの元となってしまいます。

例えば2ショットの写真でも、「自分が映っている写真だから載せても大丈夫かな!」と軽く考えてしまうのは危険です。

パブリシティ権は、芸能人や有名人など引用したことで顧客を集められるような経済効果を生む画像を使ってはいけないことを指します。

フリー画像やインスタをリンクするなどの対策をすることでトラブル回避ができるので、利用してみてください。

慣れたら挑戦!引用のデザインを変える方法

引用のデザインも変えることができます。

ワードプレスでは、以下のものを変更することができます。

  • 引用符の色やデザイン
  • 引用部分を囲むフレーム

デザインを変えると強調したい引用部分に目が留まるので、テクニックとして覚えておくと良いでしょう。

引用のデザインを変えるには、CSSと言って見栄えを整える言語の知識が必要になります。

ベースとなるCSSを書き換えてデザインを変更するのですが、Web初心者にとっては知識を深めるだけでも一苦労です。

ワードプレスに慣れたら挑戦してみると良いでしょう。

それでは、引用のデザインを変える方法を紹介します。

まず外観のテーマ→カスタマイズを開けます。

一番下の「追加CSS」を押すと、CSSを入力する箇所が表示されるのでコードを入力してください。

できたら、「保存して公開」を押すと完了です。

まとめ

ワードプレスで引用する3つの方法や引用する際の注意点をご説明してきました。

どの方法も手軽なだけに多用したくなりますが、あくまでオリジナルページの補完程度に引用を活用すると良いです。

引用する際には、4つのルールを守り正しく引用してください。

文章の引用に慣れてきたら、画像の引用やデザインの変更等にも挑戦し、より魅力あるページに仕上げてみましょう!