2017/08/20

AddQuicktagプラグインで、タグ挿入ボタンをマテリアル仕様にカスタマイズすると、記事を簡単に装飾することが出来ます。
sponsored link
Contents
タグ挿入ボタン
WordPressの記事編集ページには、タグ挿入ボタンがついています。
このタグ挿入ボタンをカスタマイズ出来るのがAddQuicktagプラグインです。
AddQuicktag
マテリアルでは記事を書く際に、よく使うであろう文字装飾等はデフォルトでcssを当てています。
AddQuicktagプラグインをインストールして、↓こちらのjsonファイルをaddquicktagの設定画面からインポートすると、以下のタグが全てワンクリックで入力出来るようになります。
“AddQuicktag用 jsonファイル” をダウンロード addquicktag_material_2.0.json_.zip – 3050 回のダウンロード – 2 KB
マテリアルのデフォルトcss
※マテリアル1.5.7で微調整しましたので、それ以前のバージョンをお使いの場合、同じように表示されないものもあります。
赤字
1 |
<span class="red">赤字です</span> |
赤字です
青字
1 |
<span class="blue">青字です</span> |
青字です
緑字
1 |
<span class="green">緑字です</span> |
緑字です
薄い字
1 |
<span class="gray">薄字です</span> |
薄い字です
やや大きい字
1 |
<span class="l">やや大きい字です</span> |
やや大きい字です
かなり大きい字
1 |
<span class="ll">かなり大きい字です</span> |
かなり大きい字です
やや小さい字
1 |
<span class="s">やや小さい字です</span> |
やや小さい字です
かなり小さい字
1 |
<span class="ss">かなり小さい字です</span> |
かなり小さい字です
太字
1 |
<span class="b">太字です</span> |
太字です
合わせ技
1 |
<span class="red ll">かなり大きい赤字です</span> |
かなり大きい赤字です
赤背景
1 |
<p>強調したいところを<span class="back-red">赤い背景です</span>に出来ます。</p> |
強調したいところを赤い背景に出来ます。
青背景
1 |
<p>強調したいところを<span class="back-blue">青い背景です</span>に出来ます。</p> |
強調したいところを青い背景に出来ます。
引用文
1 2 3 |
<blockquote> どこかから文を引用する時はblockquoteタグで囲いましょう。 </blockquote> |
どこかから文を引用する時はblockquoteタグで囲いましょう
普通のリスト
1 2 3 4 5 |
<ul> <li>りんご</li> <li>バナナ</li> <li>いちご</li> </ul> |
- りんご
- バナナ
- いちご
番号付きリスト
1 2 3 4 5 |
<ol> <li>りんご</li> <li>バナナ</li> <li>いちご</li> </ol> |
- りんご
- バナナ
- いちご
説明つきリスト
1 2 3 4 5 6 7 8 |
<dl> <dt>りんご</dt> <dd>りんごはりんごの木になっています。甘くておいしいのでニュートン先生もりんごが大好きです。</dd> <dt>バナナ</dt> <dd>バナナはフィリピンでいっぱいとれます。サッカーで曲がるシュートのことをバナナシュートと言います。いや最近は言いません。</dd> <dt>いちご</dt> <dd>いちごは甘くてすっぱいかわいい果物です。ショートケーキの上に乗っています。高いものだと一つ500円ぐらいするそうです。</dd> </dl> |
- りんご
- りんごはりんごの木になっています。甘くておいしいのでニュートン先生もりんごが大好きです。
- バナナ
- バナナはフィリピンでいっぱいとれます。サッカーで曲がるシュートのことをバナナシュートと言います。いや最近は言いません。
- いちご
- いちごは甘くてすっぱいかわいい果物です。ショートケーキの上に乗っています。高いものだと一つ500円ぐらいするそうです。
表
1 2 3 4 5 6 7 |
<table class="hyou"> <caption>日本の四季</caption> <tr><th>春</th><td>3月~5月</td><td>花がたくさん咲きます</td></tr> <tr><th>夏</th><td>6月~8月</td><td>暑いです</td></tr> <tr><th>秋</th><td>9月~11月</td><td>涼しくなります</td></tr> <tr><th>冬</th><td>12月~2月</td><td>寒いです</td></tr> </table> |
春 | 3月~5月 | 花がたくさん咲きます |
---|---|---|
夏 | 6月~8月 | 暑いです |
秋 | 9月~11月 | 涼しくなります |
冬 | 12月~2月 | 寒いです |
コメント
畏れ入ります。お忙しい中申し訳ありません。
マテリアルインストールさせていただいたのですが、
さらにこちらのjsonもインストールさせていただいているのですが、
タグは入るものの、色がぜんぜん反映されません。
感じとしてはCSSがない・・・?感じがします。
何か手順が抜けているのでしょうか・・・。
wp_material-2.13.0.zip
↓
wp_material_child-1.1.zip
↓
子テーマ適用
↓
AddQuicktagインストール
↓
addquicktag_material_2.0.json インポート
by 清水っ子 2017年5月24日 12:45 AM
すみません。
一つわかりました。
子テーマだとダメなようです。
親テーマを反映したところ、ちゃんと色がつきました。
by 清水っ子 2017年5月24日 12:51 AM
お騒がせしました。
なぜか色がつくようになりました・・・。
by 清水っ子 2017年5月24日 1:04 AM
はじめまして。初心者でサイトを作成奮闘中です。今一つ。嫌、もう全てが大変。教えて頂きたいです。ホームの中にボタンを設定したいのです。よく、地図クリックすれば地図が出る、みたいな。やっと、メニューの中に文字が反映されました。内容も入力したいのにどこで設定すればよいのやら。全くの素人です。ごめんなさい。嫌にならず教えていただけませんか。
worldpress,テーマ.マテリアル です。
by masumi 2018年8月30日 10:19 PM