子テーマの作り方には色々な方法があります。ここで紹介している方法は親と子を明確に分離する方法なので、子テーマのCSSが親テーマのCSSと完全に分離するので見やすくすることができます。Bootstrapの導入方法と設定Bootstrapはグリッドデザインやボタン及びナビゲーション等の色々な機能を持っており、これを利用するとかなり自由なデザインが可能になるツールです。このBootstrapをダウンロードし、HTTP画面やビジュアルエディタで使う方法を解説しています。TinyMCEのeditor-style.cssの制限と回避方法TinyMCEの仕様は親テーマのeditor-style.css➡子テーマのeditor-style.cssの順番に読み込みます。ここでは子テーマのeditor-style.cssだけを使う方法を解説しています。ビジュアルエディタとHTTP表示を一致させる方法ビジュアルエディタの表示と、HTTP表示を一致させる為には両方のCSSを合わせる必要があります。ここで注意しなければならない点は下記になります。1ビジュアルエディタのCSS「editor.style.css」は、コンテンツエリアだけのCSSである。2一方、HTTP表示のCSS「style.css」は、コンテンツエリア以外のヘッダーやページにも使うCSSである。よって両方のCSSを一致させるとは「editor.style.css」の定義を「style.cssのコンテンツ領域」に取り込む事を意味しています。TinyMCEの基本スペックとカスタマイズTinyMCEのデフォルトインデントは「padding-left」を使っている為、p要素と画像しかインデントできません。これを「margin-left」に変更する事により総ての要素にインデントが使えるようになります。この辺のTinyMCEのカスタマイズ方法を解説しています。TinyMCEにコラップス機能を実装するコラップスとはアコーディオンなどのようにコンテンツを開閉できる機能でここではBootstrapのコラップス機能をビジュアルエディタで作る方法を解説しています。この機能はHTMLでコラップスを指定した場合に使える機能で、ビジュアルエディタで編集可能なコラップスにする為には自作jqueryでダイナミックにこの機能を与える必要がある。この方法を解説しています。TinyMCEに自作のモーダルウィンドウを実装するBootstrapのモーダルウィンドウの機能をビジュアルエディタで使うとどうしてもBootstrapの仕様の制限を受けます。そこでこの投稿では自作のモーダルウィンドウの作り方を解説します。ここでは背景色の変更やコンテンツエリア幅の変更を可能としています。整形済みテキストと引用の設定と使い方ここでは整形済みテキストと引用の設定と使い方を解説します。整形済みテキストのポイントは入力ミスを起こさせない為の設定で、引用の場合はデフォルトの引用よりもっとビジュアルな引用BOXを作成しています。表示デバイスを取得する方法WordPressで用意されている関数、is_mobileやwp_is_mobileを利用すると、アクセスしてきたデバイスの種類を意識したPHPプログラムを作成する事ができます。ここではこの設定方法と使い方を解説しています。これは画面サイズではありません。画面サイズを取得する為には1セッション機能をONにする。2ajaxを使ったJqueryプログラム3ajaxからのデータを受け取るphpプログラムが必要になります。ajax経路はWordPressのデフォルト経路ではなく独自経路を使っています。