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. 話題のDeepL翻訳はアプリをインストールするとより便利
  2. [レビュー] リンダ・リウカス『ルビイのぼうけん こんにちは!プログラミング』:…
  3. 以前のTwitter画面に戻せる拡張機能「GoodTwitter」が便利「Twi…
  4. 記憶と記録をデジタル化しておくことの重要性と検討すべき項目を整理してみた
  5. [Amazon] アマゾンで「NHKこどもパーク」開始!月額390円で「ワンワン…

関連記事

  1. Cooliris iPhone

    iOS

    InstagramとFacebookへ投稿した写真を閲覧できるビューワー「Cooliris」

    こんにちは。新米が届いて嬉しい@OfficeTAKUです。…

  2. Facebook

    Facebook : Facebookページのコメント欄にコメントすると実名が公開されます

    コメント欄をFacebookコメントにしました!Wordpress…

  3. Photo by Piotr Cichosz on Unsplash

    Web

    お急ぎ下さい!Amazon サイバーマンデーセール 2018

    こんにちは。密林探検隊 @OfficeTAKUです。Amazo…

  4. iPhoneのSafariでFacebookにアクセス
  5. Google

    歴史上の人物リストを作るなら 1899年以前の日数計算もできる Google スプレッドシートが便利…

    こんにちは。今年こそはクラシックソムリエ検定を受験しようかと思…

  6. Google Doodle ロンドンオリンピック開会式 2012/7/27

LINE公式アカウント:OfficeTAKU

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

最近の記事

  1. プレゼンテーション イメージ
  2. ビジネス統計スペシャリスト

人気の記事

  1. Surface Mobile Mouse
  1. Security

    【注意】不在通知を装う詐欺メールがでまわっています!
  2. WebService

    医療情報管理アプリ NOBORI が凄い!CT画像も検査結果もスマホですぐに確認…
  3. Web

    2020年プログラミング教育必修化が不安!!というお母さんお父さんに伝えたいこと…
  4. Security

    【注意!】「2018 年間ビジターアンケート」というフィッシングサイトに騙されな…
  5. 【Facebook】不審なメッセージリクエストでグループ作成のお知らせが届いたら

    Facebook

    【Facebook】不審なメッセージリクエストでグループ作成のお知らせが届いたら…
PAGE TOP