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

公開日: : 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

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

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

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



関連記事



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

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

関連記事

十六茶 アイコン

韓国から持ち帰ったおもしろいもの

先日韓国に行ったときに見つけたおもしろいものをいくつかご紹介します。 17茶 日本で

記事を読む

【小技】 意外と知らないGoogleの検索オプション

Google検索を使う際は探したいキーワードだけを入力することがほとんどですが、実はオプショ

記事を読む

Macでのスクリーンショット(画面キャプチャ)の取り方

OSが変わるとちょっとした操作でも戸惑うものです。 このブログを更新する際にも画面のキャプチャ(ス

記事を読む

Yahoo!ニュースアプリ 木下彩音 アイコン

Yahoo!ニュースアプリのCMの関西弁がうそくさい件

まいど。社畜ブロガー、しんこー(@yakudatsujoho)です。 今回、大阪風のあいさ

記事を読む

ネット回線サポートの仕事をしている友人に聞いた! 【価格別】 プロがおすすめするWi-Fiルーターをご紹介

こんにちは、目に見えないものにはお金をかけたくない男、しんこー(@yakudatsujoho)です。

記事を読む

springforward_icon

Appleの新製品イベント「Spring forward」発表内容まとめ

Appleの新製品発表イベント「Spring forward」が2015年3月9日(日本時間3月10

記事を読む

いいね アイコン

FacebookビジネスアカウントでFacebookページを開設しました。

事後報告になりますが、1/10にFacebookページを開設しました。 ◆役立つ情報.com

記事を読む

【悲報】 PCの画面をワイヤレスでテレビに出力可能なデバイス「AIRTAME」は日本に出荷できないことが判明

昨年末にGIGAZINEで取り上げられていた、PC画面をテレビに無線で出力するデバイス「AIRT

記事を読む

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

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

記事を読む

はてなブックマーク アイコン

はてなブックマークの新着エントリーに掲載されました!

苦節2年、はじめてはてなブックマークの新着エントリーに掲載されました。 先週土曜にアップしたこちら

記事を読む

PC

Message

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

PC

法改正
働き方改革って何? 働き方改革関連法案をふまえて労使が取り組むべき5つのポイント

2019年4月1日から働き方が変わります。 2018年6

キャンパスライフ
採用担当者からアドバイス、楽しい大学生活を送るために必要な11のこと

こんにちは、しんこー(@yakudatsujoho)と申します

社会人になった今だから断言できる、大学生におすすめのアルバイト12選

こんにちは、社会人○○目のしんこー(@yakudatsujoh

もしもし ポリスメン
【最大報酬10万円】 身バレもなく安心、警察への匿名タレコミができる「匿名通報ダイヤル」

犯罪もしくは犯罪の可能性がありそうなシーンに出くわしたが、逆恨みが怖く

公的保障 アイコン
【公的保障】 取りっぱぐれは大損! 届け出をするだけでもらえるお金

自治体によっては届け出だけでもらえるお見舞い金や支援金などが存

→もっと見る

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