WordPress「引用」のデザイン変更

WP(WordPress)の投稿で、他の文献などを引用したい場合に使える、少し見栄えのよい「引用」のデザインを探してみました。

CSSを使って簡単にデザインを変更する方法を掲載しているサイトはいろいろありますが、その中で良さそうなものを見つけて変更してみました。その変更手順を掲載しています。

こんな感じです。


引用とは、他人が制作した文章やイラストなどの著作物を自分の制作物の中で使用することを指します。

引用:ホームページで正しく引用する方法とは?書き方と注意点を詳しく解説

引用のルールについてはこちらが参考になります。

「引用」のデザインを変更する手順
デザインの変更は、こちらを利用させていただきました
この中から使う「引用」デザインのCSSをコピーします
WPの管理画面で  外観 → カスタマイズ を開きます
追加CSSをクリックします

ここに先ほどコピーしたCSS文を貼り付けます。

以上で設定は完了です。

投稿記事の書き方
引用文の投稿記事は、 カスタムHTML ブロックを使って貼り付けます

カスタムHTMLのブロックに次のHTML文を編集して貼り付けます。

<blockquote>
    <p>引用文</p>
    <cite>引用:引用元の記事タイトル</cite>
</blockquote>
引用ブロック でも投稿できます

引用ブロックを使って投稿するとちょっとバケますが、投稿するには簡単です。


引用とは、他人が制作した文章やイラストなどの著作物を自分の制作物の中で使用することを指します。

        引用:ホームページで正しく引用する方法とは?書き方と注意点を詳しく解説
小さいミニPC
created by Rinker
WPのデザインCSSを配布されているサイト一覧

次のサイトは素敵なデザインが沢山掲載されています。

HigolePC ミニPC
created by Rinker
Verified by MonsterInsights