超低予算で作る出勤管理サイト with WordPress

「女の子の出勤状況も表示出来るウェブサイトを作って欲しい。安価で。」という依頼がございまして、うちの社長が安請け合いして参りましたで候。

女の子の出勤状況が表示出来るっていうとデリヘルやキャバクラなんかで良く見る女の子の写真がずらっと並んでて出勤時間や女の子の簡単なプロフィールが出てる感じのやつですな。よく考えると "出勤管理" とはちょっと趣旨が違うかもしれないが、上手い言葉が思い浮かばないのであしからず。

まぁ今回の安価というのがほんと安価なもんで先方も "これは安すぎたかな" 的な感じは有るようで、勤怠管理システムみたいなのじゃなくて手動でやる感じでも良いらしいので(ていうかそれしか無理やろ)複雑なシステム無しで低予算で出勤状況が表示出来るサイトをWordPressで作ってみました。

目次

低予算で作る出勤管理 with WordPress

概要

1.jpg

概要はこんなの。本日の出勤と、その子を押したら詳細に飛ぶような感じ。とりあえずこれだけ。使う機能は以下2つだけ!

・カスタム投稿
・カスタムフィールド

管理系の作成

カスタム投稿の作成

まずはstaffというカスタム投稿を作成。おもむろにfunction.phpにカスタム投稿を作るコードを書いていきます。

add_action( 'init', 'register_custom_post_types' );
 
function register_custom_post_types() {
 
    $labels = array(
        'name' => 'スタッフ',
        'singular_name' => 'スタッフ',
        'add_new' => 'スタッフを追加',
        'add_new_item' => 'スタッフを追加',
        'edit_item' => 'スタッフを編集',
        'new_item' => '新しいスタッフ',
        'view_item' => 'スタッフを見る',
        'search_items' => 'スタッフ検索',
        'not_found' => 'スタッフが見つかりません',
        'not_found_in_trash' => 'ゴミ箱にスタッフはありません',
        'parent_item_colon' => 'スタッフ:',
        'menu_name' => 'スタッフ',
    );
 
    $args = array(
        'labels' => $labels,
        'hierarchical' => true,
        'description' => 'スタッフ',
        'supports' => array( 'title', 'editor', 'excerpt', 'thumbnail', 'custom-fields','comments' ),
        
        'public' => true,
        'show_ui' => true,
        'show_in_menu' => true,
        'menu_position' => 6,
        'show_in_nav_menus' => true,
        'publicly_queryable' => true,
        'exclude_from_search' => false,
        'has_archive' => true,
        'query_var' => true,
        'can_export' => true,
        'rewrite' => true,
        'capability_type' => 'post'
    );
 
    register_post_type( 'staff', $args );

 }

2.jpg

ほい、スタッフというカスタム投稿が完成。

カスタムフィールドの作成

極力プラグインは使いたくないのですが、入力画面を見やすくしたいので「Custom Field Suite(以下CFS)」というカスタムフィールド作成プラグインを使います。

Custom Field Suite

3.jpg

CFSの設定はこんな感じ。本日出勤は当日の日付で判断する仕組みにしたいところではありますが、時間も予算も無いので真/偽で判断!スタッフが数十人いたら大変そうだが、2〜3人である事を祈ろう。

4.jpg

出勤情報にはデフォルト値を入れておくと先方も入力しやすいかもしれない。まぁ、こういうのはいつもクライアントは自分で好きに弄るからあまり意味は無いのかもしれないが。

5.jpg

スタッフの投稿フォームが完成!うーん、シンプルだ。本日出勤はこんな感じにチェックボタンを付けたり外したりする。まぁ、複雑な勤怠管理を使うよりもシンプルで逆に良いような気がしてきた。

トップ・個別ページの作成

トップページの作成

次にトップページindex.phpの作成。ループ部分だけ書いておくが、get_postsでカスタムフィールドの値meta_keymeta_valueを条件に加えればカスタムフィールドの値をもとにまわせる。

 -1, // 全件
	'post_type' => 'staff', // ポストタイプ
	'post_status' => 'publish', // 公開状態
	'meta_key' => 'staff-today', // カスタムフィールドの名前
	'meta_value' => '1' // カスタムフィールドの値
) );
if( $posts ) : ?>


本日出勤予定のスタッフはおりません・・・

コードはこんな感じ。

1.jpg

これで試しにOZPA氏の「本日出勤」にチェックを入れて更新してみると。

2.jpg

出た!とりあえずデザインは置いておいてこれで本日出勤は完成と。

個別ページの作成

次に個別ページsingle-staff.phpの作成(カスタム投稿の場合、single-xxxx.phpになるので、違う名前でカスタム投稿を作った場合はxxxxを変更する必要有り)CFSはecho CFS()->get()で大体出力出来る。echo post_custom()でも出るのでどちらでも良いのだが、CFS()じゃないとテキストエリアの改行がbrになって出てこないので注意。


年齢
ID,'staff-age',true)) : ?>get('staff-age'); ?>
プロフィール
ID,'staff-profile',true)) : ?>get('staff-profile'); ?>
出勤情報
ID,'staff-schedule',true)) : ?>get('staff-schedule'); ?>

コードはこんな感じ。

3.jpg

\ /
完成

出来た・・・素晴らしい。

カスタム投稿とカスタムフィールドしか使っていないので、シンプルかつ低予算で出勤管理のサイトが出来た。この使い勝手の良さはお客さんも驚くだろうな〜わくわく。

余談

まぁ、冗談はさておき・・・予算が有るなら「AttendThemes」っていう出勤管理プラグインがなかなか使い勝手が良さそうなのだが、どうも風俗専用っぽくて用意されているフィールドもいじれないっぽいのが難点・・・まぁ別個カスタムフィールドで作ればよいのだが、ちょい面倒。まぁ機会が有ったら今度買って試してみようかな。

SPONCERD

コメント2件

はじめまして。大変為になる、記述有難う御座います。
1つ質問宜しいでしょうか。
同様の記述で本日出勤一覧を表示させましたが、縦一列に表示されます。
これを、例えば横3列で表示する等はどういった方法がよろしいでしょうか。
お忙しい所、誠に恐縮ですがどうぞ宜しくお願い致します。

2017.03.15 18:21 匿名

こんばんわ。縦にするか横にするかはあとはもうCSSでのデザイン次第ですね〜
ウルトラ適当ですがこんな感じだったりfloat:left;したりで3列にすれば宜しいかと思います。

ul li{
display:inline-block;
width:32%;
margin-right:1%;
}

2017.03.15 21:27 yogawa


Warning: Undefined variable $user_ID in /home/yogawa/yogawa.com/public_html/wp-content/themes/youkaichi/comments.php on line 55

※承認後に反映されます