Appt

WordPressで売上日報をつくろう

WordPressなら工夫次第で売上日報や営業報告書などの業務システムを構築することもできます。

作り方は簡単です。無料の売上日報システムをあなたも作ってみませんか?

概要


売上日報(営業日報)を無料でシステム化する方法の手順を解説いたします。

WordPressという無料のブログシステムを使って構築します。

WordPressは本来ブログ用のシステムですが、プラグインという拡張機能の追加プログラムを使ってカスタマイズっぽいことが色々できます。

もちろんこのプラグインも無料です。

無料で高機能なツールがたくさん入手できるなんて便利な世の中になったものです。

サーバーを用意する


何はともわれ、WEBの仕組みである以上、サーバーは必要です。さすがにPCでWEBサーバーを構築するのは面倒なので、手頃な価格のレンタルサーバーを用意ください。

お店や会社のホームページで利用しているレンタルサーバーがMySQLというデータベースを使用できるのであればそのレンタルサーバーを使ってもかまいませんが、うっかり操作を誤りホームページに不具合が生じた場合に、ご自身で対処できる場合を除いては、別建てで運用されたほうがよろしいでしょう。

参考までに、手頃な価格のおすすめレンタルサーバーをピックアップしました。

自らが使用しているものの中からデータベース(MySQL)がそこそこ快適に動作するレンタルサーバーを選んでみました。

どのサービスも2週間のお試し期間がありますので、この期間に採用可否をご判断されてみてはいかがでしょう。2週間以内でしたら、万が一フィットしないと判断されても金銭負担はゼロです。

<参考>おすすめレンタルサーバー

レンタルサーバー名 月額料金 コメント WordPressインストール 評価
スターサーバー 250円 コストを抑えて、かつデータベース(MySQL)の速度もそこそこ欲しいという場合にはココ かんたんインストール機能・インストールマニュアルあり
ラクサバ 99円 コストが安いのにサポートが素晴らしく丁寧なレンタルサーバー会社です。初めての方には安心です。 かんたんインストール機能・インストールマニュアルあり
ロリポップ! 250円 低価格レンタルサーバー大手ならではの安心感と、管理画面の使いやすさなどが評価ポイントです。誰もが認める無難な選択です。 かんたんインストール機能・インストールマニュアルあり
wpXレンタルサーバー 1,000円~ WordPressに特化したレンタルサーバーということもあり、データベース(MySQL)の高速さを求めるのであればここです。 かんたんインストール機能・インストールマニュアルあり
ヘテムル 1,500円 ロリポップの上位版にあたります。管理画面はわかりやすいです。そこそこデータベース(MySQL)の高速さを求めるのであればここです。 かんたんインストール機能・インストールマニュアルあり

パフォーマンスを重視するのであれば、ダントツで一番のおすすめはさくらのVPSですが、非エンジニアの方が扱うにはハードルが高く、現実的な選択肢ではないため今回は除外しております。

一応、アドバイスとして一言。市場原理として価格とパフォーマンスは大抵は比例しますので、業務に使用するものは、価格だけで決めないほうが良いとは思われます。

WordPressのインストール


さて、サーバーの準備が済みましたら、今回のメインとなるWordPressというシステムをサーバーへインストールします。

ご心配なさらなくとも、今どきのレンタルサーバーは皆、かんたんインストール機能などと呼ばれる、便利な機能が備わってます。

レンタルサーバーの管理画面からほんの1~2分程度でインストールできますので、難しく考えないでください。

各レンタルサーバーのWordPressかんたんインストール機能については、レンタルサーバーのマニュアルをご確認いただき、マニュアルの手順に従って作業してください。

<注意点>

WordPressはブログツールなので、本来の目的は人に見てもらうものです。WordPressの初心者向け導入ガイドの本やサイトには、アクセスを集めやすい方法から手順を紹介していますが、今回は業務システムとしての導入です。

お店や会社以外の人に公開しないことを前提にするため、少し勝手が違う部分があります。

例えば、独自ドメイン。業務システムとしての利用なので、独自ドメインは必須ではありません。レンタルサーバーのアカウント作成時にもらえるサブドメインを使っていても何ら問題ありません。

また、SEOの観点では、URLは階層が深くならない、長くならないのが良いとされます。ドメイン直下のトップディレクトリにトップページを置けというのがセオリーです。

