【WordPress】Lightningテーマで在籍キャスト管理プラグイン「krc-cast-manager」を使ってみる
おはようございます。
知人からメンズエステのサイト構築を依頼され、
色々と試行錯誤をして「krc-cast-manager」プラグインに辿り着いたので
構築についてかいつまんで紹介。
個人的にも色々と勉強になりました。
とりあえず、プラグインを組み込んでみたサイトはこちらです。
スポンサーリンク
目次
krc-cast-managerプラグイン
KURUBUSI.net さんが自分用に作成、公開しているWordpressで風俗サイトを構築するためのキャスト管理プラグイン。
風俗サイト構築用で作成されていますが、風俗以外でも普通に使えるんじゃないかと思います。（要カスタマイズ）
メモ次のような機能を組み込めます
・キャスト管理（画像、名前、身長、スタイル、グレード、タイプ、新人かどうかなどを登録できます。）
・キャスト一覧ページの出力
・キャスト詳細（プロフィール）ページの出力
・キャストのスケジュール管理、表示
・任意のランキング作成、表示
・キャスト管理（画像、名前、身長、スタイル、グレード、タイプ、新人かどうかなどを登録できます。）
・キャスト一覧ページの出力
・キャスト詳細（プロフィール）ページの出力
・キャストのスケジュール管理、表示
・任意のランキング作成、表示
完全にすべてプラグイン化されている訳ではなく、設置しようとした場合は若干Wordpress、PHPの知識が必要となります。
それでもこれだけ便利なものを提供してくれているのはありがたいことですね。
ほかにもいくつかスケジュール管理的なプラグインを試してみましたが、今回依頼されたサイト制作には krc-cast-manager が一番合っていました。
今回構築する環境は次の通り
- wpX Speedサーバー
- Lightningテーマ（子テーマ使用）
プラグインのダウンロードから有効化まで
プラグインのダウンロード
Githubに上がっていますので、そこからダウンロード・解凍します。
ダウンロードしたファイルを解凍すると「krc-cast-manager-master」というフォルダ名で解凍されますので、
「krc-cast-manager」に名前を変更します。
事前準備（任意）
そのまま利用すると、完成後のキャストページのURLが「krc_cast」というようになってしまいます。
どうしても「krc」という文言を使いたくない場合は予めプラグイン内のファイルに記述されている文言を全て「krc_cast」→「cast」に変更してください。
（krc_rankingも同様）
一括で置換するのであれば サクラエディタなどの高機能エディタを利用するといいです。
プラグインのアップロード・有効化
WinSCPなどを利用して、解凍・リネームしたフォルダを「wp-content」＞「plugin」フォルダにアップロードします。
wpXでのアップロードは次の記事を参考にしてください。
「WinSCP」をインストールしてwpXクラウドサーバーにFTP接続する方法
wpX Speedサーバーであればコントロールパネルから WEBファイルマネージャーというものも利用できますよ。
アップロードしたら、Wordpress管理画面のプラグインより有効化します。
これで WordPress管理画面に「キャストマネージャー」というメニューが追加されます。
パーマリンクの設定
重要キャストのページが表示されないとお問合せいただくことが多いのですが、パーマリンクを「投稿名」にしてください。
各ページを作成して配置
最終的なフォルダ構成はこんな感じです。
ショートコード等の作成
全てのページを手作りするわけでなく、一部はショートコードで記事ページに挿入するタイプのものもあります。
function.php
<?php
/*-------------------------------------------*/
/* カスタム投稿タイプ「イベント情報」を追加
/*-------------------------------------------*/
// add_action( 'init', 'add_post_type_event', 0 );
// function add_post_type_event() {
// register_post_type( 'event', /* カスタム投稿タイプのスラッグ */
// array(
// 'labels' => array(
// 'name' => 'イベント情報',
// 'singular_name' => 'イベント情報'
// ),
// 'public' => true,
// 'menu_position' =>5,
// 'has_archive' => true,
// 'supports' => array('title','editor','excerpt','thumbnail','author')
// )
// );
// }
/*-------------------------------------------*/
/* カスタム分類「イベント情報カテゴリー」を追加
/*-------------------------------------------*/
// add_action( 'init', 'add_custom_taxonomy_event', 0 );
// function add_custom_taxonomy_event() {
// register_taxonomy(
// 'event-cat', /* カテゴリーの識別子 */
// 'event', /* 対象の投稿タイプ */
// array(
// 'hierarchical' => true,
// 'update_count_callback' => '_update_post_term_count',
// 'label' => 'イベントカテゴリー',
// 'singular_label' => 'イベント情報カテゴリー',
// 'public' => true,
// 'show_ui' => true,
// )
// );
// }
/********* 備考1 **********
Lightningはカスタム投稿タイプを追加すると、
作成したカスタム投稿タイプのサイドバー用のウィジェットエリアが自動的に追加されます。
プラグイン VK All in One Expansion Unit のウィジェット機能が有効化してあると、
VK_カテゴリー/カスタム分類ウィジェット が使えるので、このウィジェットで、
今回作成した投稿タイプ用のカスタム分類を設定したり、
VK_アーカイブウィジェット で、今回作成したカスタム投稿タイプを指定する事もできます。
/********* 備考2 **********
カスタム投稿タイプのループ部分やサイドバーをカスタマイズしたい場合は、
下記の命名ルールでファイルを作成してアップしてください。
module_loop_★ポストタイプ名★.php
*/
/*-------------------------------------------*/
/* フッターのウィジェットエリアの数を増やす
/*-------------------------------------------*/
// add_filter('lightning_footer_widget_area_count','lightning_footer_widget_area_count_custom');
// function lightning_footer_widget_area_count_custom($footer_widget_area_count){
// $footer_widget_area_count = 4; // ← 1~4の半角数字で設定してください。
// return $footer_widget_area_count;
// }
/*-------------------------------------------*/
/* <head>タグ内に自分の追加したいタグを追加する
/*-------------------------------------------*/
function add_wp_head_custom(){ ?>
<!-- head内に書きたいコード -->
<?php }
// add_action( 'wp_head', 'add_wp_head_custom',1);
function add_wp_footer_custom(){ ?>
<!-- footerに書きたいコード -->
<?php }
// add_action( 'wp_footer', 'add_wp_footer_custom', 1 );
/* --------------------------------------------------------------------------------- *
* 追加処理
*
* --------------------------------------------------------------------------------- */
//wp_enqueue_style( 'animations', get_template_directory_uri() . '/css/flexslider.css' );
//wp_enqueue_script( 'flexslider', get_template_directory_uri() . '/js/jquery.flexslider-min.js', array( 'jquery' ), null,true );
wp_enqueue_style( 'animations', get_bloginfo( 'stylesheet_directory').'/css/flexslider.css');
wp_enqueue_script( 'flexslider', get_bloginfo( 'stylesheet_directory').'/js/jquery.flexslider-min.js', array('jquery'), null, true );
/**
* 個人ページに表示するスケジュール
*
*/
function singlecalendar($id)
{
$week = array(
"日",
"月",
"火",
"水",
"木",
"金",
"土"
);
$today = strtotime(date("Y-m-d", strtotime("+3 hour")));
echo '<div class="krc_calendar clearfix">';
for ($i = 0;$i <= 4;$i++)
{
$yy = date('w', strtotime('+' . $i . ' day'));
$y = date('D', strtotime('+' . $i . ' day', $today));
if (date('Y-m-d', strtotime('+' . $i . ' day', $today)) == $day) $y = 'target';
echo '<dl><dt class="' . mb_strtolower($y) . '">' . strtoupper(date('n/j(' . $week[$yy] . ')', strtotime('+' . $i . ' day', $today))) . '</dt>';
if ($casttime = today_schedule($id, date('Y-m-d', strtotime('+' . $i . ' day', $today))))
{
echo '<dd>';
if ($casttime['starttime'] !== '0') echo esc_html($casttime['starttime']);
echo ' ～ ';
if ($casttime['endtime'] !== '0') echo esc_html($casttime['endtime']);
echo '</dd></dl>';
}
else
{
echo '<dd>-</dd></dl>';
}
}
echo '</div>';
}
function today_schedule($id, $day = '')
{ //本日の出勤確認
$day = $day != '' ? $day : date("Y-m-d", strtotime("+3 hour"));
$day = htmlentities($day, ENT_QUOTES, 'utf-8');
$works = outschedule($day);
if ($works && $works != 'rest' && array_key_exists($id, $works))
{
return $works[$id];
}
else
{
return false;
}
}
/**
* スケジュール取得
*
*/
function outschedule($day)
{ //DBから該当の日付のデータを取得
global $wpdb;
$table_name = $wpdb->prefix . 'krc_schedules';
$schedules = $wpdb->get_var($wpdb->prepare("SELECT work FROM $table_name WHERE day = %s AND status = %d", $day, 0));
$works = unserialize($schedules);
return $works; //配列にして返す
}
/**
* スケジュールページショートコード
*/
function schedulesHtml()
{
ob_start();
$day = isset($_GET["works"]) ? $_GET['works'] : date("Y-m-d");
$works = outschedule($day);
$len = 6; //+1
$week = array(
"日",
"月",
"火",
"水",
"木",
"金",
"土"
);
echo '<nav class="week_calendar"><ul>';
for ($i = 0;$i <= $len;$i++)
{
$yy = date('w', strtotime('+' . $i . ' day'));
$y = date('D', strtotime('+' . $i . ' day'));
if (date('Y-m-d', strtotime('+' . $i . ' day')) == $day) $y = 'target';
echo '<li class="' . mb_strtolower($y) . '"><a href="' . home_url('/') . '/schedule/?works=' . date('Y-m-d', strtotime('+' . $i . ' day')) . '">' . strtoupper(date('n/j (' . $week[$yy] . ')', strtotime('+' . $i . ' day'))) . '</a></li>';
}
echo '</ul></nav>';
$w = date('w', strtotime($day));
echo '<div class="wp-block-group__inner-container home-block">';
echo '<h2 class="sub-section">' . date('n/j', strtotime($day));
echo '(' . $week[$w] . ')';
echo 'の出勤スケジュール</h2>';
if (!$works)
{
//予定がない場合
echo '<br>';
}
else if ($works != 'rest')
{
//postid順に配列に入っているのでs_order順にした配列を作る
$works_array = array();
foreach ($works as $id => $val)
{
$works_array[$val["s_order"]] = $id;
}
ksort($works_array);
foreach ($works_array as $rder => $id)
{
$args = array(
'post_type' => 'cast',
'post__in' => array(
$id
) ,
);
query_posts($args);
while (have_posts()):
the_post();
set_query_var('work', $works[$id]);
set_query_var('fncName', 'schedulehtml');
get_template_part('content', ('castschedule'));
endwhile;
wp_reset_query();
}
echo '</div>';
}
else
{
//休み
echo '定休日';
}
return ob_get_clean();
}
add_shortcode('scheduleshtml', 'schedulesHtml');
/**
* 本日出勤ショートコード
* TOPページ等に本日の出勤キャストを表示
*
*/
function todaysCastHtml($day = '')
{
ob_start();
$time9 = 9 - 6; //6時に次の日のスケジュールに切り替わる仕様
$day = $day != '' ? $day : date("Y-m-d", strtotime("+" . $time9 . " hour"));
$works = outschedule($day);
addSchedules($works);
return ob_get_clean();
}
function addSchedules($works)
{
$schedule = 'schedule';
if (!$works)
{
//予定がない場合
echo '<br>';
}
else if ($works != 'rest')
{
$works_array = array();
foreach ($works as $id => $val)
{
$works_array[$val["s_order"]] = array(
'id' => $id,
'time' => $val
);
}
ksort($works_array);
foreach ($works_array as $id => $work)
{
$args = array(
'post_type' => 'cast',
'post__in' => array(
$work['id']
) ,
'orderby' => 'post__in'
);
query_posts($args);
while (have_posts()):
the_post();
set_query_var('schedule', $work['time']);
set_query_var('fncName', 'todaysCastHtml');
//content-castlist.phpは用意しておいて下さい。
get_template_part('content', 'castlist');
endwhile;
wp_reset_query();
}
}
else
{
//休み
echo '定休日';
}
}
add_shortcode('todayscasthtml', 'todaysCastHtml', 0);
/**
* 新人キャストショートコード
*
*/
function outNewType () {
ob_start();
$args = array(
'post_type' => 'cast',
'posts_per_page' => -1,
'tax_query' => array(
'relation' => 'AND',
array(
'taxonomy' => 'krc_new',
'field' => 'slug',
'terms' => "新人",
)
));
query_posts($args);
if ( have_posts() ) :
while ( have_posts() ) :
the_post();
set_query_var('fncName', 'outNewType');
get_template_part( 'content', 'castlist' ); //content-castlist.phpは用意しておいて下さい。
endwhile;
endif;
wp_reset_query();
return ob_get_clean();
}
add_shortcode('newcasthtml', 'outNewType');
/**
* FTPアップしたイメージにアクセスしやすくする
*/
function imagepassshort($arg) {
$content = str_replace('"images/', '"' . get_bloginfo('stylesheet_directory') . '/images/', $arg);
return $content;
}
add_action('the_content', 'imagepassshort');
キャスト一覧ページ
キャスト一覧用のファイルを作成します。
archive-cast.php
<?php get_header(); ?>
<!-- ヘッダとパンくず無理やり変更 -->
<div class="section page-header">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="page-header_pageTitle">セラピスト一覧</h1>
</div>
</div>
</div>
<script>
document.title= document.title.replace('キャスト管理','セラピスト一覧');
</script>
</div>
<div class="section breadSection">
<div class="container">
<div class="row">
<ol class="breadcrumb" itemtype="http://schema.org/BreadcrumbList">
<li id="panHome" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://sample.oilnoko.com/"><span itemprop="name"><i class="fa fa-home"></i> HOME</span></a>
</li>
<li>
<span>セラピスト一覧</span></li>
</ol>
</div>
</div>
</div>
<?php
// Dealing with old files.
// Actually, it's ok to only use get_template_part().
/*
Page Header
/*-------------------------------------------*/
$old_file_name[] = 'module_pageTit.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/page-header' );
}
/*
BreadCrumb
/*-------------------------------------------*/
do_action( 'lightning_breadcrumb_before' );
$old_file_name[] = 'module_panList.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/breadcrumb' );
}
do_action( 'lightning_breadcrumb_after' );
?>
<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">
<?php do_action( 'lightning_siteContent_prepend' ); ?>
<div class="container">
<?php do_action( 'lightning_siteContent_container_prepend' ); ?>
<div class="row">
<div class="<?php lightning_the_class_name( 'mainSection' ); ?>" id="main" role="main">
<?php do_action( 'lightning_mainSection_prepend' ); ?>
<?php
/*
Archive title
/*-------------------------------------------*/
$archiveTitle_html = '';
$page_for_posts = lightning_get_page_for_posts();
// Use post top page（ Archive title wrap to div ）.
if ( $page_for_posts['post_top_use'] || get_post_type() !== 'post' ) {
if ( is_year() || is_month() || is_day() || is_tag() || is_author() || is_tax() || is_category() ) {
$archiveTitle = get_the_archive_title();
$archiveTitle_html = '<header class="archive-header"><h1>' . $archiveTitle . '</h1></header>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveTitle', $archiveTitle_html ) );
/*
Archive description
/*-------------------------------------------*/
$archiveDescription_html = '';
if ( is_category() || is_tax() || is_tag() ) {
$archiveDescription = term_description();
$page_number = get_query_var( 'paged', 0 );
if ( ! empty( $archiveDescription ) && $page_number == 0 ) {
$archiveDescription_html = '<div class="archive-meta">' . $archiveDescription . '</div>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveDescription', $archiveDescription_html ) );
$postType = lightning_get_post_type();
do_action( 'lightning_loop_before' );
?>
<div class="<?php lightning_the_class_name( 'postList' ); ?>">
<?php if ( have_posts() ) : ?>
<!-- セラピスト一覧 -->
<div class="cast-wrapper">
<div class="box-title"></div>
<div class="box-body">
<?php while (have_posts()):the_post();?>
<?php get_template_part('content',('castlist'));?>
<?php endwhile;?>
</div>
</div>
<?php
the_posts_pagination(
array(
'mid_size' => 1,
'prev_text' => '«',
'next_text' => '»',
'type' => 'list',
'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'lightning' ) . ' </span>',
)
);
?>
<?php else : // hove_posts() ?>
<div class="well"><p><?php echo wp_kses_post( apply_filters( 'lightning_no_posts_text', __( 'No posts.', 'lightning' ) ) ); ?></p></div>
<?php endif; // have_post() ?>
</div><!-- [ /.postList ] -->
<?php do_action( 'lightning_loop_after' ); ?>
<?php do_action( 'lightning_mainSection_append' ); ?>
</div><!-- [ /.mainSection ] -->
<?php if ( lightning_is_subsection_display() ){ ?>
<div class="<?php lightning_the_class_name( 'sideSection' ); ?>">
<?php get_sidebar( get_post_type() ); ?>
</div><!-- [ /.subSection ] -->
<?php } ?>
<?php do_action( 'lightning_additional_section' ); ?>
</div><!-- [ /.row ] -->
<?php do_action( 'lightning_siteContent_container_apepend' ); ?>
</div><!-- [ /.container ] -->
<?php do_action( 'lightning_siteContent_apepend' ); ?>
</div><!-- [ /.siteContent ] -->
<?php get_footer(); ?>
content-castlist.php
<?php $cast_fields = get_post_custom(); //カスタムフィールドを全部取得 $cast_screens = json_decode($cast_fields['_cast_screens'][0]); //画像配列を用意 $cast_type_terms = get_the_terms($post->ID, 'krc_type'); //タイプタクソノミーを取得 $cast_grade_terms = get_the_terms($post->ID, 'krc_grade'); //グレードタクソノミーを取得 $cast_new_terms = get_the_terms($post->ID, 'krc_new'); //新人区分タクソノミーを取得 ?> <div class="one-cast"> <a href="/cast/<?php echo esc_html($cast_fields['_krc_name'][0]);?>"> <figure> <?php if( empty($cast_screens) ): ?> <img src="<?php echo get_stylesheet_directory_uri();?>/images/noimg.jpg" alt="<?php the_title();?>"> <?php else: ?> <img src="<?php echo $cast_screens[0];?>" alt="<?php the_title();?>"> <?php endif;?> </figure> <figcaption> <span class="cast-name"><?php echo esc_html($cast_fields['_krc_name'][0]);?>(<?php echo esc_html($cast_fields['_krc_age'][0]);?>歳)</span> <span class="cast-size">T:<?php echo esc_html($cast_fields['_krc_tall'][0]);?> B:<?php echo esc_html($cast_fields['_krc_bust'][0]);?>(<?php echo esc_html($cast_fields['_krc_cups'][0]);?>) W:<?php echo esc_html($cast_fields['_krc_waist'][0]);?> H:<?php echo esc_html($cast_fields['_krc_hips'][0]);?></span> </figcaption> </a> <?php if ( $fncName != 'todaysCastHtml'): ?> <?php if (today_schedule(get_the_ID())):?> <span class="todays_cast badge">本日出勤</span> <?php endif;?> <?php endif;?> <?php if ( $fncName != 'outNewType'): ?> <?php if ( !empty($cast_new_terms[0]->name) ):?> <span class="new_cast badge"></span> <?php endif;?> <?php endif;?> <?php if ( !empty($cast_fields['tw_id'][0]) ):?> <a class="tw" href="https://twitter.com/<?php echo esc_html($cast_fields['tw_id'][0]);?>" ></a> <?php endif;?> </div>
archive-cast.php から content-castlist.php が呼び出されています。
キャスト（個人）ページ
キャスト一覧からキャスト画像をクリックで詳細を表示するなど、個人のページを設ける場合に作成します。
single-cast.php
<?php get_header(); ?>
<div class="section page-header">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="page-header_pageTitle">セラピスト</h1>
</div>
</div>
</div>
</div>
<div class="section breadSection">
<div class="container">
<div class="row">
<ol class="breadcrumb" itemtype="http://schema.org/BreadcrumbList">
<li id="panHome" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://sample.oilnoko.com/"><span itemprop="name"><i class="fa fa-home"></i> HOME</span></a>
</li>
<li id="panCast" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://sample.oilnoko.com/cast"><span itemprop="name"> セラピスト一覧</span></a>
</li>
<li>
<span>セラピスト</span></li>
</ol>
</div>
</div>
</div>
<?php
// Dealing with old files.
// Actually, it's ok to only use get_template_part().
/*
Page Header
/*-------------------------------------------*/
$old_file_name[] = 'module_pageTit.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/page-header' );
}
/*
BreadCrumb
/*-------------------------------------------*/
do_action( 'lightning_breadcrumb_before' );
$old_file_name[] = 'module_panList.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/breadcrumb' );
}
do_action( 'lightning_breadcrumb_after' );
?>
<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">
<?php do_action( 'lightning_siteContent_prepend' ); ?>
<div class="container">
<?php do_action( 'lightning_siteContent_container_prepend' ); ?>
<div class="row">
<div class="<?php lightning_the_class_name( 'mainSection' ); ?>" id="main" role="main">
<?php do_action( 'lightning_mainSection_prepend' ); ?>
<?php
/*
Archive title
/*-------------------------------------------*/
$archiveTitle_html = '';
$page_for_posts = lightning_get_page_for_posts();
// Use post top page（ Archive title wrap to div ）.
if ( $page_for_posts['post_top_use'] || get_post_type() !== 'post' ) {
if ( is_year() || is_month() || is_day() || is_tag() || is_author() || is_tax() || is_category() ) {
$archiveTitle = get_the_archive_title();
$archiveTitle_html = '<header class="archive-header"><h1>' . $archiveTitle . '</h1></header>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveTitle', $archiveTitle_html ) );
/*
Archive description
/*-------------------------------------------*/
$archiveDescription_html = '';
if ( is_category() || is_tax() || is_tag() ) {
$archiveDescription = term_description();
$page_number = get_query_var( 'paged', 0 );
if ( ! empty( $archiveDescription ) && $page_number == 0 ) {
$archiveDescription_html = '<div class="archive-meta">' . $archiveDescription . '</div>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveDescription', $archiveDescription_html ) );
$postType = lightning_get_post_type();
do_action( 'lightning_loop_before' );
?>
<div class="<?php lightning_the_class_name( 'postList' ); ?>">
<?php if ( have_posts() ) : ?>
<!-- セラピスト -->
<div class="cast-wrapper">
<div class="box-title"></div>
<div class="box-body">
<?php while (have_posts()):the_post();?>
<?php get_template_part('content',('cast'));?>
<?php endwhile;?>
</div>
</div>
<?php
the_posts_pagination(
array(
'mid_size' => 1,
'prev_text' => '«',
'next_text' => '»',
'type' => 'list',
'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'lightning' ) . ' </span>',
)
);
?>
<?php else : // hove_posts() ?>
<div class="well"><p><?php echo wp_kses_post( apply_filters( 'lightning_no_posts_text', __( 'No posts.', 'lightning' ) ) ); ?></p></div>
<?php endif; // have_post() ?>
</div><!-- [ /.postList ] -->
<?php do_action( 'lightning_loop_after' ); ?>
<?php do_action( 'lightning_mainSection_append' ); ?>
</div><!-- [ /.mainSection ] -->
<?php if ( lightning_is_subsection_display() ){ ?>
<div class="<?php lightning_the_class_name( 'sideSection' ); ?>">
<?php get_sidebar( get_post_type() ); ?>
</div><!-- [ /.subSection ] -->
<?php } ?>
<?php do_action( 'lightning_additional_section' ); ?>
</div><!-- [ /.row ] -->
<?php do_action( 'lightning_siteContent_container_apepend' ); ?>
</div><!-- [ /.container ] -->
<?php do_action( 'lightning_siteContent_apepend' ); ?>
</div><!-- [ /.siteContent ] -->
<?php get_footer(); ?>
content-cast.php
<?php
$cast_fields = get_post_custom(); //カスタムフィールドを全部取得
$cast_screens = json_decode($cast_fields['_cast_screens'][0]); //画像配列を用意
$cast_type_terms = get_the_terms($post->ID, 'krc_type'); //タイプタクソノミーを取得
$cast_grade_terms = get_the_terms($post->ID, 'krc_grade'); //グレードタクソノミーを取得
$cast_new_terms = get_the_terms($post->ID, 'krc_new'); //新人区分タクソノミーを取得
?>
<div class="cast">
<div class="cast-photo">
<?php if( empty($cast_screens) ): ?>
<div class="cast-photo-wrapper"><img src="<?php echo get_stylesheet_directory_uri();?>/images/noimg.jpg" alt="<?php the_title();?>"></div>
<?php else: ?>
<div id="slider" class="flexslider">
<ul class="slides blocks-gallery-grid">
<?php foreach ($cast_screens as $index => $value):?>
<li class="blocks-gallery-item">
<a href="<?php echo $value;?>" rel="gallery">
<img src="<?php echo $value;?>" alt="<?php the_title();?> 写真 <?php echo ($index+1);?>">
</a>
</li>
<?php endforeach;?>
</ul>
</div>
<div id="thumbnail" class="flexslider">
<ul class="slides">
<?php foreach ($cast_screens as $value):?>
<li alt="<?php the_title();?>">
<img src="<?php echo $value;?>" alt="<?php the_title();?>">
</li>
<?php endforeach;?>
</ul>
</div>
<?php endif;?>
</div>
<div class="cast-profile">
<h2 class="sub-section"><?php echo esc_html($cast_fields['_krc_name'][0]);?></h2>
<div class="cast-meta">
<div class="cast-meta-left">
年齢
</div>
<div class="cast-meta-right">
<?php echo esc_html($cast_fields['_krc_age'][0]);?>歳
</div>
<div class="cast-meta-left">
身長
</div>
<div class="cast-meta-right">
T:<?php echo esc_html($cast_fields['_krc_tall'][0]);?>
</div>
<div class="cast-meta-left">
スリーサイズ
</div>
<div class="cast-meta-right">
B:<?php echo esc_html($cast_fields['_krc_bust'][0]);?>(<?php echo esc_html($cast_fields['_krc_cups'][0]);?>)
W:<?php echo esc_html($cast_fields['_krc_waist'][0]);?>
H:<?php echo esc_html($cast_fields['_krc_hips'][0]);?>
</div>
<div class="cast-meta-left">
新人区分
</div>
<div class="cast-meta-right">
<div class="cast-new">
<?php echo esc_html($cast_new_terms[0]->name);?>
</div>
</div>
</div>
<h2 class="sub-section">店長コメント</h2>
<div class="cast-pr"><pre><?php echo $cast_fields['krc_pr'][0];?></pre></div>
<?php if ( !empty($cast_fields['tw_id'][0]) ):?>
<h2 class="sub-section">Twitter</h2>
<div class="cast-tw">
<a class="twitter-timeline" data-width="300" data-height="400" data-chrome="noheader nofooter"
href="https://twitter.com/<?php echo esc_html($cast_fields['tw_id'][0]);?>?ref_src=twsrc%5Etfw">Tweets by <?php echo esc_html($cast_fields['tw_id'][0]);?>
</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
<?php endif;?>
</div>
<div class="cast-schedule">
<h2 class="sub-section">スケジュール</h2>
<?php singlecalendar(get_the_ID());?>
<div class="wp-block-button is-style-fill">
<a href="/schedule" class="wp-block-button__link has-white-color has-text-color has-background">出勤情報はこちら</a>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(function ($) {
$('#thumbnail').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
itemWidth: 200,
itemMargin: 5,
asNavFor: '#slider'
});
$('#slider').flexslider({
animation: "slide",
controlNav: false,
animationLoop: false,
slideshow: false,
sync: "#thumbnail"
});
});
</script>single-cast.php から content-cast.php が呼び出されています。
スケジュールページ
content-castschedule.php
<?php ?> <?php $cast_fields = get_post_custom(); //カスタムフィールドを全部取得 $cast_screens = json_decode($cast_fields['_cast_screens'][0]); //画像配列を用意 $cast_type_terms = get_the_terms($post->ID, 'krc_type'); //タイプタクソノミーを取得 $cast_grade_terms = get_the_terms($post->ID, 'krc_grade'); //グレードタクソノミーを取得 $cast_new_terms = get_the_terms($post->ID, 'krc_new'); //新人区分タクソノミーを取得 ?> <div class="one-cast"> <?php if( empty($cast_screens) ): ?> <a href="<?php echo get_template_directory_uri();?>/img/noimg.jpg" alt="<?php the_title();?>" class="iframe"> <?php else: ?> <a href="/cast/<?php echo esc_html($cast_fields['_krc_name'][0]);?>"> <figure> <img src="<?php echo $cast_screens[0];?>" alt="<?php the_title();?>"> </figure> <figcaption> <span class="cast-name"><?php echo esc_html($cast_fields['_krc_name'][0]);?>(<?php echo esc_html($cast_fields['_krc_age'][0]);?>歳)</span> <span class="cast-size">T:<?php echo esc_html($cast_fields['_krc_tall'][0]);?> B:<?php echo esc_html($cast_fields['_krc_bust'][0]);?>(<?php echo esc_html($cast_fields['_krc_cups'][0]);?>) W:<?php echo esc_html($cast_fields['_krc_waist'][0]);?> H:<?php echo esc_html($cast_fields['_krc_hips'][0]);?></span> </figcaption> </a> <?php if ( $fncName != 'outNewType'): ?> <?php if ( !empty($cast_new_terms[0]->name) ):?> <span class="new_cast badge"></span> <?php endif;?> <?php endif;?> <span class="worktime badge"><?php echo $work['starttime']; ?> ～ <?php echo $work['endtime']; ?></span> <?php if ( !empty($cast_fields['tw_id'][0]) ):?> <a class="tw" href="https://twitter.com/<?php echo esc_html($cast_fields['tw_id'][0]);?>" ></a> <?php endif;?> <?php endif;?> </div>
スケジュールは functions.php の関数から呼び出し、記事ページに埋め込みます。
ランキングページ
管理メニューのランキング管理で作成したランキングを表示するページ。
archive-ranking.php
<?php get_header(); ?>
<!-- ヘッダとパンくず無理やり変更 -->
<div class="section page-header">
<div class="container">
<div class="row">
<div class="col-md-12">
<h1 class="page-header_pageTitle">ランキング</h1>
</div>
</div>
</div>
<script>
document.title= document.title.replace('ランキング管理','ランキング');
</script>
</div>
<div class="section breadSection">
<div class="container">
<div class="row">
<ol class="breadcrumb" itemtype="http://schema.org/BreadcrumbList">
<li id="panHome" itemprop="itemListElement" itemscope="" itemtype="http://schema.org/ListItem">
<a itemprop="item" href="https://sample.oilnoko.com/"><span itemprop="name"><i class="fa fa-home"></i> HOME</span></a>
</li>
<li>
<span>ランキング一覧</span></li>
</ol>
</div>
</div>
</div>
<?php
// Dealing with old files.
// Actually, it's ok to only use get_template_part().
/*
Page Header
/*-------------------------------------------*/
$old_file_name[] = 'module_pageTit.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/page-header' );
}
/*
BreadCrumb
/*-------------------------------------------*/
do_action( 'lightning_breadcrumb_before' );
$old_file_name[] = 'module_panList.php';
if ( locate_template( $old_file_name, false, false ) ) {
locate_template( $old_file_name, true, false );
} else {
//get_template_part( 'template-parts/breadcrumb' );
}
do_action( 'lightning_breadcrumb_after' );
?>
<div class="<?php lightning_the_class_name( 'siteContent' ); ?>">
<?php do_action( 'lightning_siteContent_prepend' ); ?>
<div class="container">
<?php do_action( 'lightning_siteContent_container_prepend' ); ?>
<div class="row">
<div class="<?php lightning_the_class_name( 'mainSection' ); ?>" id="main" role="main">
<?php do_action( 'lightning_mainSection_prepend' ); ?>
<?php
/*
Archive title
/*-------------------------------------------*/
$archiveTitle_html = '';
$page_for_posts = lightning_get_page_for_posts();
// Use post top page（ Archive title wrap to div ）.
if ( $page_for_posts['post_top_use'] || get_post_type() !== 'post' ) {
if ( is_year() || is_month() || is_day() || is_tag() || is_author() || is_tax() || is_category() ) {
$archiveTitle = get_the_archive_title();
$archiveTitle_html = '<header class="archive-header"><h1>' . $archiveTitle . '</h1></header>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveTitle', $archiveTitle_html ) );
/*
Archive description
/*-------------------------------------------*/
$archiveDescription_html = '';
if ( is_category() || is_tax() || is_tag() ) {
$archiveDescription = term_description();
$page_number = get_query_var( 'paged', 0 );
if ( ! empty( $archiveDescription ) && $page_number == 0 ) {
$archiveDescription_html = '<div class="archive-meta">' . $archiveDescription . '</div>';
}
}
echo wp_kses_post( apply_filters( 'lightning_mainSection_archiveDescription', $archiveDescription_html ) );
$postType = lightning_get_post_type();
do_action( 'lightning_loop_before' );
?>
<div class="<?php lightning_the_class_name( 'postList' ); ?>">
<?php if ( have_posts() ) : ?>
<!-- ランキング一覧 -->
<div class="cast-wrapper">
<?php while (have_posts()):the_post();?>
<div class="rank-box bpink">
<?php get_template_part('content',('rankinglist'));?>
</div>
<?php endwhile;?>
</div>
</div>
<?php
the_posts_pagination(
array(
'mid_size' => 1,
'prev_text' => '«',
'next_text' => '»',
'type' => 'list',
'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'lightning' ) . ' </span>',
)
);
?>
<?php else : // hove_posts() ?>
<div class="well"><p><?php echo wp_kses_post( apply_filters( 'lightning_no_posts_text', __( 'No posts.', 'lightning' ) ) ); ?></p></div>
<?php endif; // have_post() ?>
</div><!-- [ /.postList ] -->
<?php do_action( 'lightning_loop_after' ); ?>
<?php do_action( 'lightning_mainSection_append' ); ?>
</div><!-- [ /.mainSection ] -->
<?php if ( lightning_is_subsection_display() ){ ?>
<div class="<?php lightning_the_class_name( 'sideSection' ); ?>">
<?php get_sidebar( get_post_type() ); ?>
</div><!-- [ /.subSection ] -->
<?php } ?>
<?php do_action( 'lightning_additional_section' ); ?>
</div><!-- [ /.row ] -->
<?php do_action( 'lightning_siteContent_container_apepend' ); ?>
</div><!-- [ /.container ] -->
<?php do_action( 'lightning_siteContent_apepend' ); ?>
</div><!-- [ /.siteContent ] -->
<?php get_footer(); ?>
content-rankinglist.php
<?php
$ranking_fields = get_post_custom(); //カスタムフィールドを取得
$ranking_cast_ids = json_decode($ranking_fields['_cast_rankings'][0]);
$cast_type_terms = get_the_terms($post->ID, 'krc_type'); //タイプタクソノミーを取得
$cast_grade_terms = get_the_terms($post->ID, 'krc_grade'); //グレードタクソノミーを取得
?>
<h2 class="sub-section"><?php the_title(); ?></h2>
<?php
$rank = 1;
foreach ($ranking_cast_ids as $cast_id) {
$cast = get_post_custom($cast_id, '_krc_age', '_krc_tall' , '_krc_bust' , '_krc_cups', '_krc_waist', '_krc_hips', true );
$cast_new_terms = get_the_terms($cast_id, 'krc_new');
?>
<div class="one-cast">
<a href="/cast/<?php echo esc_html($cast['_krc_name'][0]);?>">
<figure>
<img src="<?php $img_url = json_decode(get_post_meta($cast_id , '_cast_screens' ,true)); echo esc_url($img_url[0]); ?>" class="trimming" alt="<?php echo $cast ['_krc_name'][0];?> loading="lazy" " /></a>
</figure>
<figcaption>
<span class="cast-name"><?php echo esc_html($cast['_krc_name'][0]);?>(<?php echo esc_html($cast['_krc_age'][0]);?>歳)</span>
<span class="cast-size">T:<?php echo esc_html($cast['_krc_tall'][0]);?> B:<?php echo esc_html($cast['_krc_bust'][0]);?>(<?php echo esc_html($cast['_krc_cups'][0]);?>) W:<?php echo esc_html($cast['_krc_waist'][0]);?> H:<?php echo esc_html($cast['_krc_hips'][0]);?></span>
</figcaption>
</a>
<?php if ( $rank < 10): ?>
<span class="rank">
<img src="<?php echo get_stylesheet_directory_uri();?>/images/rank<?php echo $rank; ?>.png" alt="No.<?php echo $rank; ?>"/>
</span>
<?php endif;?>
<?php if ( $fncName != 'todaysCastHtml'): ?>
<?php if (today_schedule($cast_id)):?>
<span class="todays_cast badge">本日出勤</span>
<?php endif;?>
<?php endif;?>
<?php if ( $fncName != 'outNewType'): ?>
<?php if ( !empty($cast_new_terms[0]->name) ):?>
<span class="new_cast badge"></span>
<?php endif;?>
<?php endif;?>
<?php if ( !empty($cast['tw_id'][0]) ):?>
<a class="tw" href="https://twitter.com/<?php echo esc_html($cast['tw_id'][0]);?>" ></a>
<?php endif;?>
</div>
<?php
$rank++;
}
?>
</div>archive-ranking.php から content-rankinglist.php が呼び出されます。
CSS
style.css
@charset "utf-8";
/*
Theme Name: Lightning Child Sample
Theme URI: ★ テーマの公式サイトなどのURL（空欄でも可） ★
Template: lightning
Description: ★ テーマの説明（空欄でも可） ★
Author: ★ テーマ作成者の名前（空欄でも可） ★
Tags:
Version: 0.1.2
*/
/**
* 共通
*/
h2.sub-section {
padding-bottom: 8px;
position: relative;
border: 0px;
text-align: center;
}
h2.sub-section:first-child {
margin-bottom: 50px;
}
h2.sub-section::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 5px;
border: 0px;
background: linear-gradient(to right, transparent 0%, #cf2e2e 50%, #cf2e2e 50%,transparent 100%);
}
.page-header {
background-color: #f1d2d0;
background: linear-gradient(25deg, transparent 0%, #cf2e2e 50%, #cf2e2e 50%, transparent 100%);
}
.wp-block-group.is-style-vk-group-shadow.home-block {
margin: 20px 0px;
}
.wp-block-button__link.has-white-color.has-text-color.has-background {
background-color:#d03232;
width:100%;
margin-bottom: 20px;
}
.mobile-linebox {
border: 3px solid #efefef;
padding: 10px;
background-color: #f9f9f9;
box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
}
.mobile-linebox > div {
margin: 15px 0px;
}
/**
* キャストスケジュール
*/
.krc_calendar {
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
font-size: 13px;
margin: 24px 0;
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.22);
}
.krc_calendar dl {
margin: 0px;
border: 0px;
border-right: 1px solid #ccc;
width: 20%;
float: left;
display: block;
}
.krc_calendar dl dt {
border: 0px;
border-bottom: 1px solid #ccc;
text-align: center;
padding: 2px;
background-color: #f9e7e7;
font-weight: normal;
}
.krc_calendar dl dd {
border: 0px;
text-align: center;
text-decoration: none;
padding: 24px 2px;
display: block;
color: #ff9900;
font-weight: bold;
}
/**
* 出勤情報
*/
.week_calendar ul {
list-style:none;
overflow: hidden;
margin: 5px 0px;
padding: 0px;
width: 100%;
}
.week_calendar ul li {
position: relative;
float: left;
width: 14%;
}
.week_calendar ul li a {
display: block;
padding: 17px 5%;
width: 99%;
color: #fff;
background-color: #ff0000;
text-align: center;
text-decoration: none;
}
.week_calendar ul li.target a {
background-color: #ff8080;
}
.week_calendar ul li a:hover {
background-color: #ffaaaa;
}
/**
* キャスト一覧
*/
.rank-box.bpink {
border: 1px solid #efefef;
background-color: #fcf4f4;
border-radius: 5px;
padding: 15px 0px;
margin-bottom: 20px;
}
.one-cast {
display: inline-block;
position: relative;
max-width: 235px;
height: 380px;
margin: 0 12px 4px;
padding: 0;
text-align: center;
line-height: 1.3em;
overflow: hidden;
letter-spacing: normal;
border-radius: 3px;
box-shadow: 15px 15px 15px rgba(0, 0, 0, 0.22);
}
.rank-box > .one-cast {
margin :0 18px 4px
}
.one-cast a.iframe {
z-index: 8;
position: relative;
display: block;
width: 100%;
height: 100%;
padding: 0;
color: #111;
}
.one-cast figure {
position: relative;
margin: 0 auto 0;
padding: 0;
overflow: hidden;
position: relative;
text-align: center;
width: 100%;
height: 300px;
overflow: hidden;
}
.one-cast figure img {
width: 235px;
height: v;
}
.one-cast figcaption {
position: relative;
width: 100%;
height: 68px;
margin: 0;
padding: 5px 0 0;
text-align: center;
font-size: 14px;
line-height: 1.2em;
}
/**
* キャスト個人ページ
*/
.cast {
overflow: hidden;
border: 0px solid gray;
box-shadow: 0 2px 15px rgba(0, 0, 0, 0.22);
padding: 20px;
}
.cast-photo {
padding: 10px;
width: 50%;
min-width: 300px;
float: left;
}
.cast-profile {
padding: 10px;
width: 50%;
min-width: 300px;
float: left;
}
.cast-schedule {
width: 100%
}
.cast-meta {
overflow:hidden;
text-align: center;
}
.cast-meta-left {
width:49%;
float:left;
text-align: right;
background-color: #f9e7e7;
margin: 1px;
padding:10px;
}
.cast-meta-right {
width:49%;
float:left;
text-align: left;
margin: 1px;
padding:10px;
}
.cast-pr {
font-size: 18px;
overflow: hidden;
line-height: 1.8;
padding: 15px 10px;;
}
.cast-pr pre {
white-space: pre-wrap;
}
#slider,
#thumbnail {
border: 5px solid #e58f8f;
}
#slider {
margin-bottom: -10px;
max-height: 600px;
overflow:hidden;
}
#slider ul {
overflow:hidden;
}
#thumbnail {
max-height:170px;
overflow:hidden;
}
#thumbnail .slides li {
width: auto !important;
}
#thumbnail .slides img {
width: auto;
max-height: 170px;
-moz-user-select: none;
}
#thumbnail img {
opacity: 0.5;
}
#thumbnail .flex-active-slide img {
opacity: 1;
cursor: default;
}
/**
* ツイッターアイコン
*/
.one-cast .tw {
right: 0px;
top: 260px;
width: 50px;
height: 50px;
position: absolute;
display: block;
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
z-index: 26;
background-image: url(images/twitter_icon.png);
}
.one-cast .tw:hover {
opacity: 0.8;
}
/**
* 当日出勤バッジ
*/
.one-cast .todays_cast {
right: 0px;
top: 0px;
border-radius: 3px;
background-color: #ed561b;
color: #fff;
font-size: 14px;
opacity: 0.9;
font-weight: normal;
padding: 5px;
}
.one-cast .todays_cast {
position: absolute;
display: block;
z-index: 26;
}
/**
* 出勤時間バッジ
*/
.one-cast .worktime {
text-align: left;
left: 0px;
top: 275px;
width:100%;
background-color: #ed561b;
color: #fff;
font-size: 18px;
opacity: 0.8;
font-weight: normal;
padding: 5px 5px 5px 20px;
border-radius: 0px;
}
.one-cast .worktime {
position: absolute;
display: block;
z-index: 26;
}
/**
* 新人バッジ
*/
.one-cast .new_cast {
left: 0px;
top: 0px;
width: 50px;
height: 50px;
position: absolute;
display: block;
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
z-index: 26;
background-image: url(images/new_icon.png);
opacity: 0.9;
}
/**
* 新人バッジ
*/
.one-cast .rank {
left: 0px;
top: 300px;
width: 70px;
height: 50px;
position: absolute;
display: block;
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
z-index: 26;
opacity: 0.9;
}
/**
* キャスト情報
*/
.one-cast a {
text-decoration: none;
}
.one-cast figcaption span.cast-name {
display: block;
font-size: 130%;
color: #ff8080;
padding: 10px 0px;
}
.one-cast figcaption span.cast-size {
display: block;
color: #000;
}
.one-cast figcaption span.cast-time {
display: block;
color: #e1053b;
}
/**
* 電話ボタン
*/
.vk_button_link.btn
{
position: fixed;
bottom: 10px;
right: 10px;
padding: 6px 0px;
opacity: 0.8;
z-index: 100;
}
.vk_button_link_before {
margin-right: 0.0rem;
}
.vk_button_link {
min-width: 50px;
min-height: 50px;
border-radius: 25px;
background-color:#7bdcb5;
border:1px solid #7bdcb5;
color:#fff;
}
/**
* スマホ対応
*/
@media screen and (max-width:480px) {
/* 画面サイズが480pxからはここを読み込む */
#thumbnail {
display: none;
}
.home-block,
.box-body {
text-align: center;
font-weight: normal;
}
.krc_calendar dl {
min-height: 135px;
}
.wp-block-group.is-style-vk-group-shadow.home-block {
padding: 5px 0px;
}
.cast {
margin: 10px 15px;
}
.one-cast {
max-width: 145px;
height: 245px;
margin: 0px 5px 4px;
}
.one-cast figure {
height: 135px;
}
.one-cast figure img {
}
.one-cast figcaption span.cast-name {
display: block;
font-size: 110%;
color: #ff8080;
padding: 10px 0px;
}
/**
* ツイッターアイコン
*/
.one-cast .tw {
top: 105px;
width: 35px;
height: 35px;
}
/**
* 当日出勤バッジ
*/
.one-cast .todays_cast {
font-size: 10px;
opacity: 0.7;
}
/**
* 出勤時間バッジ
*/
.one-cast .worktime {
top: 0px;
top: 125px;
font-size: 10px;
text-align: left;
padding: 5px 5px;
}
/**
* 新人バッジ
*/
.one-cast .new_cast {
width: 35px;
height: 35px;
}
}
その他
スケジュールの時間単位変更
デフォルトだと10時から27時（LAST）までの1時間単位ですが、30分単位にしてほしいということで少しプラグインを弄りました。
プラグインフォルダの js にある「krc-cast-schedule.js」で変更ができます。
krc-cast-schedule.js
$jq = jQuery.noConflict();
$jq(document).ready(function () {
var hiduke = new Date(),
year = hiduke.getFullYear(),
month = hiduke.getMonth() + 1,
day = hiduke.getDate(),
today = year + '/' + month + '/' + day;
var time_popup = '<dd class="time_input"><div class="time_popup"><dl><dt><label for="遅早表記">遅早表記</label></dt><dd><select name="fastslow" class="fastslow"><option value="0">指定無</option><option value="早番">早番</option><option value="中番">中番</option><option value="遅番">遅番</option></select></dd></dl><dl><dt><label for="時間表記">時間表記</label></dt><dd><select name="starttime" class="starttime"><option value="0">指定無</option>';
time_popup += '<option value="OPEN">OPEN</option>';
for (var i = 10; i <= 26; i++) {
time_popup += '<option value="' + ("00" + i).slice(-2) + ':00">' + ("00" + i).slice(-2) + ':00</option>';
time_popup += '<option value="' + ("00" + i).slice(-2) + ':30">' + ("00" + i).slice(-2) + ':30</option>';
}
time_popup += '</select><br>から</dd><dd><select name="endtime" class="endtime"><option value="0">指定無</option>';
for (var i = 10; i <= 26; i++) {
time_popup += '<option value="' + ("00" + i).slice(-2) + ':00">' + ("00" + i).slice(-2) + ':00</option>';
time_popup += '<option value="' + ("00" + i).slice(-2) + ':30">' + ("00" + i).slice(-2) + ':30</option>';
}
time_popup += '<option value="LAST">LAST</option>';
time_popup += '</select></dd></dl></div></dd>';
$jq("#datepicker").datepicker({
'altField': '#schedule_target_day',
'dateFormat': 'yy/mm/dd',
'closeText': true,
'onSelect': function (chosen, inst) {
//PHPに初期データ取りに行く
$jq.post( ajaxurl, { action: 'krc_schedule_target_day', 'order': chosen }, function(data, status) {
var cast_arr = $jq.parseJSON(data),
post_in_sort = [];
$jq('#schedule_cast_out').empty();
$jq('#schedule_cast_in').empty();
$jq('#krc_schedule_rest').remove();
if (cast_arr['rest'] == 'rest') {
//console.log($jq('#schedule_cast_in:before'));
$jq('#schedule_cast_in').before('<div id="krc_schedule_rest">■定休日に設定しています</div>');
} else {
$jq.each(cast_arr['post_in'], function (i, val) {
post_in_sort[val['s_order']] = i;
});
$jq.each(post_in_sort, function (i, val) {
$jq('#schedule_cast_in').append('<dl class="schedule_cast ui-sortable-handle" id="item_' + val + '"><dt>' + cast_arr['post_in'][val]['krc_name'] + '</dt><dd><img src="' + cast_arr['post_in'][val]['cast_screens'] + '" width="100" class="cast_photo" /></dd>' + time_popup + '</dl>');
$jq('#item_' + val).find(".fastslow").val(cast_arr['post_in'][val]['fastslow']);
$jq('#item_' + val).find(".starttime").val(cast_arr['post_in'][val]['starttime']);
$jq('#item_' + val).find(".endtime").val(cast_arr['post_in'][val]['endtime']);
});
/*
$jq.each(cast_arr['post_in'], function (i, val) {
$jq('#schedule_cast_in').append('<dl class="schedule_cast ui-sortable-handle" id="item_' + i + '"><dt>' + val['krc_name'] + '</dt><dd><img src="' + val['cast_screens'] + '" width="100" class="cast_photo" /></dd>' + time_popup + '</dl>');
$jq('#item_' + i).find(".fastslow").val(cast_arr['post_in'][i]['fastslow']);
$jq('#item_' + i).find(".starttime").val(cast_arr['post_in'][i]['starttime']);
$jq('#item_' + i).find(".endtime").val(cast_arr['post_in'][i]['endtime']);
});
*/
}
$jq.each(cast_arr['post_not_in'], function (i, val) {
$jq('#schedule_cast_out').append('<dl class="schedule_cast ui-sortable-handle" id="item_' + i + '"><dt>' + val['krc_name'] + '</dt><dd><img src="' + val['cast_screens'] + '" width="100" class="cast_photo" /></dd></dl>');
});
//console.log(data);
});
},
});
$jq("#schedule_cast_out").sortable({
'connectWith': '#schedule_cast_in',
});
$jq("#schedule_cast_in").sortable({
'connectWith': '#schedule_cast_out',
});
$jq("#schedule_cast_out, #schedule_cast_in").sortable({
'tolerance': 'pointer',
'cursor':'move',
'stop': function (evt, ui) {
if (ui.item.parent().attr("id") == 'schedule_cast_in' ) {
if (ui.item.find(".time_input").length == 0) {
ui.item.append(time_popup);
}
} else {
ui.item.find(".time_input").remove();
}
}
});
$jq("#save-schedule").bind( "click", function() {
$jq("html, body").animate({ scrollTop: 0 }, "fast");
//出勤時間データとか何とかしなきゃ
//この配列回してカスタムしたデータをpostしてポップアップの内容も合わせて送る?
var post_arr = {};
$jq.each($jq("#schedule_cast_in").sortable("toArray"), function(i, val) {
id = val.replace(/item_/g,'');
//console.log(i);
post_arr[id] = {
'fastslow': $jq('#' + val + ' .fastslow').val(),
'starttime': $jq('#' + val + ' .starttime').val(),
'endtime': $jq('#' + val + ' .endtime').val(),
's_order': i
};
});
$jq('#krc_schedule_rest').remove();
$jq.post( ajaxurl, { action:'krc_schedule_update', order: post_arr, day: $jq("#schedule_target_day").val() }, function(data, status) {
$jq("#ajax-response").html('<div class="message updated fade"><p>スケジュールを変更致しました。</p></div>');
$jq("#ajax-response div").delay(3000).hide("slow");
});
});
$jq("#rest-schedule").bind( "click", function() {
$jq("html, body").animate({ scrollTop: 0 }, "fast");
$jq.post( ajaxurl, { action:'krc_schedule_update', order: 'rest', day: $jq("#schedule_target_day").val()}, function(data, status) {
$jq("#ajax-response").html('<div class="message updated fade"><p>定休日に設定致しました。</p></div>');
$jq("#ajax-response div").delay(3000).hide("slow");
console.log(data);
});
});
});
/*! jQuery UI - v1.8.20 - 2012-04-30
* https://github.com/jquery/jquery-ui
* Includes: jquery.ui.datepicker-ja.js
* Copyright (c) 2012 AUTHORS.txt; Licensed MIT, GPL */
$jq(function(a){a.datepicker.regional.ja={closeText:"閉じる",prevText:"<前",nextText:"次>",currentText:"今日",monthNames:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],monthNamesShort:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],dayNames:["日曜日","月曜日","火曜日","水曜日","木曜日","金曜日","土曜日"],dayNamesShort:["日","月","火","水","木","金","土"],dayNamesMin:["日","月","火","水","木","金","土"],weekHeader:"週",dateFormat:"yy/mm/dd",firstDay:0,isRTL:!1,showMonthAfterYear:!0,yearSuffix:"年"},a.datepicker.setDefaults(a.datepicker.regional.ja)});
Twitter 連携、コメントの追加
キャスト一覧の写真に個人の Twitter を連携、個人の詳細ページにコメントを挿入するのにキャスト管理ページでカスタムフィールドを利用しています。
キャスト詳細の画像表示
画像表示に 「jquery.flexslider （スライダー）」と、Wordpressプラグインの 「Easy FancyBox」（拡大表示）を利用しています。
まとめ
今まであまり wordpress プラグインの中身に触れる機会がありませんでしたが、おかげで色々と勉強になりました。
キャスト管理が必要なHP制作（Wordpress）、サクッと出来るものであれば安価で承りますよ。笑
メモ単純にサイトにプラグインを導入し各種ページを表示できるようにするのはもちろん、次のようなカスタマイズも可能です。
・キャスト管理で新しい項目を登録できるようにしてキャスト一覧やプロフィールページに表示
・スケジュールで新しい項目を登録できるようにしてスケジュールページに表示
・スケジュールページで日付クリックをした際にリロードせずに切り替えるようにする
・メール投稿による他サイト連携（ブログ機能）
・サイドバーにキャストスライダーの組み込みキャスト管理関係なく、デザインの対応も可能です。
・キャスト管理で新しい項目を登録できるようにしてキャスト一覧やプロフィールページに表示
・スケジュールで新しい項目を登録できるようにしてスケジュールページに表示
・スケジュールページで日付クリックをした際にリロードせずに切り替えるようにする
・メール投稿による他サイト連携（ブログ機能）
・サイドバーにキャストスライダーの組み込みキャスト管理関係なく、デザインの対応も可能です。
ちなみに記事を公開してから５サイトご依頼いただきました。ありがとうございます。
気になった方はチェックしてみてください。
ではでは。