ビジネス

文字装飾の生産性向上(AddQuicktag+Simple Custom CSS)

WordPressでよく使うCSSを簡単に使えるようにして生産性を上げる方法です。投稿ごとにカスタムCSSを書くのはめんどくさいし、かといってstyle.cssに手を入れるのはなんとなく抵抗があるという方にオススメの方法です。「AddQuicktag」と「Simple Custom CSS」の2つのプラグインを使います。

Simple Custom CSSでCSSを保存

Simple Custom CSSというプラグインを使用するとCSSを保存することができます。イメージとしてはカスタムCSSの共通版のようなものです。では、Simple Custom CSSの導入方法と使い方を紹介します。
WordpressプラグインでSimple Custom CSSをインストールします。

インストールプラグインから「CSSの追加」をクリックするとCSSの編集画面が開くので、カスタムCSSに記載する要領で使いたいCSSをコーディングして「カスタムCSSの更新」ボタンをクリック。

これでSimple Custom CSSの設定は完了です。設定したCSSが投稿で使用できるようになります。

AddQuicktag

Simple Custom CSSの設定は完了しましたが、毎回HTMLタグを書くのはめんどうですし、CSSのネーミングを忘れてしまうといちいち確認するのが面倒です。そこで、投稿の機能ボタンに任意のタグのボタンを追加できるのでAddQuicktagというプラグインです。では、AddQuicktagの導入方法と使い方を紹介します。

こんな感じでタグの機能ボタンを自由に追加できるプラグインです。

WordPressプラグインでAddQuicktagをインストールします。

インストールすると設定の中にAddQuicktagのメニューが追加されるので開きます。

設定画面に追加したいタグを記入します。

①ここで記入した名前が投稿ページ等でのボタン名になります。名前が長いとボタンが長くなってしまうので短くて自分がわかる名前にしましょう

②開始タグを入力します

③終了タグを入力します。入力しなくてもOKです。

④よくやるのですが、チェックをつけないと画面にボタンが追加されませんので必ずチェック。特にこだわりがなければすべてチェックで良いです。

以上でSimple Custom CSSとAddQuicktagの設定完了です。タイトルラベルやアンダーラインなどよく使うCSSがクリックひとつで使えるようになり生産性がグンと上がります。

関連記事

  1. WordPressをAWS(EC2+RDS)で構築④ ~Word…
  2. WordPressをAWS(EC2+RDS)で構築② ~EC2構…
  3. 100円のコーラを1000円で売る方法|読書メモ
  4. 見開きのPDFを2分割にする方法
  5. デザイン思考とは何か
  6. WordPressをAWS(EC2+RDS)で構築③ ~RDS構…
  7. WordPressをAWS(EC2+RDS)で構築① ~導入編~…
  8. AWSで出てくる用語をざっくり整理

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


同じカテゴリの記事

ピックアップ記事1

PAGE TOP