投稿者: doggstar
welcartまとめ追加2
てかリターンを覚えた
アーカイブで
頭に
<?php //--------------------------------商品アーカイブなら if( in_category( 'item' ) || //親カテゴリスラッグで分岐 ファンクションコード使用 post_is_in_descendant_category( get_term_by( 'slug', 'item', 'category' ))): ?> <?php include(get_stylesheet_directory() . "/d_parts/welcart/welcart-archive.php"); ?> <? return; endif;?>
というのを入れてリターンすると
アーカイブのときこのテンプレートを読むだけでになる
ただし、ブログTOPにも商品カテゴリをアウトしてやらなければならないので
ファンクションに商品カテIDを追加
ファンクに書いたが
//<?php query_posts('post_type=post&cat='.$info_cat_out.','.$welcart_cat_out .'&paged='.$paged); ブログトップ //<?php query_posts('post_type=post&posts_per_page=12&cat='.$info_cat_out.','.$welcart_cat_out .'&paged='.$paged); //記事すべて読む
と入れ替えてやる
また売り切れの分岐
カートに入れるコード
<?php if(!usces_have_zaiko() ) : ?> 売り切れ <?php else:?> <?php usces_the_itemSkuButton(__('Add to Shopping Cart', 'usces'), 0); ?> <?php endif;?>
welcartまとめ追加
ポストタイプはシングルを使っている
カテゴリはitemが作成され(カテゴリーに)
その子カテゴリでカテゴリー分けする
ブログと混合するので
シングルは シングル内で分岐する
<?php if ( usces_is_item() ) : //----------------------------商品だったら ?>
アーカイブはpost_is_in_descendant_category
をファンクションで定義して分岐する、(商品カテゴリーは親カテゴリーアイテムを自動チェックできないため)
http://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/in_category
<?php //--------------------------------商品アーカイブなら if( in_category( 'item' ) || //親カテゴリスラッグで分岐 ファンクションコード使用 post_is_in_descendant_category( get_term_by( 'slug', 'item', 'category' ))): ?>
管理画面 商品マスターで商品を管理するが
カスタムフィールドを追加したい場合
ブログ投稿にも、カスタムフィールドが表示される
それを回避するために、ブログ投稿画面で表示で表示させ
カスタムフィールドをcssでい表示にさせ、商品ページのみひょうじさせる。
例はシンプルカスタムフィールド
カスタムフィールドスイートはコピーすると変になるらしい
アドバンスはどうか?
#smart-cf-custom-field-1289, #smart-cf-custom-field-1270 { display: none; } .welcart-shop_page_usces_itemedit #smart-cf-custom-field-1289, .welcart-shop_page_usces_itemedit #smart-cf-custom-field-1270 {display:inherit;}
商品画像を取得するコードが2種類しかないので
フルサイズか 近いサイズ だろう なのでそのサイズの画像を用意しておかないと
フルサイズを取得しないといけないので重くなる
<?php usces_the_itemImage( 0, 100, 100 ); ?>
<a href="<?php usces_the_itemImageURL(0); ?>"><?php usces_the_itemImage(); ?></a>
https://www.welcart.com/documents/archives/673
<?php usces_the_itemImage($id, 784, 588, $post); ?>
こうしたがドルポストの意味はよくわからない
画像にクラスを付けられないので
その前のクラスなどで .class img などしないといけない
カスタムできる参考あり
https://wpcoding.net/welcart_usces_the_itemimage_alt/
https://www.welcart.com/community/forums/topic/%E3%82%B5%E3%83%96%E7%94%BB%E5%83%8F%E3%81%AE%E4%BB%A3%E6%9B%BF%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6
https://www.welcart.com/community/forums/topic/%E5%95%86%E5%93%81%E3%82%A4%E3%83%A1%E3%83%BC%E3%82%B8%E3%83%87%E3%83%BC%E3%82%BF%E3%81%ABname%E3%81%AE%E3%83%91%E3%83%A9%E3%83%A1%E3%83%BC%E3%82%BF%E3%82%92%E8%BF%BD%E5%8A%A0%E3%81%97%E3%81%9F%E3%81
コレをファンクションに追加
//商品画像のaltをタイトルにする add_filter('usces_filter_img_alt' , 'my_img_alt_func' , 10 ,2); function my_img_alt_func(){ global $usces; $item_title = usces_the_itemName('return'); $alt = 'alt="'.$item_title.'"'; return $alt; }
wordpress 引越し 別サイトへ 記事移行
http://www.weblog-life.net/entry/2016/03/03/060000
エクスポートはWP CSV Exporterを使う
文字化けしますのでテキストエディタで開きます。
CSVファイルには画像のURLがエクスポートしたドメインになっているためここで置き換えます。
検索文字列:http://旧ドメイン/
置換文字列:http://新ドメイン/
インポートはReally Simple CSV Importerで挿入
flex box のベンダープリフィックス
http://blues25.com/wp/2016/01/31/flexbox_browser/
デフォルト | Safari用 | IE10用 | Android 標準ブラウザ用 |
---|---|---|---|
display: flex | display: -webkit-flex | display: -ms-flexbox | display: -webkit-box |
flex-direction: row | -webkit-flex-direction: row | -ms-flex-direction: row | -webkit-box-orient: horizontal-webkit-box-direction: normal |
flex-direction: column | -webkit-flex-direction: column | -ms-flex-direction: column | -webkit-box-orient: vertical-webkit-box-direction: normal |
justify-content: center | -webkit-justify-content: center | -ms-flex-pack: center | -webkit-box-pack: center |
justify-content: flex-start | -webkit-justify-content: flex-start | -ms-flex-pack: start | -webkit-box-pack: start |
justify-content: space-around | -webkit-justify-content: space-around | -ms-flex-pack: justify | -webkit-box-pack: justify |
justify-content: space-between | -webkit-justify-content: space-between | -ms-flex-pack: justify | -webkit-box-pack: justify |
align-items: center | -webkit-align-items: center | -ms-flex-align: center | -webkit-box-align: center |
arrayアレイ 中身 確認 アドバンスカスタムフィールドでユーザーを選んだ時の中身
<?php $user = get_field('staff_user_id'); print_r($user);//中身を確認 ?> そうすると これが入ってました。 Array ( [ID] => [user_firstname] => [user_lastname] => [nickname] => [user_nicename] => [display_name] => [user_email] => [user_url] => [user_registered] => [user_description] => [user_avatar] => ) echo $user['ID']; で出力出来るかと思います。
複数のssh をmac管理ターミナルハイプラン時
id_rsa.pub を削除
/Users/doggstar/.ssh にid_rsa を入れる(入れ替える) 情報を見る 拡張子削除 パーミッション 自分以外禁止
KEN設計 予約フォーム
まず今あるフォームを使う
ポイントは
シングルに書いてあるスクリプト
<script type="text/javascript"> $(document).ready(function() { $(".monthly-calendar a").each(function() { //.eachは合致 var dreplace = null;//初期化 var dreplace = $(this).attr('href').replace(/s%e6%a7%98%e9%82%b8%e7%8f%be%e5%a0%b4%e8%a6%8b%e5%ad%a6%e4%bc%9a/g,'予約カレンダー'); var dreplace = $(this).attr('href').replace(/%e5%90%8d%e5%8f%a4%e5%b1%8b%e5%b8%82%e5%8d%83%e7%a8%ae%e5%8c%bay%e6%a7%98%e9%82%b8-%e5%ae%8c%e6%88%90%e8%a6%8b%e5%ad%a6%e4%bc%9a/g,'予約カレンダー'); $(this).attr('href',dreplace); }); }); </script>
/~/のパーマーリングをコピって
gを+している それを /予約カレンダー/変え へ飛ばしている
var dreplace = $(this).attr('href').replace(/リンク/g,'予約カレンダー');
これでそのページで切り替わらないのでページ最下段に設置しても大丈夫
固定ページにそのぺーじがある
サンクスページ?も
日曜の午後を✗にするには
予約カレンダーから日にちを選び
時間帯を1と入力する
ファルコンでユーザープロフィール 入れた時の手順
春日井ナビみてコード
カスタム
<!-- 投稿者プロフィール --> <div class="blog_prof"> <div class="blog_prof_sam"> <?php echo get_avatar(get_the_author_id(), 100); ?> </div> <div class="blog_prof_disp"> <div class="blog_nickname"> <!----ブログネーム------> <div style="font-size: 90%;"> 編集者</div> <a href="<?php echo get_author_posts_url( get_the_author_id() ); ?>"> <?php echo get_the_author_meta('nickname'); ?> </a> <br /> <div class="mob_both"> <!-- disp --> <?php the_author_meta('description'); ?> <br> <!-- sns --> <? if(get_the_author_meta('twitter')):?> <a href="<?php the_author_meta('twitter'); ?>" target="_blank">twitter</a> <? endif;?> <? if(get_the_author_meta('facebook')):?> <a href="<?php the_author_meta('facebook'); ?>" target="_blank">facebook</a> <? endif;?> <? if(get_the_author_meta('instagram')):?> <a href="<?php the_author_meta('instagram'); ?>" target="_blank">instagram</a> <? endif;?> <? if(get_the_author_meta('tumblr')):?> <a href="<?php the_author_meta('tumblr'); ?>" target="_blank">tumblr</a> <? endif;?> </div> </div> </div> </div> <!-- //投稿者プロフィール -->
プラグインは
Simple Local Avatars
DLして入れた古いけど
https://ja.wordpress.org/plugins/simple-local-avatars/
sns出すために
アドバンスカスタムフィールドで
ユーザーに新規カスタムフィールドをつけて あればで分岐
ここにhttp://techmemo.biz/wordpress/author-meta-display/
the_author_metaで取得とあったが
出力してしまうので
get_the_author_metaというのを発見しつかった。
上記こーどのまま
オーサーアカイブでも使ったが
<?php the_author_meta('display_name',$author); ?>
こうした方が本当かも?$authorなくてもでたからいいか?
アーカイブのURLがユーザーIDになるので
Edit Author Slug
を入れて変更した。プロフページにて
http://hublog.biz/bwpb/user-settings/
css
//ユーザー .blog_prof{ margin-top: 50px; overflow: hidden ; a{color: #1b95e0} a:hover{color: #1b95e0;} line-height: 2} .blog_prof_sam{float: left; margin-right: 30px; img{.border-radius(50%)}} .mob_both{font-size: 80%; clear: both;} .blog_prof_disp{overflow: hidden; } @media screen and (max-width: 736px) {.blog_prof_disp{overflow: initial; margin-top: 16px;} .mob_both{padding-top: 6px;} }
管理画面 投稿タイプ エディタースタイル
/** ページ投稿タイプのみ違ったエディタースタイルを入れる * Registers an editor stylesheet for the current theme. * * @global WP_Post $post Global post object. */ function wpdocs_theme_add_editor_styles() { global $post; $my_post_type = 'page'; // 新規投稿 (initフック). if ( stristr( $_SERVER['REQUEST_URI'], 'post-new.php' ) !== false && ( isset( $_GET['post_type'] ) === true && $my_post_type == $_GET['post_type'] ) ) { //ここから add_editor_style('../../../css/item.css'); add_editor_style('../../../css/d_master.css'); add_editor_style('../../../css/d_temp1.css'); add_editor_style('../../../css/big_sapce.css'); //ここまで } // 投稿の編集 (pre_get_postsフック). if ( stristr( $_SERVER['REQUEST_URI'], 'post.php' ) !== false && is_object( $post ) && $my_post_type == get_post_type( $post->ID ) ) { //ここから add_editor_style('../../../css/item.css'); add_editor_style('../../../css/d_master.css'); add_editor_style('../../../css/d_temp1.css'); add_editor_style('../../../css/big_sapce.css'); //ここまで } } add_action( 'init', 'wpdocs_theme_add_editor_styles' ); add_action( 'pre_get_posts', 'wpdocs_theme_add_editor_styles' );
インフォメーションのアイコン うまく表示できない 強引な並び替え
<?php // カテゴリー情報を取得 $info_cat = get_the_category(); $info_cat1 = $info_cat[1]; // 0が親11がその子・・ファンクションの並び順をオーダー通りに出力のおかげ $cat_name = $info_cat1->cat_name; $info_cat2 = $info_cat[0]; // $cat_name2 = $info_cat2->cat_name; ?> <?php if ($cat_name == 'インフォメーション' or empty($cat_name)) :?> <?php if ($cat_name2 == 'インフォメーション') :?> <div class="info_cat i_info">INFO</div> <?php else: ?> <div class="info_cat i_info">column</div> <?php endif; ?> <?php //elseif ($cat_name == 'CAMPAING' ) :<div class="info_cat i_campain">CAMPAING</div>?> <?php //elseif ($cat_name == '求人' ) :<div class="info_cat i_kyuujin">求人</div>?> <?php //elseif ($cat_name == 'SALE' ) :<div class="info_cat i_sale">SALE</div> ?> <?php elseif ($cat_name == 'EVENT' ) :?> <div class="info_cat i_event">EVENT</div> <?php elseif ($cat_name == 'MEDIA' ) :?> <div class="info_cat i_media">MEDIA</div> <?php elseif ($cat_name == 'NEWS' ) :?> <div class="info_cat i_news">NEWS</div> <?php endif; ?> <div class="set_title"> <?php if(post_custom('info_url')): ?> <a href="<?php echo post_custom('info_url'); ?>"><?php the_title(); ?></a> <?php else: ?> <?php if($post->post_content=="") : //本文空なら?><?php the_title(); ?> <?php else: //?> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <?php endif; ?> <?php endif; ?> </div> </div>
このうようなコードがあると思う。
get_the_category();
でインフォメーションを0に取得したい場合
カテgリーオーダーで
インフォメーションを一番上に持ってきてやると
それが可能になるようだ。
滅多にないが レスポンシブルで 正方形の中に 縦横比不規則な画像を常に中心揃えで入れたい
http://qiita.com/ryounagaoka/items/a98f59347ed758743b8d
http://www.memo.d-marking.com/blog/2017/05/11/car-%E3%81%A7%E3%80%80%E3%82%AE%E3%83%A3%E3%83%A9%E3%83%AA%E3%83%BC%E3%81%A7%E3%80%80%E8%89%B2%E3%80%85/
http://qiita.com/7968/items/eddfeb4b424d7c2d2d34
co.d-marking の 制作事例 一覧d_jirei.php で使用
cssは
.jirei_box_img2{ border: 1px solid #CCC; position: relative; width: 100%; background-image: url(../img/body_backgr/body_background_dark15.png); background-repeat: repeat; img{ max-width:100%; max-height:100%; position: relative; top: 50%;left: 50%; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); } } .jirei_box{ width: 31%; margin-right: 1%; margin-left: 1%; margin-bottom: 24px; }
中古車販売 まとめ2
結局ブログのYARPPはやめて
車で出したかったので
ステータスをタクソノミーに変更
変更方法は
アドバンスでcar_openに作ったタクソノミーを割り当てる。
返り値はID
IDは順に数値がおおきくなるため、
販売受付中
SOLDOUTと順につくれば
並び順は
ASC となる。
真ん中に新しい項目 交渉中など入れたい場合は
SOLD OUTを一度消して、
作り直す必要が出てくるので
注意
<?php //公開状態 $hoge = get_field('car_open'); if($hoge == '10'): elseif($hoge == '189'): ?>
という表示方法
IDに変えただけ
ファンクションの
メインクエリは
$meta_query = array( 'relation' => 'AND', //meta_queryの配列が1つの時は指定しない 'meta_sort1' => array( 'key' => 'car_open', //キー 'type' => 'NUMERIC', //タイプ 数字 ), 'meta_sort2' => array( 'key' => 'car_cc', //キー 'type' => 'NUMERIC', //値のタイプ 数字 )); $orderby = array( 'meta_sort1' => 'ASC', 'meta_sort2' => 'ASC', // 'date' => 'DESC' ); $query->set('meta_query', $meta_query); $query->set('orderby', $orderby);
結局 ‘meta_sort1’ => ‘ASC’,にへんこうしただけ
yarpp 直書きの場合はタクスとかないとエラーで表示されないからきお
http://blog.k-kansei.com/?p=728
http://www.ex-tra.jp/kosukekato/archives/15420
オプション
yarpp_related(array( // Pool options: these determine the "pool" of entities which are considered 'post_type' => array('post', 'page', ...), 'show_pass_post' => false, // show password-protected posts 'past_only' => false, // show only posts which were published before the reference post 'exclude' => array(), // a list of term_taxonomy_ids. entities with any of these terms will be excluded from consideration. 'recent' => false, // to limit to entries published recently, set to something like '15 day', '20 week', or '12 month'. // Relatedness options: these determine how "relatedness" is computed // Weights are used to construct the "match score" between candidates and the reference post 'weight' => array( 'body' => 1, 'title' => 2, // larger weights mean this criteria will be weighted more heavily 'tax' => array( 'post_tag' => 1, ... // put any taxonomies you want to consider here with their weights ) ), // Specify taxonomies and a number here to require that a certain number be shared: 'require_tax' => array( 'post_tag' => 1 // for example, this requires all results to have at least one 'post_tag' in common. ), // The threshold which must be met by the "match score" 'threshold' => 5, // Display options: 'template' => , // either the name of a file in your active theme or the boolean false to use the builtin template 'limit' => 5, // maximum number of results 'order' => 'score DESC' ), $reference_ID, // second argument: (optional) the post ID. If not included, it will use the current post. true); // third argument: (optional) true to echo the HTML block; false to return it
メーカーが更新後トヨタにもどってしまう(何も選択されない)は
その他のアドバンスカスタムで分岐条件でつかっていたからかもしれない
そこをcarにインサートされないようにしたら治った。
中古車販売 まとめ
まず、soldout は今回カスタムフィールドのセレクトボックスで
20 : 販売受付中
1 : SOLD OUT
でやった。
YARPPを使いたい場合は
売り切れを表示する 一覧で最後に表示する
http://www.memo.d-marking.com/blog/2015/10/31/%E5%A3%B2%E3%82%8A%E5%88%87%E3%82%8C%E3%82%92%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B%E3%80%80%E4%B8%80%E8%A6%A7%E3%81%A7%E6%9C%80%E5%BE%8C%E3%81%AB%E8%A1%A8%E7%A4%BA%E3%81%99%E3%82%8B/
を参考に。
soldoutをタクソノミーで作成し、
yarppで 売り切れを除外できる。
並び替え等のファクションのクエリがみなへんこうとなるので注意
車はソートして見る事が基本でカーセンサーとかも関連時事なかったので
今回はなし。
並び替えの際に、たくすクエリで下記とした。
elseif ( $sortset == 'car_pay_money_low' ) { //総支払い価格安い 実際使わない $meta_query = array( 'relation' => 'AND', //meta_queryの配列が1つの時は指定しない 'meta_sort1' => array( 'key' => 'car_open', //キー 'type' => 'NUMERIC', //値のタイプ 数字 ), 'meta_sort2' => array( 'key' => 'car_pay_money', //キー 'type' => 'NUMERIC', //値のタイプ 数字 'value'=>'1', //ask設定 'compare'=>'>=', //総額1以上を表示 )); $orderby = array( 'meta_sort1' => 'DESC', 'meta_sort2' => 'ASC', // 'date' => 'DESC' ); $query->set('meta_query', $meta_query); $query->set('orderby', $orderby); }
通常の一覧部も
// サーチ ページ数 if ( $query->is_search() && $query->is_main_query() ) { $query->set('posts_per_page', 12 ); $query->set( 'meta_key', 'car_open' ); $query->set( 'orderby', 'meta_value_num' ); $query->set( 'order', 'DESC' ); //数値が低い順 } //アーカイブページ数 if ( $query-> is_tax() && $query->is_main_query() ) { $query->set('posts_per_page', 12 ); $query->set( 'meta_key', 'car_open' ); $query->set( 'orderby',array('meta_value_num' => 'DESC', 'date' => 'DESC') ); }
とした。car_open
ちなみに総額の部分は空欄だとaskでそうすると数値が入ってこないから
ソートで総額の時 最も安いがaskから出るので
上記総額ソートはやめて 車体価格のソートのみに
車体価格を目立たせた
タクソノミーにコメントアウトしてあるから
ファぬションにもうかいてあるので
必要があれば表示すれば並び替わる
タクソノミーは
タクソノミーページで分岐して
まんま 他のタクソノミーを誘導するのをはじめてやった
ギャラリーは
car で ギャラリーで 色々
http://www.memo.d-marking.com/blog/2017/05/11/car-%E3%81%A7%E3%80%80%E3%82%AE%E3%83%A3%E3%83%A9%E3%83%AA%E3%83%BC%E3%81%A7%E3%80%80%E8%89%B2%E3%80%85/
参考
高さをほぼ固定することで決まった。
絞込は
サイドバーでリストカテゴリにて
(タクソノミーを使って カテゴリ1=メーカー カテゴリ2=車両タイプ カテゴリ3=詳細項目として、管理画面から追加並びかえでき、クライアントによっては例えばロードスター専門店の場合 ほぼロードスターなので メーカーを年式 などに カテゴリ2までは自由に変更。詳細項目はシングルにも使ってるので統一 つまり2個のカテゴリは自由に変更
※タクソノミーでやってる場合は 絞り込み検索が自分でできるっぽい。これは後の課題)
http://kotori-blog.com/wordpress/refinement_search/
詳細項目で検索のみ
ドロップダウンで すぐ検索するやつ
<div class="car_serch_title_side" style="margin-top:24px;"> 詳細項目で選ぶ </div> <div style="padding-top:20px;"></div> <ul class="car_side_menu"> <?php $cats = get_categories(array( 'post_type' => 'car', 'taxonomy' => 'car_cat3' , 'hide_empty' => 0 ,//記事がなくとも表示 'depth' => 1,//子は表示しません。 'orderby' => 'order',//順番は指定します )); ?> <?php if(!empty($cats)): ?> <select name="cat" id="cat"> <option value=" "> 詳細項目で選ぶ</option> <?php foreach($cats as $cat): ?> <option value="<?php $cat_term = $cat->slug; echo get_term_link($cat_term ,'car_cat3'); ?>"><?php echo $cat->cat_name; ?>(<?php echo $cat->count; ?>)</option> <?php endforeach; ?> </select> <script type="text/javascript"> var dropdown = document.getElementById("cat"); function onCatChange(){ if(dropdown.options[dropdown.selectedIndex].value != ""){ location.href = dropdown.options[dropdown.selectedIndex].value; } } dropdown.onchange = onCatChange; </script> <?php endif; ?> </ul>
お気に入りプラグは ログインしてると、まだありませんが表示されないっぽい。
Duplicate Post は設定画面からカスタムポストも選べるが
カスタムフィールドスイートを使ってると
ループフィールド=今回はギャラリーのサムネイルに使ってるフォーチせずに1個目の画像 が前のものになるようなので
複製しないカスタムフィールドを指定すること
検索boxは
<div class="car_serch_page_side" style="margin-top:30px;"> <div class="car_serch_title_side"> <img src="<?php echo get_stylesheet_directory_uri(); ?>/d/img/car/side_serch.png" width="96" height="25" /> </div> <div class="search_box"> <form role="search" method="get" id="searchform" action="/" > <input type="text" value="<?php the_search_query(); ?>" name="s" class="s" /> <input type="hidden" name="post_type" value="car"> <input type="submit" class="searchsubmit" value="" /> </form> </div> </div>
とした。
value="<?php the_search_query(); ?>"
とすると、検索後も検索ワードが検索ボックスに入ったままになる
is_main_query で meta_query を使う
複数 meta_key の指定
http://qiita.com/harapeko_wktk/items/4fe7d39ad22d3951e5cc
elseif ( $sortset == 'car_price_high' ) { //価格高い $meta_query = array( 'relation' => 'AND', //meta_queryの配列が1つの時は指定しない 'meta_sort_parent_id' => array( 'key' => 'car_open', //カスタムフィールドのキー 'type' => 'NUMERIC', //カスタムフィールドの値のタイプ ), 'meta_sort_child_id' => array( 'key' => 'car_price', //カスタムフィールドのキー 'type' => 'NUMERIC', //カスタムフィールドの値のタイプ ) ); $orderby = array( 'meta_sort_parent_id' => 'DESC', 'meta_sort_child_id' => 'DESC', // 'date' => 'DESC' ); $query->set('meta_query', $meta_query); $query->set('orderby', $orderby); }
だがけっきょく、 使わない買った
いや使った
結局、価格でソートなど
その前に売り切れで分岐したい場合
2個使いました。
car で ギャラリーで 色々
まず カーのギャラリーで たてよこ の画像の対応
まず 新しく
画像 高さ 中心 のcss
これほんと? って感じですごいけど
http://coliss.com/articles/build-websites/operation/css/css-vertical-align-anything-by-sebastian.html
.demo p { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
そんで ギャラリーに使ってる画像 ファンクション
//carサムネイル使用 'car_thum' => array( 'name' => 'car_thum', // 選択肢のラベル名 'width' => 360, // 最大画像幅 'height' => 270, // 最大画像高さ 'crop' => true, // 切り抜きを行うかどうか 'selectable' => false // 選択肢に含めるかどうか ), //carサムネイル使用 'car_big' => array( 'name' => 'car_big', // 選択肢のラベル名 'width' => 784, // 最大画像幅 'height' => 588, // 最大画像高さ 'crop' => false, // 切り抜きを行うかどうか 'selectable' => false // 選択肢に含めるかどうか ),
新たに足したcss
.flickSlider .flickView ul li img.car_big { width: auto; max-height:588px; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media screen and (max-width: 736px) { .flickSlider .flickView ul li img.car_big { width: auto; max-width:100%; max-height:262px; } }
幅100%にせずに、 サムネイル切り抜きの幅を 100%のサイズで数字指定
高さもサムネイル切り抜きの数字指定。
ただし、ギャラリーが1個めの画像の高さを取得して高さを出してくるので
1こめが小さい画像だと、高さが 高いやつが隠れてしまう。 なので、
1個めが小さい画像だった場合、高さが低いやつだった場合、その高さを取得して、
マックスハイトを変更してやることにした。
それがflickSliderに書いた
最後の方のコード
・・・ var $w = ($('.flickSlider .flickView ul li').height()); $('.flickSlider .flickView ul li img.car_big').css("max-height", $w); }); });
これ同じオンロードに入れてやって最後に処理させることで辻褄が合うのでここで、。
但し、今思ったが、 1個目の画像の高さを取得した時 すんごい小さい場合、全部スのサイズになってしまうよね、。そんなやつおらんか?
なので、
スマホ PCで もう高さ指定したほうがいいんかな?
上記だと上手く動作していなかったみたいだで 高さ取得して変更するのやめた
(JSないでなく シングルの最後にいれると、ギャラリーが表示されんことあるもんでたまに)
やっぱこうした
/*一応最小のギャラリーの高さを出しておく*/ .flickSlider .flickView,.flickSlider .flickView ul,.flickSlider .flickView ul li{ min-height:500px; } .flickSlider .flickView ul li img.car_big { width: auto; max-height:588px; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media screen and (max-width: 736px) { /*一応最小のギャラリーの高さを出しておく*/ .flickSlider .flickView,.flickSlider .flickView ul,.flickSlider .flickView ul li{ min-height:200px; } .flickSlider .flickView ul li img.car_big { width: auto; max-width:100%; max-height:262px; } }
タクソノミーぺーじで タクソノミー名からラベルを出力
<?php $taxonomy_name = get_query_var('taxonomy'); $taxonomy = get_taxonomy($taxonomy_name); echo esc_html( $taxonomy->label );?> 中古車一覧:<?php single_term_title(); ?>
シングラーラベルは何故かでないから中い
参考
http://www.nxworld.net/wordpress/wp-list-categories-count-inside-link.html
get_the_categoryで特定のカテゴリを除外するコードの書き方
https://ja.wordpress.org/support/topic/get_the_category%E3%81%A7%E7%89%B9%E5%AE%9A%E3%81%AE%E3%82%AB%E3%83%86%E3%82%B4%E3%83%AA%E3%82%92%E9%99%A4%E5%A4%96%E3%81%99%E3%82%8B%E3%82%B3%E3%83%BC%E3%83%89%E3%81%AE%E6%9B%B8%E3%81%8D%E6%96%B9/
function my_get_the_category( $id = false, $exclude = array() ) { $cats = get_the_category( $id ); $excluded_cats = array(); foreach( $cats as $cat ) { if ( !in_array( $cat->cat_ID, $exclude ) ) { $excluded_cats[] = $cat; } } return $excluded_cats; }
<?php $category = my_get_the_category(false, array(1, 2)); $cat_id = $category[0]->cat_ID; $cat_name = $category[0]->cat_name; $cat_slug = $category[0]->category_nicename; ?>
上記のみでは 小カテゴリは表示されてしまうので
追加記入
<?php //カテゴリでインフォメーションとインフォメーションの子カテゴリのチェックがあってもそれをアイコンに表示させない $taxonomy_name = 'category'; $termchildren = get_term_children( $info_cat, $taxonomy_name );//インフォカテの小カテをすべて取得 array_push($termchildren, $info_cat);//取得したものにインフォカテを追加 ?> <?php $cat = my_get_the_category(false, $termchildren );//ファンクション独自関数 if(empty($cat)){$cat = get_the_category();}//もしインフォカテゴリのみ場合 普通にget_the_categoryでインフォメーションを取得 $cat = $cat[0]; { echo $cat->cat_name; } ?>
スワイプ レスポンシブ ギャラリー スライダー
ギャラリー参考
http://black-flag.net/jquery/20130514-4588.html
ローディング参考
http://mori-coding.blog.jp/archives/6760786.html
レスポンシブ 幅100% 高さ同じ比率 参考
http://tsudoi.org/weblog/?p=2949
これ少々改造
サイドナビ 透明度変更のためthumbOpc2項目追加
//これはローディング画像を出すスクリプト 後入れ window.onload = function(){ $(function() { $("#loading").fadeOut(0); $(".flickSlider").fadeIn(500); }); } $(function(){ $(window).load(function(){ var setWrap = $('.flickSlider'),//スライダー全体を囲うブロック要素名(IDでも可) setMainView = $('.flickView'),//メインビジュアル部分を囲うブロック要素名(IDでも可) setThumbNail = $('.flickThumb'),//サムネイル部分を囲うブロック要素名(IDでも可) setMaxWidth = 800,//スライダー部分の最大幅 setMinWidth = 320,//スライダー部分の最小幅 thumbNum = 6,//一行に並べるサムネイル数 thumbOpc = 0.5,//サムネイルの非アクティブ時の透過度 thumbOpc2 = 0.3,//サイドバーの非アクティブ時の透過度 scrollSpeed = 500,//スライドアニメーションスピード delayTime = 5000,//スライドアニメーション待機時間 easing = 'linear',//スライドアニメーションのイージング指定 sideNavi = 'on', // 'on' or 'off'//左右NEXT/BACKの表示/非表示(非表示の場合は「off」等) autoPlay = 'off'; // 'on' or 'off'//自動切換え動作のON/OFF(自動切換えさせない場合は「off」等) var agent = navigator.userAgent; setWrap.each(function(){ var thisObj = $(this), childMain = thisObj.find(setMainView),mainUl = childMain.find('ul'),mainLi = mainUl.find('li'),mainLiLink = mainLi.children('a'),mainLiImg = mainLi.find('img'), childThumb = thisObj.find(setThumbNail),thumbUl = childThumb.find('ul'),thumbLi = childThumb.find('li'),thumbLiFst = childThumb.find('li:first'),thumbLiLst = childThumb.find('li:last'), mainWidth = parseInt(childMain.css('width')),mainHeight = parseInt(childMain.css('height')),listCount = mainUl.children('li').length; thisObj.css({display:'block'}); // レスポンシブ動作メイン imgSize(); function imgSize(){ var windowWidth = parseInt($(window).width()), setUlLeft = parseInt(mainUl.css('left')), setlistWidth = parseInt(mainLi.css('width')), setLeft = setUlLeft / setlistWidth; if(windowWidth >= setMaxWidth) { thisObj.css({width:setMaxWidth}); childMain.css({width:setMaxWidth}); mainUl.css({width:((setMaxWidth)*(listCount))}); mainLi.css({width:setMaxWidth}); var listWidthA = parseInt(mainLi.css('width')), leftMax = -((listWidthA)*((listCount)-1)), baseHeight = mainLiImg.height(); childMain.css({height:baseHeight}); mainUl.css({height:baseHeight}); mainLi.css({height:baseHeight}); thumbUl.css({width:setMaxWidth}); thumbLi.css({width:((setMaxWidth)/(thumbNum)),height:''}); } else if(windowWidth < setMaxWidth) { var listWidthB = parseInt(childMain.css('width')), leftMax = -((listWidthB)*((listCount)-1)); thisObj.css({width:setMaxWidth}); if(windowWidth >= setMinWidth) { thisObj.css({width:'100%'}); childMain.css({width:'100%'}); mainUl.css({width:((listWidthB)*(listCount))}); mainLi.css({width:(listWidthB)}); } else if(windowWidth < setMinWidth) { thisObj.css({width:setMinWidth}); childMain.css({width:setMinWidth}); mainUl.css({width:((setMinWidth)*(listCount))}); mainLi.css({width:setMinWidth}); } var reHeight = mainLiImg.height(); childMain.css({height:reHeight}); mainUl.css({height:reHeight}); mainLi.css({height:reHeight}); var reWidth = setThumbNail.width(); thumbUl.css({width:reWidth}); thumbLi.css({width:((reWidth)/(thumbNum))}); } var adjLeftWidth = parseInt(mainLi.css('width')), adjLeft = adjLeftWidth * setLeft; mainUl.css({left:(adjLeft)}); } imgSize(); $(window).resize(function(){ if(!(agent.search(/iPhone/) != -1 || agent.search(/iPad/) != -1 || agent.search(/iPod/) != -1 || agent.search(/Android/) != -1)){ if(autoPlay == 'on'){clearInterval(setTimer);} imgSize(); if(autoPlay == 'on'){slideTimer();} } else { imgSize(); } }); // フリックアクション var isTouch = ('ontouchstart' in window); mainUl.on( {'touchstart mousedown': function(e){ if(mainUl.is(':animated')){ e.preventDefault(); } else { if(autoPlay == 'on'){clearInterval(setTimer);} if(!(agent.search(/iPhone/) != -1 || agent.search(/iPad/) != -1 || agent.search(/iPod/) != -1 || agent.search(/Android/) != -1)){ e.preventDefault(); } this.pageX = (isTouch ? event.changedTouches[0].pageX : e.pageX); this.leftBegin = parseInt($(this).css('left')); this.left = parseInt($(this).css('left')); this.touched = true; } },'touchmove mousemove': function(e){ if(!this.touched){return;} e.preventDefault(); this.left = this.left - (this.pageX - (isTouch ? event.changedTouches[0].pageX : e.pageX) ); this.pageX = (isTouch ? event.changedTouches[0].pageX : e.pageX); $(this).css({left:this.left}); },'touchend mouseup mouseout': function(e){ if (!this.touched) {return;} this.touched = false; var setThumbLiActive = thumbUl.children('li.active'), listWidth = parseInt(mainLi.css('width')),leftMax = -((listWidth)*((listCount)-1)); if(((this.leftBegin)-30) > this.left && (!((this.leftBegin) === (leftMax)))){ $(this).stop().animate({left:((this.leftBegin)-(listWidth))},scrollSpeed,easing); setThumbLiActive.each(function(){ $(this).removeClass('active'); $(this).next().addClass('active'); }); } else if(((this.leftBegin)+30) < this.left && (!((this.leftBegin) === 0))){ $(this).stop().animate({left:((this.leftBegin)+(listWidth))},scrollSpeed,easing); setThumbLiActive.each(function(){ $(this).removeClass('active'); $(this).prev().addClass('active'); }); } else if(this.leftBegin === 0) { $(this).stop().animate({left:'0'},scrollSpeed,easing); } else if(this.leftBegin <= leftMax) { $(this).stop().animate({left:(leftMax)},scrollSpeed,easing); } else if(this.left >= 0) { $(this).stop().animate({left:'0'},scrollSpeed); } else if(this.left <= leftMax) { $(this).stop().animate({left:(leftMax)},scrollSpeed,easing); } else { $(this).stop().animate({left:(this.leftBegin)},scrollSpeed,easing); } compBeginLeft = this.leftBegin; compThisLeft = this.left; mainLiLink.click(function(e){ if(!(compBeginLeft === compThisLeft)){ e.preventDefault(); } }); if(autoPlay == 'on'){slideTimer();} } }); // ボタン移動動作 thumbLi.click(function(){ if(autoPlay == 'on'){clearInterval(setTimer);} var listWidth = parseInt(mainLi.css('width')),leftMax = -((listWidth)*((listCount)-1)), connectCont = thumbLi.index(this); mainUl.stop().animate({left:(-(listWidth)*(connectCont))},scrollSpeed,easing); thumbLi.removeClass('active'); $(this).addClass('active'); if(autoPlay == 'on'){slideTimer();} }); thumbLiFst.addClass('active'); thumbLi.css({opacity:thumbOpc}); // サイドナビボタン(有り無し) if(sideNavi == 'on'){ childMain.append('<div class="btnPrev"></div><div class="btnNext"></div>'); var setPrev = childMain.find('.btnPrev'),setNext = childMain.find('.btnNext'),setPrevNext = childMain.find('.btnPrev,.btnNext'); setPrevNext.css({opacity:thumbOpc2}); setNext.click(function(){ var setThumbLiActive = thumbUl.children('li.active'); setThumbLiActive.each(function(){ var listLengh = thumbLi.length; var listIndex = thumbLi.index(this); var listCount = listIndex+1; if(listLengh == listCount){ thumbLiFst.click(); } else { $(this).next('li').click(); } }); }); setPrev.click(function(){ var setThumbLiActive = thumbUl.children('li.active'); setThumbLiActive.each(function(){ var listLengh = thumbLi.length; var listIndex = thumbLi.index(this); var listCount = listIndex+1; if(1 == listCount){ thumbLiLst.click(); } else { $(this).prev('li').click(); } }); }); } // サムネイルマウスオーバー if(!(agent.search(/iPhone/) != -1 || agent.search(/iPad/) != -1 || agent.search(/iPod/) != -1 || agent.search(/Android/) != -1)){ thumbLi.hover(function(){ $(this).stop().animate({opacity:'1'},300); },function(){ $(this).stop().animate({opacity:thumbOpc},300); }); if(sideNavi == 'on'){ setPrevNext.hover(function(){ $(this).stop().animate({opacity:'0.5'},300); },function(){ $(this).stop().animate({opacity:thumbOpc2},300); }); } } // 自動再生(有り無し) if(autoPlay == 'on'){ function slideTimer() { setTimer = setInterval(function(){ var setThumbLiActive = thumbUl.children('li.active'); setThumbLiActive.each(function(){ var listLengh = thumbLi.length; var listIndex = thumbLi.index(this); var listCount = listIndex+1; if(listLengh == listCount){ thumbLiFst.click(); } else { $(this).next('li').click(); } }); },delayTime); } slideTimer(); } }); }); });
/*-------------------------------- フリックギャラリー ---------------------------------*/ /*ローディング画像*/ #loading{ position: relative; width: 100%; height: 100%; padding: 75% 0 0;} #loading .inner{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/wp-content/themes/D/d/img/parts/wait3.gif) center center no-repeat #FFF; } /* .flickSlider --------------------------- */ .flickSlider { margin: 24px auto; text-align: left; display: none; } /* .flickView --------------------------- */ .flickSlider .flickView { width: 100%; text-align: left; position: relative; overflow: hidden; } .flickSlider .flickView ul { top: 0; left: 0; width: 100%; position: absolute; overflow: hidden; } .flickSlider .flickView ul li { width: 100%; float: left; display: inline; overflow: hidden; } .flickSlider .flickView ul li img { width: 100%; height:auto; } /* .flickThumb --------------------------- */ .flickSlider .flickThumb { width: 100%; overflow: hidden; } .flickSlider .flickThumb ul { width: 110%; } .flickSlider .flickThumb ul li { float: left; cursor: pointer; display: inline; } .flickSlider .flickThumb ul li img { width: 100%; height:auto; } .flickSlider .flickThumb ul li.active { filter:alpha(opacity=100)!important; -moz-opacity: 1!important; opacity: 1!important; } /* sideNavi ------------------------- */ .flickSlider .btnPrev, .flickSlider .btnNext { top: 0; width: 5%; height: 100%; position: absolute; cursor: pointer; } .flickSlider .btnPrev { left: 0; background: #6d6d6d url(/wp-content/themes/D/d/img/parts/btnPrev.png) no-repeat center center; } .flickSlider .btnNext { right: 0; background: #6d6d6d url(/wp-content/themes/D/d/img/parts/btnNext.png) no-repeat center center; } /* ======================================= ClearFixElements ======================================= */ .flickSlider .flickView ul:after, .flickSlider .flickThumb ul:after { content: "."; height: 0; clear: both; display: block; visibility: hidden; } .flickSlider .flickView ul, .flickSlider .flickThumb ul { display: inline-block; overflow: hidden; } .flickSlider .flickView ul li a img:hover{ opacity:1; filter: alpha(opacity=100); /* ie lt 8 */ -ms-filter: "alpha(opacity=100)"; /* ie 8 */ -moz-opacity:1; /* FF lt 1.5, Netscape */ -khtml-opacity: 1; /* Safari 1.x */}
パフォーマーであえて複雑になりそうだからやらなかった
タクソノミーアーカイブで
特定のカテゴリのみ
小カテゴリ別に分けて 一覧表示
タクソノミーで分岐して
<?php if(is_tax('genre','演奏家')): ////演奏家は特別仕様?> <?php include("d_page_tax_ensouka.php"); ?> <?php else://演奏家以外は普通のループ?>
$taxonomy_name = get_query_var('taxonomy'); //タクソノミーページでタクソノミー名を取得 //$taxonomy_name = 'ensou_cat'; // $term_var = get_query_var( 'term' );//タクソノミーページでターム名を取得 $term = get_term_by('slug',get_query_var( 'term' ),get_query_var( 'taxonomy' ));//タクソノミーページでターム情報を取得 $term_id = $term -> term_id;//上記使ってタームID取得 ///宣言------------------------------------------ $args = array( 'parent' => 0, 'hierarchical' => 0, 'orderby' => 'term_order', // Category Order and Taxonomy Terms Order を使用 'order' => 'ASC', //'parent' => $term_id, );