WordPress Advent Calendar 2013、3日目を担当させていただきます。@Toro_Unitです。 今回はWordPressで活用されているようで活用されていないような気がする、editor-style.cssをがっつり掘り下げてみようかと思います。 そもそもeditor-styleとは WordPressの投稿画面のビジュアルエディタ(ビジュアルリッチエディターとも言いますね)に適用するCSSのことです。 テーマのfunctions.phpに add_editor_style(); と記述すると、テーマ内のeditor-style.cssというファイルが、読み込まれるようになります。 また、引数にファイル名を指定することが可能で、その場合、 add_editor_style("css/editor.css"); とすると、テーマディレクトリのcss/editor.c
シンプルな見た目に拘ったWYSIWYGエディタ、Froala WYSIWYG Editorのご紹介です。jQueryに依存しています。ちょっと今まで見た事が無いタイプですね・・・ アイデアが素敵だったのでメモ。シンプルさに拘ったWYSIWYGエディタです。 HTML5のcontenteditableのように、その場で編集可能です。ドラッグすればそこにWYSIWYGエディタが表示されるので、その場で編集できる、というもの。 上記のようにWYSIWYGエディタがポップアップします。勿論、普段から使っているような、常時表示された状態にも出来ます。 <script src="http://code.jquery.com/jquery-1.10.2.js"></script <script src="froala editor.min.js"></script>本体とプラグインを読み込み。 $(fu
プラグイン大好き、@dearwalker_yuyaです。 WordPressって自動で「p」や「br」を入れてくれるんですが親切が仇になることもあるんです。 以前紹介したこれで【閉じタグ】が無かったり【開きタグ】だけ変なとこにあったりと,おかしなエラーが出てました。 調べてみるとWordPressが自動で入れてれる「pタグ」が問題だったようです。 よし、原因はわかりました。対策しましょう! WPプラグイン『PS Disable Auto Formatting』を入れる イメージ通りのプラグインに『PS Disable Auto Formatting』ってステキな奴があったのでこいつを入れます。 WordPressより『PS Disable Auto Formatting』でプラグイン検索で出てきます。 FTPなどでアップロードされる方はこちらからどうぞ。 ・PS Disable Auto
概要 MeryWiki 多機能で軽量なテキストエディタです。 私はメインのテキストエディタに「TeraPad」を使っています。 軽量でシンプル、かつ、欲しい機能をしっかり抑えていてくれます。欲を言えばタブがあれば… というところでしょうか。 テキストエディタは極端な話、テキストファイルを編集できれば良いんですが、メインで使うとなると、以下の機能は最低ラインとして欲しいところです。 Shif-JIS、UTF-8(、EUC-JP)の文字コードを扱える .htmlや.js、.javaなどの拡張子でタグや予約語を色分けしてくれる タブ文字、全角/半角スペース、改行コードなどをわかりやすく表示してくれる 行数表示、指定行へのジャンプができる タブ文字の表示桁数を変更できる また、あれば便利だなと思うのが以下の機能です。これはメインエディタでなくても、サブエディタにあれば良いかなというものです。普段は
WordPressのテーマには、CSSファイルにさまざまな”class”属性や”id”属性が用意されています。 これらをどう活用するかが美しいサイトを作っていくポイントになるようです。 特に、有料テーマを購入した場合、これらを活用しないと宝の持ち腐れになってしまします。 例えば、前の記事でご紹介したように、この賢威ではさまざまなアイコンなどが用意されています。 しかし、このような場合、いちいちタグを手書きで修正しなければなりません。 例えば、上の画像の一番上の場合、ソースに下記のように直接書かなければならず、とても面倒です。 <p class=”caution1″>先頭にCHECK!という画像が付いた状態で表示されます。</p> このような手間を大幅に軽減してくれるのが「AddQuicktag」です。 「AddQuicktag」のインストール方法 「プラグイン」-「新規追加」を選択します。
WordPressのエディタで改行を無効化するプラグイン 2012年1月11日 (水) 今日は久々にWordpressのプラグインネタ。 今日仕事の時にWordpressでちょこちょこっとやってたら、こんな事につまずきました。 それはエディタを切り替えたら改行とかがおかしくなったという事。 Wordpressの改行がエディタであんまり具合がよくないというのは分かってたんですが、ブログを書く程度ならまあルールで吸収できるんですが今回の場合はちょっとどうしようもなかったのでプラグインにお願いしました。 今回助けてもらったプラグインがPS Disable Auto Formattingというプラグイン。 WordpressのHTMLエディタで自動整形する機能を無効化してくれるプラグインです。 これを有効化するとHTMLエディタで改行してもpやbrが出力されずにエディタ内でのbrが反映されるように
シェアしてね♪ Tweet 企業のエンジニアが直接スカウト!~1万人が挑戦済み CodeIQ Tweet WordPressでサイトを作っていると、投稿や固定ページの中にPHPのコードを記述したいときってあると思います。WordPressの記事エディタでは、投稿の中にPHPのコードを書き込んでも保存したときに削除されちゃいます。 テーマファイルを編集して解決できればいいですが、文章の途中でPHPのコードを埋め込むのはテーマファイルの編集ではできませんよね。 そんな時に便利なプラグインが「Exec-PHP」です。 Exec-PHPを導入すると、投稿や固定ページの中にPHPコードを書くことができるようになります。 Exec-PHPのインストール インストール手順は他のプラグインと同じです。 1. Exec-PHPをダウンロードします。 2. ダウンロードしたファイルを展開し wp-conte
テーブルを手軽に作成、管理する為のWordPressプラグイン・TablePressのご紹介です。今まで見てきた中では一番機能性が高そう。良さそうなので後で日本語にして利用しようと思います。 面倒臭いテーブルを作れるようにするプラグイン。クライアントさんは作れないのでこういったプラグインを使ってもらうと良いかも。機会があれば提案してみたい所です。 管理画面でテーブルを作成、ショートコードで表示する、というもの。管理も楽そうです。CSVのインポート/エクスポートにも対応してるみたい。 テーブルは管理画面で列や行を追加、中身を書き込んでいく形となります。Advanced Editorを使えばセル内でWYSIWYGを利用できます。 セル同士の結合も可能なのでそこそこ複雑なテーブルも作れそうです。 一部有料ですが、レスポンシブWebデザイン対応やセル内でのPHPコード実行用のエクステンション等もあ
CodeMirrorでWordPressのhtmlエディタをもっと快適にする 前回「HTML Editor Syntax Highlighter」というWordpressのエディタをハイライト表示するプラグインをご紹介しましたが、これは「CodeMirror」というJSライブラリを使用していまして、このライブラリは様々なカスタマイズができます。 そこで、この記事では「CodeMirror」をカスタマイズしてさらに快適なエディター環境を構築する方法をご紹介します。 投稿日2012年05月08日 更新日2012年10月26日 プラグインの編集 解凍したフォルダの中に「html-editor-syntax-highlighter.php」というファイルがありますのでこれを編集します。 オプションは49~65行目あたりになるので、基本的にはここに項目を追加したりします。 html-editor-s
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く