UIKitは、予め様々なCSSを準備されたフレームワークで、タグにclassを当てるだけで様々な効果を表示してくれる便利なものです。レイアウトなどもレスポンシブ対応するような設定をclass付加するだけで行えます。

当然、headタグでUIKitを読み込んでいれば固定ページでも投稿でもクラス当てれば反映するので、テンプレートファイルでなく、固定ページのエディター内でクラス付加したタグをビジュアルエディタで構築すればページ装飾は行えます。

しかし、ある注意点がありました。それは、ビジュアルエディタの自動修正機能の動作によるものでした。ビジュアルエディタの自動修正機能は、文字のみの入力だけ使う場合は便利なものでした。特に何もせず文字のみ入力すると表示側ではpタグが自動入力、エンターキーで改行すると表示側では<br />タグが自動入力などしてくれ、ある程度の装飾や修正を行ってくれます。

UIKitはグリッド設定するときタグにui-gridと入力するのですが、この文字がタグと認識されないために、保存ボタンをクリックすると消えてしまいます。そのため、グリッドで横並びしていたものが登録後に行並びしていてあれ?と思ったことが何度も。

UIKitでよく使うUI-****とタグの末尾に追加するものは、自動でクラスに同じ文字が追加されていて、そのクラスで反応するようなので、WordpressのビジュアルエディタでUIKitのクラス装飾する場合は、手動でクラスに追加してあげてた方が無難化もしれません。

<div class="uk-grid-small" ui-grid>
↓
<div class="uk-grid-small ui-grid"> // 手動でui-gridと入力してしまう