ワードプレスで料金表を作るもっとも手軽な方法とは?

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

ワードプレスで料金表を作ってみたいと考えたことはありませんか?ウェブサイトにはテーブルと呼ばれる表組み用のタグが用意されています。料金表はこのテーブルという技術を使えば一瞬で作れます。

ワードプレスで料金表を作るもっとも手軽な方法とは?

まずは完成図の表をご紹介いたします。

上記は以前に別の記事で書いた料金表。料金表が掲載されている記事はこちらです。

料金表を事前準備する専用ツール

実はレイアウトを作るための便利なサービスがあります。

▼受講料無料でプログラミング習得💻

⇒ 完全無料のプログラミングスクール  まずは完全無料でプログラミングを学習

下の図をマウスで選びながら「結合」「分割」などのボタンを押すだけです。ちなみに「td⇔th」というボタンは通常のマス目を見出しに変更できるボタンとなります。完成図のグレー部分は「th」です。

行と列を決めてレイアウトを決めましょう。茶色の箇所は「th」。くっついている箇所が結合。以下のように事前に表組みとなる基礎部分を作ります。ちなみに矢印を使えば操作を戻したり進めたりもできます。

専用のコードが以下に出力されます。

メモ帳などにコピーしていきましょう。

コード内の「th」や「td」がどこに該当するかの規則性は覚える必要があります。そして出来上がったコードをワードプレスのエディターに流し込みましょう。テキストモードに切り替えて貼り付けます。

そして保存するとレイアウト通りにページ内に差し込めます。

適用しているテーマによっては「table(料金表)設置に対応していない場合」もあります。料金表(HTMLの表)の作成は以下URLから行えます。慣れると数分で作れますのでぜひ一度お試しくださいませ。

▼Table Tag Generator
https://tabletag.net/ja/

【今すぐ無料プラグインを手に入れる】
無料ダウンロードはこちら

ワードプレス専門家に丸投げする

WPホームページ研究所はワードプレスを中心としたブログ作成・ホームページ制作・オウンドメディア構築・プラグイン設定・調整など幅広いカスタマイズに対応しております。 記事の掲載情報はもちろんお好みの機能をいただければ専属スタッフが心を込めて対応させていただきます。まずはお気軽にお問い合わせくださいませ。

お問い合わせの種類をお選びください(もっとも近い項目)

法人の場合は法人名とご担当者のお名前をご入力ください

返信時のご連絡に利用するメールアドレスをご入力ください

運営中のウェブサイトURLがあればご入力ください

お困りの内容があれば詳しい内容をお聞かせください

保護中: ポジショニングの技

メンバー向けの限定コンテンツ