Welcart Voll 1.1 をリリースしました。
[更新内容]
- WCEX Favorites(お気に入りプラグイン) 対応
- Welcart Basic 1.4 アップデートによるヘッダーのレイアウト崩れ修正
- ヘッダーメンバーメニューレイアウト調整
- グローバルナビゲーションメニューの表示不具合修正
WCEX Favorites 対応
Welcart Voll を独自にカスタマイズしている方で「WCEX Favorites」を導入される場合には、下記の修正が必要となります。
「お気に入りリスト」ページへのリンク設置
ヘッダーのメンバーメニューに「お気に入りリスト」ページへのリンクを設置します。
フック追加: welcart_basic-voll/header.php 138行目あたり
<?php if( usces_is_login() ): ?> <li><?php printf(__('Hello %s', 'usces'), usces_the_member_name('return')); ?></li> <li><?php usces_loginout(); ?></li> <li><a href="<?php echo USCES_MEMBER_URL; ?>"><?php _e('My page', 'welcart_basic') ?></a></li> <?php do_action( 'usces_theme_login_menu' ); ?> <?php else: ?> <li><?php _e('guest', 'usces'); ?></li> <li><?php usces_loginout(); ?></li> <li><a href="<?php echo USCES_NEWMEMBER_URL; ?>"><?php _e('New Membership Registration','usces') ?></a></li> <?php endif; ?>
※ do_action( ‘usces_theme_login_menu’ ) を追加
商品一覧にお気に入りアイコン設置
商品カテゴリーページや検索結果ページなどの商品一覧の各商品にお気に入りアイコンを設置します。
フック追加
: welcart_basic-voll/front-page.php 148行目あたり
: welcart_basic-voll/category.php 42行目あたり
: welcart_basic-voll/search.php 26行目あたり
: welcart_basic-voll/wc_search_page.php 61行目あたり
<article id="post-<?php the_ID(); ?>" <?php post_class('fromBottomIn'); ?> data-scroll="once"> <div class="inner item-info"> <?php wcct_produt_tag(); ?> <div class="itemimg"> <a href="<?php the_permalink(); ?>"> <?php usces_the_itemImage( 0, 600, 600 ); ?> <?php do_action( 'usces_theme_favorite_icon' ); ?> <?php if( wcct_get_options( 'display_soldout' ) && !usces_have_zaiko_anyone() ): ?>
※ do_action( ‘usces_theme_favorite_icon’ ) を追加
商品詳細ページにお気に入りアイコン設置
商品詳細ページにお気に入りアイコンを設置します。
お気に入りアイコンの設置に伴いHTMLの構造の変更もおこなっております。
フック追加
: welcart_basic-voll/wc_templates/wc_item_single.php 54行目あたり
: welcart_basic-voll/wc_templates/wc_item_single_service.php 45行目あたり
: welcart_basic-voll/wc_templates/wc_item_single_data.php 46行目あたり
: welcart_basic-voll/wc_templates/wc_sku_select.php 45行目あたり
: welcart_basic-voll/wc_templates/wc_sku_select_service.php 45行目あたり
<?php endif; ?> <div id="itemimg-main" class="slider slider-for itemimg"> <div><a href="<?php usces_the_itemImageURL(0); ?>" <?php echo apply_filters( 'usces_itemimg_anchor_rel', NULL ); ?>><?php usces_the_itemImage( 0, 600, 600, $post ); ?></a></div> <?php foreach( $imageid as $id ) : ?> <div><a href="<?php usces_the_itemImageURL($id); ?>" <?php echo apply_filters( 'usces_itemimg_anchor_rel', NULL ); ?>><?php usces_the_itemImage( $id, 600, 600, $post ); ?></a></div> <?php endforeach; ?> <?php do_action( 'usces_theme_favorite_icon' ); ?> </div><!-- #itemimg-main -->【変更後】
<?php endif; ?> <div id="itemimg-main" class="itemimg"> <div class="slider slider-for"> <div><a href="<?php usces_the_itemImageURL(0); ?>" <?php echo apply_filters( 'usces_itemimg_anchor_rel', NULL ); ?>><?php usces_the_itemImage( 0, 600, 600, $post ); ?></a></div> <?php foreach( $imageid as $id ) : ?> <div><a href="<?php usces_the_itemImageURL($id); ?>" <?php echo apply_filters( 'usces_itemimg_anchor_rel', NULL ); ?>><?php usces_the_itemImage( $id, 600, 600, $post ); ?></a></div> <?php endforeach; ?> </div> <?php do_action( 'usces_theme_favorite_icon' ); ?> </div><!-- #itemimg-main -->
※ do_action( ‘usces_theme_favorite_icon’ ) を追加
※ HTML構造の変更は、下記を参考にしてください。
HTML構造の変更
変更前 | 変更後 |
---|---|
<div id="itemimg-main" class="slider slider-for itemimg"> ・・・ </div> |
<div id="itemimg-main" class="itemimg"> <div class="slider slider-for"> ・・・ </div> </div> |
お気に入りリストページのテンプレート設置
Welcart Voll 用のお気に入りリストページのテンプレートを設置します。
<設置手順>
- マイページの購入履歴より最新版のZipファイル(welcart_basic-voll.1.1.zip)をダウンロードして解凍します。
- 解凍したファイル内の「wc_templates」の「member」フォルダ内に「wc_favorite_page.php」というテンプレートがございますので、お使いのテーマ内に同じ階層になるよう設置してください。
welcart_basic-voll/wc_templates/member/wc_favorite_page.php
WCEX Favorties 専用の CSS追加
お気に入りリストページのテンプレートと同様に お気に入り専用のCSSを設置します。
<設置手順>
- マイページの購入履歴より最新版のZipファイル(welcart_basic-voll.1.1.zip)をダウンロードして解凍します。
- 解凍したファイル内の「asses」の「css」フォルダ内に「favorite.css」というCSSファイルがございますので、お使いのテーマ内に同じ階層になるよう設置してください。
※「asses」「css」の各フォルダがお使いのテーマに存在しない場合は、フォルダも作成してCSSファイルを設置してください。welcart_basic-voll/assets/css/favorite.css
Welcart 商品一覧ウィジェットを「WCEX Favorites」に対応
Welcart 商品一覧ウィジェットを「WCEX Favorites」に対応しました。
フック追加: welcart_basic-voll/inc/front-customized.php 457行目あたり
add_filter( 'welcart_basic_filter_item_list', 'wcct_filter_item_list', 10, 3 ); function wcct_filter_item_list( $html, $term_id, $number ) { usces_the_item(); $html .= '<article class="grid-box" id="post-' . get_the_ID() . '">' . "\n" ; $html .= '<div class="inner item-info">' . "\n"; $html .= wcct_get_produt_tag() . "\n"; $html .= '<div class="itemimg"><a href="' . get_permalink( get_the_ID() ) .'">' . usces_the_itemImage( 0, 300, 300, '', 'return' ); $html .= apply_filters( 'usces_filter_theme_favorite_icon', '', 0 ); if( wcct_get_options( 'display_soldout' ) && !usces_have_zaiko_anyone() ) {
※ apply_filters( ‘usces_filter_theme_favorite_icon’, ”, 0 ) を追加
お気に入りボタンの色調整
変数追加: welcart_basic-square/inc/theme-customizer.php 1427行目あたり
$cart_btn_bg = get_theme_mod( 'cart_btn_bg', '#2abfab' ); $cart_btn_bg_hov = 'rgba( ' . implode( ', ', wcct_rgb( $cart_btn_bg ) ) . ', .6 )'; $cart_btn_text = get_theme_mod( 'cart_btn_text', '#fff' ); $favrotie_btn_bg = 'rgba( ' . implode( ', ', wcct_rgb( $cart_btn_bg ) ) . ', .1 )'; $main_btn_bg = get_theme_mod( 'main_btn_bg', '#090909' );
※ 「$favrotie_btn_bg」 を追加
スタイル追加: welcart_basic-square/inc/theme-customizer.php 1583行目あたり
.item-info .skubutton:hover, #memberinfo table.retail .redownload_link a:hover { background-color: <?php echo $cart_btn_bg_hov; ?>; } /* .wcex favorites */ .favorite-button .add-favorite { border-color: <?php echo $cart_btn_bg; ?>; color: <?php echo $cart_btn_bg; ?>; } .favorite-button .add-favorite { background-color: <?php echo $favrotie_btn_bg; ?>; } .favorite-button .add-favorite.added { background-color: <?php echo $cart_btn_text; ?>; } .favorite-button .add-favorite:hover, .favorite-button .add-favorite.added:hover, #tofavorite-content .tofavorite-page-link a, #tofavorite-content .tologin-page-link a, #tofavorite-content .tologin-newmember-page-link a { color: <?php echo $cart_btn_text; ?>; background-color: <?php echo $cart_btn_bg; ?>; } #tofavorite-content .tofavorite-page-link a:hover, #tofavorite-content .tologin-page-link a:hover, #tofavorite-content .tologin-newmember-page-link a:hover { background-color: <?php echo $cart_btn_bg_hov; ?>; } #tofavorite-content #tofavorite-close { color: <?php echo $sub_btn_text; ?>; background-color: <?php echo $sub_btn_bg; ?>; } #tofavorite-content #tofavorite-close:hover { background-color: <?php echo $sub_btn_bg_hov; ?>; } /* -- main-btn -- */ .inqbox .send input,
※ 「/* .wcex favorites */」(ハイライトされている部分まで)を追加
Welcart Basic 1.4 アップデートによるヘッダーのレイアウト崩れ修正
親テーマの Welcart Basic 1.4 では、ヘッダーのレイアウト調整をおこなっております。
それに伴い、Welcart Voll が最新バージョンでない場合にはレイアウト崩れが発生します。Welcart Voll を独自にカスタマイズしている方は、下記を参考にCSS の修正をおこなってください。
スタイル追加: welcart_basic-voll/style.css 1936行目あたり
@media screen and (min-width: 62.5em) { header .inner { display: block; width: auto; padding: 1.785em 0 0; } /* ———————— .site-title ———————— */ h1.site-title, div.site-title { }
※ 「display: block;」を追加
スタイル追加: welcart_basic-voll/style.css 1936行目あたり
@media screen and (min-width: 62.5em) { #head-bottom { clear: both; padding: 0 1.071em; } .snav { clear: none; margin: .9285em 0; float: right; width: auto; } .incart-btn, .snav .search-box, .snav .membership { }
※ 「width: auto;」を追加
スタイル追加: welcart_basic-voll/style.css 2115行目あたり
@media screen and (min-width: 62.5em) { .snav .search-box, .snav .membership { position: relative; padding: 0; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; transition-duration: .5s; } .snav .membership { overflow: inherit; width: auto; } .snav .search-box i, }
※ 「width: auto;」を追加
ヘッダーメンバーメニューのレイアウト調整
会員ログイン時のメンバーメニューの表示順を変更しました。
テンプレート修正: welcart_basic-voll/header.php 134行目あたり
【変更前】<?php if( usces_is_login() ): ?> <li><?php printf(__('Hello %s', 'usces'), usces_the_member_name('return')); ?></li> <li><?php usces_loginout(); ?></li> <li><a href="<?php echo USCES_MEMBER_URL; ?>"><?php _e('My page', 'welcart_basic') ?></a></li> <?php do_action( 'usces_theme_login_menu' ); ?> <?php else: ?> <li><?php _e('guest', 'usces'); ?></li> <li><?php usces_loginout(); ?></li> <li><a href="<?php echo USCES_NEWMEMBER_URL; ?>"><?php _e('New Membership Registration','usces') ?></a></li> <?php endif; ?>【変更後】
<?php if( usces_is_login() ): ?> <li><?php printf(__('Hello %s', 'usces'), usces_the_member_name('return')); ?></li> <li><a href="<?php echo USCES_MEMBER_URL; ?>"><?php _e('My page', 'welcart_basic') ?></a></li> <?php do_action( 'usces_theme_login_menu' ); ?> <li><?php usces_loginout(); ?></li> <?php else: ?> <li><?php _e('guest', 'usces'); ?></li> <li><?php usces_loginout(); ?></li> <li><a href="<?php echo USCES_NEWMEMBER_URL; ?>"><?php _e('New Membership Registration','usces') ?></a></li> <?php endif; ?>
※ usces_loginout() ログアウトの表示位置を変更
グローバルナビゲーションメニューの表示不具合修正
ナビゲーションメニューが段落ちした状態でメンバーアイコン・検索アイコンらを開いた際のメニュー表示の不具合を修正しました。
スタイル追加: welcart_basic-voll/style.css 2141行目あたり
@media screen and (min-width: 62.5em) { .snav .search-box i:hover, .snav .membership i:hover { cursor: pointer; } /* -- .snav .search-box -- */ .snav .search-box form { display: none; position: absolute; top: 40px; left: auto; right: 0; width: 300px; padding: 0; z-index: 3; } .search-box input[type="text"] { }
※ 「z-index: 3;」を追加
スタイル追加: welcart_basic-voll/style.css 2141行目あたり
@media screen and (min-width: 62.5em) { .search-box .searchsubmit { position: absolute; height: 50px; line-height: 50px; } /* -- .snav .membership -- */ .snav .membership ul { display: none; position: absolute; top: 40px; left: auto; right: 0; width: 300px; padding: 1.785em; border-width: 1px; border-style: solid; z-index: 3; } .snav .membership.On ul, }
※ 「z-index: 3;」を追加