しかし、今回は他人にアクセスされたくないページなので、もう1階層ぐらい深いディレクトリを作ってインストールしたほうが良いと思います。

特に独自ドメインを使用する場合には、必須です。

例:http://○○○.com/nippo/  ○
  http://○○○.com/     ×

下図はWordPressのデフォルトのインストール時の画面ですが、各レンタルサーバーの簡単インストール機能でも同様の項目の入力があります。

その際、「検索エンジンによるサイトのインデックスを許可する」のチェックは外しておいてください。業務システムにおいては検索エンジンでヒットさせるメリットはあまりありません。

簡単インストールの同項目がなかった場合には、あとからでも設定できますので、後ほどご説明します。

WordPressの初期設定


インストールが終わったら、WordPressの初期設定を行います。

恐らく、簡単インストールの完了後の画面上に「ログイン画面」などのリンクが表示されていると思いますので、そちらをクリックしてください。すると以下のようなログイン画面が表示されるはずです。

簡単インストールの際に、ご自身で登録したID・パスワードでログインすると、ダッシュボード画面へ遷移します。

左サイドのメニューから「設定」>「一般」の順に進みます。

【一般設定】

ここでは、サイトのタイトルや管理者のメールアドレスを設定します。

サイト名 : 適当に名前をつけてください
キャッチフレーズ : 無くても良いです。
メールアドレス : システム管理者のメールアドレス
WordPressアドレス(URL): いじらないこと。
サイトアドレス(URL): いじらないこと。
その他の項目はお好みで。

最後に「変更を保存」をクリックするのを忘れずに。

【投稿設定】

一番下の投稿時の更新情報サービスの中にあるURLを全て削除し、保存してください。

【表示設定】

あとでまた設定しますので、とりあえずそのままにしておきましょう

【ディスカッション設定】

投稿のデフォルト設定のチェックを全部外します。保存するのをお忘れなく。

プラグインをインストール


必要なプラグイン(拡張機能)をインストールしていきます。

メニューから「プラグイン」>「新規追加」と進みます。

【プラグインの新規追加】

プラグインの新規インストール画面で、インストールしたいプラグインを検索します。

まず手始めに「Contact Form 7」を検索してみましょう。

検索結果として候補がいくつか出てきます。該当のプラグインを見つけたら、「いますぐインストール」のリンクをクリックします。

すぐにインストールが始まります。完了したら、「プラグインを有効化」をクリックしてください。これで先ほどのプラグインが使用可能になりました。

同様に次のプラグインもインストールし、有効化してください。

  • Contact Form DB
  • Disable WordPress Theme Updates
  • User Role Editor
  • WP Admin UI Customize
  • WordPress Access Control

WordPressの初期状態でインストール済みのプラグインもあります。

こちらは次のように扱ってください

Akismet:有効化してください。(ユーザー登録が必要です。)

Hello Dolly:削除して結構です。

WP Multibyte Patch:有効化してください。

Contact Form 7の設定


続いて先ほどインストールしたプラグインのContact Form 7を設定します。

メニューの「お問い合わせ」をクリックしてください。

メニューの「新規追加」へ進みます。

「新規追加」ボタンをクリック

コンタクトフォームの新規作成画面が表示されます。

まずはタイトルをつけましょう。とりあえず「売上日報」とでもしておきます。

「無題」の部分をクリックすると編集可能になりますので、編集後Enterキーを押してください。

次にフォームのパーツを配置します。

左側が編集エリア。右側は各パーツのショートコードを作成してくれる補助的な機能です。

右側で欲しいフォームのパーツを作ってみて、そのショートコードを左側の編集エリアにコピペして設定する流れとなります。

お好きな日報の項目を作り、フォームを作成しましょう。

注意点は「名前」は英語表記にすることです。

IDやClass等のオプションはとりあえずは、入力しなくともOKです。

サンプルを作成しましたので参考にしてください。

続いてメールのフォーム登録後に送信されるメールについて設定します。

先ほどフォームを配置した際に使用した名前をカッコ[]でくくると、メールに自動で挿入されます。

メール本文のサンプルも以下に用意しました。

ここまで入力したら、最後に「保存」ボタンを押すのをお忘れなく。画面の下ではなく、上部のタイトルの右側にボタンがあります。

