2019.11.23スポンサーリンクWordPressでテーブル作成する有名なプラグインにTablePressがあります。TablePressはHTMLタグを知らない初心者の方は必ずと言っていいほど使うと思いますが、せっかく作った表がスマホなどで中途半端なレスポンシブになっており、がっかりする人も多いと思います。このプラグインは別プラグインでレスポンシブ対応できるaddonがありますが、実はあまり知られていないようなのでご紹介します。設定responsiveオプションresponsive_breakpointオプション設定例まとめTablePressプラグインには拡張プラグインがあるまず、TablePressを知らないという方は、以下の公式に登録されているので必要に応じてインストールしてください。code.wordpress.orgTablePressには様々な拡張プラグインがあります。Tableアドオンもその一つです。Premiumと書かれているアドオンは寄付を募っているので便利だと思って使い続けるのであれば寄付した方が良いかもしれません。Extensionは、これを回避するための4つのアプローチを提供します。Tableのインストールこちらからプラグインのzipファイルをダウンロードします。TablePresstablepress.org次に、Wordpressのプラグイン追加を選び、アップロードしてインストールして有効化すればOK。Tableの4つのレスポンシブモード最初の3つのモードでは、ソート、フィルタリング、ページネーションが引き続き機能します。stackモードはソートができません。flip:このモードでは、拡張機能はテーブルを横に反転し(行は列として表示され、逆も同様)、水平にスクロール可能にすることで、テーブルのレイアウトを変更します。このモードは、プレーンなデータ/テキストテーブルには適したソリューションですが、通常、画像を含むテーブルではうまく機能しません。scroll:このモードでは、幅が広すぎて水平方向に完全に表示できないテーブルが作成されます。これにより、ユーザーはすべてのテーブルデータにアクセスできます。これは、画像が自動的にサイズ変更されない場合、通常、画像を含むテーブルに適したアプローチです。collapse:このcollapse方法では、表に非表示/展開効果を追加できます。それ以外の場合は切り捨てられる列からデータを非表示にし、代わりに各エントリの下に挿入される折りたたみ可能な行にそのデータを追加します。その行は、「+」および「-」ボタンで表示および非表示にできます。このモードは、ディレクトリテーブルなど、一部の「メイン」列の追加情報を表示するテーブルで特に役立ちます。stack:このstackモードでは、行のセルが隣同士ではなく、互いの上に表示されます。これにより、列が1つしかないように見えるため、テーブルがより狭くなります。テーブルヘッド行の列ヘッダーセルは表示されないため、この方法は、ディレクトリテーブルなどの情報が簡単に認識できるテキストデータに最適です。TablePressのショートコードに、レスポンシブのモードとブレークポイントのオプションを指定します。/]responsiveオプションmodeにflip、scroll、collapse、またはstackのいずれかを指定します。responsive_breakpointオプションphone:携帯電話(画面幅が768ピクセルより小さいデバイス)のみレスポンシブが有効になります。tablet:携帯電話とタブレット(画面幅が980ピクセル未満のデバイス)のみレスポンシブが有効になります。desktop:携帯電話、タブレット、およびデスクトップモニター(画面幅が1200ピクセル未満のデバイス)でのみレスポンシブが有効になります。all:画面サイズに関係なく、すべての画面でレスポンシブが有効になります。/]まとめTablePressはHTMLタグを知らない初心者の方は必ずと言っていいほど使うと思いますが、せっかく作った表がスマホなどで中途半端なレスポンシブになっており、がっかりする人も多いと思います。Tableアドオンを導入することですべてのデバイスでテーブルを見やすく表示できるようになりますので、是非試してみてください。最新情報をお届けします。この記事を書いた人ブーンはるばる日本よりオランダ王国へやってまいりました。自分の経験が少しでも参考になれば嬉しいです。お問い合わせは、『こちら』からお願い致します。国内シェアNo1の安定性と実績が魅力。SSDで死角なしの万能サーバー。5.0に強制的にアップデートされたのでLuxeritasもバージョン上げてみた遂に、Wordpressのメジャーバージョンアップである5.00がリリースされました。Wordpressのメジャーバージョンアップ(4.x⇒5.x)なのでしばらく様子見してから移行するのが鉄則です。悲しいことに利用しているW...2018.12.20サイト運営WordPressユーザ一覧にソート機能をつけるカスタマイズWordpressの会員サイトなどを運営していて、会員数が増えてくると困ることがあります。codeがリリースされてから結構時間が経ちました。codeで利用できる便利な機能にリピーターというのがあります。リピーターはWixエディタではリスト&グリッドとよばれるパーツになります。Codeとリピータ...2018.08.29サイト運営iphoneだと@マークの全角と半角が区別できない先日、ある人からサイトのパスワードはコレだからとiphoneでメッセージをもらって教えてもらいました。相手に伝えてもパスワード合っていると言い張るので話は平行線でした。無料のWooCommerceテーマで本当に使えるおススメはどれ?最近BASEでオンラインショップを作っている人をよく見かけます。この記事は、外部ショッピングカートを使うと手数料が・・という人はWordpressのショッピングカートプラグインと専用テーマを使うと捗るよ、という内容の記事です。テーマはこの中から選ぶべし私はWordpressテーマを購入するなら国産よりも海外のテーマをおススメしています。海外で販売されているWordpressテーマの方が国産よりも安くて高機能だからです。再インストール方法ホームサイト運営スポンサーリンクブーンはるばる日本よりオランダ王国へやってまいりました。自分の経験が少しでも参考になれば嬉しいです。お問い合わせは、『こちら』からお願い致します。目次TOPへ情報スポンサーリンクブーンはるばる日本よりオランダ王国へやってまいりました。自分の経験が少しでも参考になれば嬉しいです。お問い合わせは、『こちら』からお願い致します。設定responsiveオプションresponsive_breakpointオプション設定例まとめタイトルとURLをコピーしました。