【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

関連記事

Google Chromeから無料でFAX送信ができるGoogle Driveの拡張アプリ「HelloFax」を使ってみた

シロクグロースハックブログで紹介されていたツールですが、実際に使ってみて本当に簡単・便利だったのでご

記事を読む

フォルダの中のフォルダに保存しているファイルをすべて表示する方法

大フォルダの中に小フォルダをいくつも作ってファイルを保存する、よくやりますよね。

記事を読む

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

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

記事を読む

GoogleアカウントはそのままでGoogle+のみ退会する方法

Googleで自分の名前を検索するとGoogle+の登録内容と写真が出てきます。 SNS内であれば

記事を読む

構造化データエラー 解消 アイコン

WordPressテーマ「Stinger3」の構造化データエラーを解消(マークアップ)する方法

ENJILOGさんの記事で知り自身のウェブマスターツールでも確認したところ、同様のエラーが表示されて

記事を読む

【Excel 2010】背景の枠線を消す方法

エクセルで作成したファイル、特に画像やイラストを多用している際は背景の枠線を消した方が見やすい場合が

記事を読む

ニンテンドークラシックミニ ファミリーコンピュータ アイコン

【商品レビュー】 ニンテンドークラシックミニ ファミリーコンピュータを予約引き取り、実際に触ってみた感想をご紹介します

さる11月10日、ついに待ちに待ったあれの発売日でした。そう!「ニンテンドークラシックミニ

記事を読む

小保方正面写真

【STAP細胞】 小保方騒動と自身の経験から分かった「理系・女子校出身」の女はクズだという事実

理化学研究所は先日、STAP細胞の検証実験の中間報告を行いました。それによって「STAPはな

記事を読む

LINEプリペイドカード アイコン

【たかが画像】 LINEスタンプの買い方

はじめて目にした時は「スカイプと何が違うねん」という印象でしたが、今ではコミュニケーションツ

記事を読む

【会員登録・インストール不要】PDFのロック解除ができるwebサービス「crackmyPDF」

WEB上にアップされているPDF文書には元データ保護の為、パスワードが掛けられていることがあります。

記事を読む

PC

Message

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

PC

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

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

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

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

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

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

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

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

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

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

→もっと見る

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