プラグイン「WP Theme ShapeShifter Extensions」バージョン1.0.27の更新情報

バージョン1.0.26で更新情報を書いていませんでしたので、合わせて変更箇所を紹介します。

大雑把に書くと、TinyMCEのボタンに「テーブル」を追加した事ビジュアルエディタとHTMLエディタとの切替時にHTMLの属性値を全てエスケープするようにしたことです。

エスケープ方法はブログで紹介しますので、ここではテーブルに関して紹介します。

 

TInyMCE テーブル 1
TInyMCE テーブル 1

標準的なワードプレスのビジュアルエディタにテーブルが無かったもんですから、簡単なテーブル挿入フォームを追加しました。

「SS」と表示されている「ShapeShifter Button」をクリックすると、右(モバイルページでは上)のようになりますので、テーブルをホバーすると「普通」というメニュアイテムが表示されます。

今後アイテムを追加していく予定ですが、テーブルのアイディアやデザインに乏しいので、注文があると助かります。

 

 

 

TInyMCE テーブル 2
TInyMCE テーブル 2

「普通」のフォームはこんな感じです。

こっちにテーブルのタイプを選択出来るようにしているため、こちらでテーブル設定出来るようにすることも検討しています。「アイテム」->「テーブル」、「アイテム」->「何か」といった感じで、メニュをまとめることもあるかなと思っただけです。

先に挿入例を見た方がどういうものか分かりやすいと思いますので、このフォームのデータで挿入した場合の例を御覧ください。

 

 

 

テーブルタイトルなど
 ID 名前  詳細  メモ 
 1  アイテム1 これはアイテム1です。 気になることなど。 
 2  アイテム2 これはアイテム2です。  無し
 3  アイテム3 これはアイテム3です。   何か
 ID Name  Description  Memo 

 

テーブルの設定が難しくて、モバイル時にカラムの横幅が小さくなって、無意味に縦長になるのを防ぐのが難しいので、もうちょっと改善が必要だと思いますが(JavaScriptで設定した方が良いのかもしれません)、現状ではメインコンテンツの横幅に合わせた一定の横幅を設定していて、横幅が一定値以下の状態になると横にスクロールできるようになっています。

このためカラムで区切ったりすると、ちょっと見にくいテーブルになるかもしれません。

どうやったらPCでもモバイルでも見やすいテーブルになるんやろか。

 

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください