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] で入力のダイアログがでてくるので、タグを入力、です。

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

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

Facebook : 氏名とともに旧姓や別名を表示する前のページ

第11回 Facebook勉強会 at AVOSA次のページ

ピックアップ記事

  1. [Instagram] インスタグラムで勝手にレイバンサングラスの投稿がされたら…
  2. 以前のTwitter画面に戻せる拡張機能「GoodTwitter」が便利「Twi…
  3. [PPT] あなたのPowerPointプレゼンテーションを劇的に変えてしまうで…
  4. 【Amazon】6ヶ月間無料体験可能! 学生のみなさん Amazon Prime…
  5. 話題のDeepL翻訳はアプリをインストールするとより便利

関連記事

  1. Google

    YouTube の Cosmic Panda が かわいい

    YouTubeで動画を観る方多いですね。動画は、どうしても見てしま…

  2. Web

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

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

  3. Facebookイベント情報の編集
  4. 『.htaccess』によるログインページ(wp-login.php)へのアクセス制限
  5. Wordpress ビジュアルエディタ

    WordPress

    [WordPress] ビジュアルエディタならExcelの表を簡単にはりつけ可能

    こんにちは。タグは手打ち派 @OfficeTAKUです。普…

LINE公式アカウント:OfficeTAKU

OfficeTAKU Line公式アカウントバナー

最近の記事

人気の記事

  1. 日商PC検定
  2. ロジクール MX KEYS(MAC用)
  1. Hard・Acc

    【楽天モバイル】Rakuten Miniがやってきた-その1:申し込みから商品到…
  2. Photo by John Schnobrich on Unsplash

    WebService

    【Amazon】6ヶ月間無料体験可能! 学生のみなさん Amazon Prime…
  3. 書籍

    集中するためのメソッド、ポモドーロ・テクニックに使えるタイマーを探してみた
  4. Photo by Maja Petric on Unsplash

    グルメ

    サイゼリヤも採用!割れにくいワイングラス・デカンタは透明性の高いトライタン樹脂性…
  5. Photo by Szűcs László on Unsplash

    Mac

    【Mac】Macで時報をアナウンスさせるようにしたら意外と便利です
PAGE TOP