WordPressをカスタマイズした更新しやすいサイトづくり

WordPress(ワードプレス)は旧来のウェブサイトのように、ページに掲載するファイル類をサーバーにアップするといった専門的な知識がなくても、SNS のようにブラウザからログインすればページの登録・更新が可能となるシステムです。

ただ、これはサイト内の「すべての箇所」を簡単に変更できることではありません。
例えば、以下のような製品紹介のページを作成したい場合を想定してみます。

HTML ソースでページ情報を管理する

製品紹介ページのサンプルデザイン

上記のようなページを作成・更新したい場合、 通常のワードプレスのブログ機能で管理しようとすると、以下のような例のコードの該当部分を 1 箇所ずつ修正していく必要があります。

<section class="product">
    <figure>
        <img src="https://shopping.com/wp-content/img/product/sample-001.jpg" alt="Fabric Roundchair ファブリック ラウンドチェア">
    </figure>
    <div class="product__info">
        <h1 class="product__title">Fabric Roundchair ファブリック ラウンドチェア</h1>
        <nav class="product__colors">
            <span class="product__color--c1"></span>
            <span class="product__color--c2"></span>
        </nav>
        <table class="product__spec">
            <tr>
                <th>型番</th>
                <td>SFR-204335</td>
            </tr>
            <tr>
                <th>価格</th>
                <td>39,800円(税抜)</td>
            </tr>
            <tr>
                <th>カラー</th>
                <td>ライトブルー / アイボリー</td>
            </tr>
            <tr>
                <th>サイズ</th>
                <td>W84 x H93 x D67 (cm)</td>
            </tr>
            <tr>
                <th>重量</th>
                <td>10.4kg</td>
            </tr>
            <tr>
                <th>耐荷重</th>
                <td>約90kg</td>
            </tr>
            <tr>
                <th>素材</th>
                <td>天然木、ウレタンフォーム、Sバネ、ベルベット</td>
            </tr>
            <tr>
                <th>原産国</th>
                <td>マレーシア</td>
            </tr>
            <tr>
                <th>備考</th>
                <td>製品の特性上、商品サイズには若干の個体差があります</td>
            </tr>
        </table>
        <div class="product__content">
            <p>やわらかな手触りと、おだやかな色合いが特徴的なベルベット地のラウンドチェアです。<br>
            低反発ウレタンを採用したシートは、適度な弾力を持つため長時間座っていても疲れにくく、表面は上質なファブリックを使用しているため、季節を問わず快適にご使用いただける設計です。</p>
        </div>
    </div>
</section>

このような場合、仮にソースコードの詳細がどのような指示になっているか詳しく理解ができなくても、更新作業などを行うことは一応は可能かもしれませんが、言うまでもなく以下のようなデメリットがあります。

  • 記述する場所に間違いがあれば正しく表示されない
  • 誤って必要なコードの一部分を削除してしまうなど、元のフォーマットから過不足が出るとレイアウトが崩れてしまう
  • 該当部分を 1 箇所ずつ選択、書き換える作業は時間や集中力などのリソースを消耗する

そこで、これを使いやすいようにワードプレスにカスタマイズを加えることで、以下のように使いやすい環境を確保することができるようになります。

ページの情報を各種入力フィールドで管理する

例えば、ネットショッピングをする際に名前やメールアドレスなどを入力することがあると思いますが、この「入力する部分」のことを一般的に「フィールド」と呼びます。

先ほど例として挙げた、商品情報の管理方法は「HTML コードを直接編集」する形態となっていましたが、このフィールドを活用することで、「各種の情報のみを入力」すると目的とするページを簡単に作成・更新することができるようになります。
具体的には、以下のような管理画面から必要な情報を入力していくといった方法となります。

情報入力フィールドをカスタマイズしたワードプレスの管理画面

上記のような環境を実現することによって、入力ミスであったり、余計な作業時間を限りなく低く抑えたサイトの運用ができるようになります。

さまざまな分野のウェブサイトにも対応できる

今回はイメージをつかみやすいように家具の製品情報の例をご紹介しましたが、物品に限らず、下記のようにさまざまな分野のサイトでの導入事例があります。

  • 不動産物件情報サイト
    • 家賃、間取り、設備、アクセス情報などを記載
  • 求人情報サイト
    • 募集要項、賃金、雇用形態、待遇などを記載
  • 地域情報サイト
    • 店名、住所、営業時間、クーポン情報などを記載
  • 格安チケット販売サイト
    • 価格、有効期限、利用条件などを記載
    • 埋め込みカートサービスを使用して EC サイトとして運用

フィールドの管理によるサイトの更新は、「名刺代わり」として運用するコーポレートサイトであればさほど重要ではない機能かもしれませんが、積極的に情報を発信するためのウェブサイトでは、もはや必須の機能と呼べると思います。
もちろん当店では、クライアント様のニーズに合致した各種フィールドの設計から構築、運用サポートまで一貫して対応することが可能です。

Excel・スプレッドシートで管理した情報を一括で登録・更新する

上記まではあくまで「1 つのページ」の作成・更新が容易になるといった内容でしたが、仮にウェブサイトのページ数が「数百から数千ページを超える」といった場合は、フィールドを駆使しても全コンテンツの管理は大変な作業となります。

しかし、ページ内の各項目をそれぞれのフィールドで管理したサイトにしておくと、Excel やスプレッドシートで管理している情報を、ワードプレスのサイトにそのまま取り入れることができるようになります。
つまり、表計算ソフトで各ページの情報を管理し、あとは完成したデータをワードプレスサイトに取り込むだけで、ページが多数ある状態でも一括で情報の登録・変更ができることを意味します。

ベストな運用方法まで設計したサイト制作を承ります

どれだけ有用な機能であっても、事業の特性やスタンスなどによってその利便性を十分に活かしきれない可能性もあります。
そこで、当店では「どのように情報を管理すれば、もっとも効率のよい運営ができるか」といった部分からご相談のうえ詳細をお伺いし、設計・構築まで実施致します。
ご不明点等はお気軽にご連絡ください。