【固定ページの作成】

フォームの作成が終わったので、これを表示させるページを作ります。

先ほど作成したフォームのページ貼り付け用のショートコードをコピーします。

「固定ページ」>「新規追加」の順に進みます。

タイトルに「売上日報」とでも入れておいてください。何でも良いです。これがブラウザ上で表示されるページのタイトルです。

本文には先ほどコピーしたショートコードを貼り付けます。

ここまで終わったら公開ボタンを押して保存します。

固定ページの一覧画面へ移動し、初期状態のサンプルページは削除します。

サンプルページのチェックを入れて、「一括操作」のセレクトボックスから「ゴミ箱へ移動」を選択し「適用」ボタンを押します。

ユーザーアカウント追加


一般ユーザーのアカウントを作成します。

メニューより「ユーザー」>「新規追加」の順で進みます。

特に店舗ごとにアカウントを作らなければならないというわけではありません。管理者として設定が一切できない、売上日報を報告するだけの権限です。

大事なポイントは一番下の「権限グループ」を「購読者」にすることです。「購読者」は管理画面設定を操作できないようにデフォルトで設定されています。

必須項目だけ入力すればOKです。

デザインの調整


デザインを調整します。業務システムなので、あまり凝ったものを求めてはいないと思いますので、今回はいたってシンプルなものを作ります。

WordPressではデザインのテンプレートのことをテーマと呼びます。

WordPressのデフォルトのテーマの中にTwenty Thirteenというものがありますので、今回はこれをベースにちょっとだけカスタマイズしましょう。

まず、メニューより「外観」を選択。Twenty Thirteenを選択してください。選択されたテーマは左上の位置にきます。

続いてメニューより「外観」>「カスタマイズ」へ進みます。

メニューから「サイトタイトルとキャッチフレーズ」を選択します。

ヘッダーテキストを表示するのチェックを外します。

次に「ヘッダー画像」を選択します。

「画像を非表示」のボタンをクリックします。

最後に「固定フロントページ」を選択。

「フロントページの表示」を「固定ページ」にチェックを入れ、フロントページのセレクトリストから先ほど作成した売上日報のページを選択。

「保存して公開」ボタンを押して、「閉じる」をクリックして戻ります。

次にメニューより「外観」>「メニュー」へ進みます。

もし右側のメニュー編集エリア部分に、売上日報以外の固定ページが存在していたら削除しておいてください。

編集後に「メニューを保存」ボタンを押すのを忘れないでください。

スマホ用に少しきれいにデザインを整形したいと思いますので、テーマをカスタマイズします。

メニューより「外観」>「テーマの編集」を選択。編集画面タイトルにスタイルシート(style.css)と表示されていることを確認します。

入力エリアを一番したまでスクロールして、以下のソースをつけ足すようにコピペしてください。

最後に保存するのをお忘れなく。

おまけ

ログイン画面をカッコ良くしたいならば、Branded Login Screenというプラグインを入れてみると良いでしょう。

プラグインをインストールするだけで、きれいなログイン画面へ変更できます。WordPress臭さがなくて良いですね。

一般ユーザーには、余計なものは表示させたくないものです。細かい部分まで徹底させたいのであれば、ここまでどうぞ。

一般ユーザーだけ、ログイン後の管理画面へリンクするヘッダーナビゲーションバーを非表示にします。

メニューより「WP Admin UI Customize」を選択。

「購読者」にだけチェックを入れ、保存。

メニューより「WP Admin UI Customize」>「サイトの設定」へ進みます。

Meta Fieldには全部チェックを入れ、一般の「admin_bar」において「サイトで管理バーを非表示」を選択し、保存します。

お疲れ様でした。以上で全て終了です。

使い方


【日報の登録】

一般ユーザーは、ログイン後に日報入力画面が表示されます。ただそこへ入力して送信するだけです。

送信後、管理者あてにメールがすぐさま届きます。そして管理者だけは管理画面上でもデータの確認が可能となります。

【データ管理】

管理者は管理者アカウントでログインし、データを確認可能です。

メニューより「Contact Form DB」を選択すると、一覧化された表で確認可能です。

アップロードされた写真はリンクになっていますので、写真名のテキストをクリックすると確認可能です。