【WordPress】 STINGER3のblockquote(引用タグ)の背景を変えてみた

公開日: : 最終更新日:2017/01/08 WordPress, テクノロジー, 小技

ブログで記事を書くときによそのページの本文やニュース記事の一部を引用することがあります。その場合はblockquoteというタグを使用します。

<blockquote>
ここに引用したい文章を入れる
</blockquote>

このブログはSTINGER3というテーマで構築しているのですが、blockquoteの背景デザインが角ばっていてちょっとダサい(開発者の方すみません。。。)

▼デフォルトのblockquoteの背景デザイン
stinger3 blockquote

というわけでcssをいじってデザインを変えてみました。

STINGER3の引用タグ(blockquote)の背景を変更する

やり方はとても簡単。style.cssの208行目あたりとsmart.cssの122行目あたりの

上記cssを、

に書き換えるだけです。

※必ず事前にバックアップを取っておいてください。

角丸で背景色をベージュに、落ち着いたデザインになりました。
stinger3 blockquote
こちらのページで実際に見られます。

ちなみに書き換え後cssの3行目にある

content: “\275D”;

はフォントアイコン「UTF-8 Icon」です。

UTF-8のフォントアイコンとはUTF-8で読み込まれたファイルに対して、UTF-8の文字コードを入力するだけでフォントアイコンとして表示することができます。

参考:
http://start-now.link/100/archives/1992
http://web-tan.forum.impressrd.jp/e/2016/06/07/23018

こちらのサイトにいろんなアイコンのUTF-8コードが掲載されています。
https://www.utf8icons.com/

今回採用したダブルクォーテーション(“)以外にもたくさんありますので、お好みに合わせて選んでみてください。

PC

最後までお読みいただきありがとうございます。

お手数でなければ記事のご紹介をしていただけると嬉しいです。

ブログの情報はこちらでも配信しています。



follow us in feedly








関連記事



個人的に撮影した写真を公開しています。

旅行先や街中で気になったものを撮影・公開しています。
ダウンロード無料、商用利用OKです。写真AC

関連記事

商品リスト広告

【ベンダー・EC事業者向け情報】 10月からGoogle商品データフィード仕様変更について

10月1日よりGoogle商品リスト広告のデータ元である商品データフィードの仕様が変更となります。

記事を読む

【WordPress】 データベース バックアップ用プラグイン「WP-DBManager」使用方法

WordPressで使用するデータベースを簡単にバックアップしてくれるプラグイン「WP-DBMana

記事を読む

iphone6_plus_icon

意外と知らない? iPhoneの便利な小技6つ

iOS7以降のものになりますが、まとめ記事で見つけたiPhoneの小技6つをご紹介します。ぜひ試して

記事を読む

【SimilarWeb】 競合他社のウェブサイトのアクセス状況はどうなってる? を簡単に調べるツール

2016年8月13日 追記 「競合サイトのPVはどうなってるんだ!」「ユーザー数は?」「他社は

記事を読む

出る アイコン

Googleの検索結果にサイト内検索フォームが出現

何気なくGoogleで検索していたところ、昨日までなかった機能が追加されていました。 (私が気が付

記事を読む

【ほんとにできた】iPhoneは本体を振ることで文字入力の「やり直し」ができる

iPhoneって気付かない機能が多すぎですよね。 たまたま見つけたネタでやってみたらほんとうにでき

記事を読む

WordPress用アクセス解析設置プラグイン「Ultimate Google Analytics」

WordPressのプラグイン「Ultimate Google Analytics」は簡単にGAのア

記事を読む

Crayon Syntax Highlighter icon

WordPress記事内にソースコードを表示させるプラグイン [Crayon Syntax Highlighter]使用方法

Crayon Syntax Highlighterは、WordPress記事内にhtmlやcssなど

記事を読む

Google Analyticsでサイト内検索キーワードを確認する方法

こんにちは、しんこー(@yakudatsujoho)です。 サイトの規模に限らずサイト内検索機能が

記事を読む

違う、そうじゃない

Akismetプラグインを有効化したところスパムコメントが全く来なくなった件

8月の下旬にWordPressのスパム対策プラグイン「Akismet」を有効化し、 WordPre

記事を読む

PC

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

PC

お金 女性
【ブログ収益化】 Googleアドセンスの管理画面でサイト訪問者の好みのカテゴリを知る方法

こんにちは、しんこー(@yakudatsujoho)です。

英語勉強法
初心者がTOEIC600点を取るための効率的な英語の勉強方法とおすすめ参考書・アプリ

就職や転職の際の求人項目でよく目にするTOEIC。 一般的に

【傘パクられた】 他人の傘を平気で盗むクズは死ねばいいのに

こんにちは、しんこー(@yakudatsujoho)です。

しんこーの知恵袋は複数人で更新の体制にします

こんにちは、しんこー(@yakudatsujoho)です。 タイトル

【新型iPhone】 iPhone8とiPhoneX(テン)のスペック・価格の違いなど

現地時間、2017年9月12日 午前10時(日本時間 2017

→もっと見る

  • 名前:しんこー
    仕事:WEB関連の仕事を10年ほど。デザインからコーディング、SEOなど幅広く手掛けている為、社内では「何やってる人?」と思われている。俺にもわからん。

  • follow us in feedly





    Macintosh ブログランキングへ

    ブログランキング・にほんブログ村へ

PAGE TOP ↑