WordPress

Web

WordPress HTMLタグの入力を楽にする「Wp Zen Coding」プラグイン

WordPressブログの記事を欠く時、タグの入力とか面倒なので以前はエディタで書いて貼り付けていたこともありました。
しかし、最近はめんどうなのでWordPressで直接書くことが多くなりました。

ただ、そうするとHTMLタグやCSSの記述は面倒…

入力支援してくれるWordPressプラグインを本気で探さなきゃ、と思っていたのですが、ゴールデンウィークとやらなのでようやくとりかかりました。

ググってみたところ、AddQuicktagWp Zen Coding が目にとまりました。

Wp Zen Coding

AddQuicktagの方が簡単そうでしたが、汎用性が高い Wp Zen Coding をインストールしてみました。

Zen codingなるもの、そういえば、以前ちらっと見たことがあったようだったのだが…

こちらの

と、いうブログエントリを参考にして、まず、Web担の下記のエントリ

を読んで、ざっとZen Codingとはどんなものかお勉強。

HTMLタグやCSSの入力支援ツール。
テキストエディタのプラグインとして開発されたものが、いまではDreamWeaverやWordPressなどのプラグインも開発されているとのこと。

その上で 「Wp Zen Coding」 をインストール。
プラグインの新規追加で Wp Zen Coding で検索、インストールをクリックするだけで、簡単に終了。

h1タグを入力する場合は、
h1 と入力し 直後に [コマンド]キー+[E]キーを押します。

そうすることで、

<h1></h1>

というワンセットのタグが入力できます。

CSSのクラスが入ったタグを挿入する場合は、
h2.size-l などと入力し、 [Tab]キー([コマンド]キー+[E]キー) で、

<h2 class="size-l"></h2>

というタグが挿入されます。

先に文章を入力した場合は、範囲選択し、[コマンド]+[Shift]+[A] で入力のダイアログがでてくるので、タグを入力、です。

記法、ショートカットキーさえある程度覚えれば便利に使えそうです。

参考にさせてもらったサイト

ピックアップ記事

  1. 机からケーブルを落とさない NuAns WORKLIFE FOLDKEEPER …
  2. [レビュー] Lenovo Ideapad 520 スタンダードな充実ノートパソ…
  3. [レビュー] 『親子で学ぶ プログラミング超入門 ~Scratchでゲームを作ろ…
  4. [Kindle] 2018年8月 月替わりセール ピックアップ
  5. [PPT] あなたのPowerPointプレゼンテーションを劇的に変えてしまうで…

関連記事

  1. Google

    Gmail を テキスト形式にする

    Gmail で メッセージを作成する時にテキスト形式に変更する方法です…

  2. Facebook

    Facebook : Facebookページのアップデートを逃さずキャッチする方法

    こんにちは。@OfficeTAKUです。自分のニュースフィ…

  3. Mail

    たまってるメールの大掃除!Hotmailのクリーンアップ機能が便利!

    メールはGmailに全て統合しています。フリーメールの老舗とも…

  4. Web

    吹奏楽部はあります!新聞部はありませんorz あなたの部は?Amazonに部活動ストアオープン

    こんにちは。中学は吹奏楽部、高校は新聞部だった @OfficeTA…

  5. Web

    Amazonカワイイ特集でみつけたカワイイものたち!

    こんにちは。年甲斐もなくカワイイもの好き@OfficeTAKUです…

最近の記事

  1. Photo by Aitor Romero on Unsplash
  2. Photo by rawpixel on Unsplash
  3. Photo by Szűcs László on Unsplash

人気の記事

  1. Photo by Szűcs László on Unsplash
  2. Photo by Samuel Zeller on Unsplash
  3. Photo by S A R A H ✗ S H A R P on Unsplash
  4. PAPERANG-P2
  1. Security

    [mixi] ミクシィ乗っ取られ記。放置している方は至急確認を!オークリー サン…
  2. 書籍

    [レビュー] 『親子でかんたん スクラッチプログラミングの図鑑』松下孝太郎・山本…
  3. 日記

    サマータイムは亡霊か?何度も呼び戻されてくる愚策に対抗するために知っておくべきこ…
  4. Photo by S A R A H ✗ S H A R P on Unsplash

    Facebook

    [Facebook] フェイスブック「追悼アカウント管理人」を指定しました
  5. Web

    2018年7月 の人気記事はこれだ!月間 アクセス数 ベスト10
PAGE TOP