WordPress – Welcartカスタマイズ・サイドバーにカート表示

WordPress用のECサイト構築プラグインを使用してのサイト制作が続いている。

ぶっちゃけ全てがカスタマイズテーマでのサイト制作依頼。
忘れない為と流用しやすいように覚書していきます。

今回初めて実装したカスタマイズから・・・「サイドバーに現在のカートの中を表示」
ちょっと調べると、Welcartでファンクションが用意されているようで、以下をsidebar.php等の表示したい所に挿入。

<?
購入合計数:usces_totalquantity_in_cart()点//(カート内の購入合計数量)
購入合計金額:¥ my_usces_totalprice_in_cart()//(カート内の商品のみの合計金額)
?>

購入合計数:1点
購入合計金額:¥ 3,150

すると、こんな感じで数字のみが表示される。これでも良いのだけどちょっと味気ない。
そんでちょいカスタマイズ。

ファンクションのソースはかんな感じ。

function usces_totalprice_in_cart(){
global $usces;
echo number_format($usces->get_total_price());
}
function usces_totalquantity_in_cart(){
global $usces;
echo number_format($usces->get_total_quantity());
}

フックは設定されていない。でも元のソースは書き換えたくないのでfunctions.phpに以下を追記。

function my_usces_totalprice_in_cart(){
 global $usces;
 return number_format($usces->get_total_price());
}
function my_usces_totalquantity_in_cart(){
 global $usces;
 return number_format($usces->get_total_quantity());
}

返り値が数字なので、returnに変更しただけ。
表示したいところに以下を挿入。

<div>
<h3>カートの中身</h3>
<div>
<? if ( my_usces_totalquantity_in_cart() > 0 ): ?>
<p>購入数:<? echo my_usces_totalquantity_in_cart(); ?>&nbsp;点</p>
<p>購入金額:\&nbsp;<? echo my_usces_totalprice_in_cart(); ?></p>
<p><a href="<? page_path('usces-cart'); ?>">カート</a></p>
<? else: ?>
<p>只今、カートに商品はございません。</p>
<? endif; ?>
</div>

以上いたってシンプルです。
まあ、購入商品がある時と、無い時の表示を変えたかっただけ。

表示例
cart_sample01
購入商品がある場合

cart_sample02
購入商品が無い場合

デザインはCSSでお好きな様に変更。

WordPress – アーカイブ・カテゴリページにカスタム投稿記事を表示

カテゴリ分けした記事一覧と、関連したカスタム投稿の記事をアーカイブ・カテゴリページに表示したくてごにゅごにゅしたので忘れないように覚書。

まず、やることはカスタム投稿の記事のスラッグをカテゴリーのスラッグと同じにする。
archive.phpでカテゴリのスラッグを取得して、スラッグからカスタム投稿の記事ページのオブジェクト(投稿情報)を取得する。

今回は子カテゴリのスラッグを取得するのでちょっと厄介で、下層のカテゴリまで取得しないとダメ。

んで、以下でスラッグを取得。

<?php
$cats = get_the_category();
$on_cat = '';
foreach ( $cats as $cat ) {
  if ( ! $on_cat || cat_is_ancestor_of( $on_cat, $cat ) ) {
    $on_cat = $cat;
  }
}
$cat_slug = $on_cat->category_nicename;
?>

そんでスラッグからカスタム投稿の記事ページのオブジェクト(投稿情報)を取得して表示。
表示したい場所に以下を書き込み。

<?php
$post = get_page_by_path($cat_slug,'OBJECT','post名');
setup_postdata( $post );
?>
<h2><?php the_title(); ?></h2>
<p><?php the_content(); ?></P>
<?php wp_reset_postdata(); ?>

ECサイトの構築で、メーカー紹介と関連商品一覧をカテゴリページでレイアウトしたい時に良いかも?

WordPress – 単記事表示での特定子カテゴリ名を取得

単記事表示(single.php)でのカテゴリ名を取得する場合、get_the_category()でごにょごにょするのが一般的。

複数のカテゴリに投稿しても一覧表示してくれる。ただ、特定の孫カテゴリを一つだけ表示しようとするとなんか上手く行かない。

階層順がバラバラで、特定できない・・・・・

以下が特定条件
カテゴリ1
 L子カテゴリ
  L孫カテゴリ(ここのカテゴリ名だけ取得)
  L孫カテゴリ(ここのカテゴリ名だけ取得)
  L孫カテゴリ(ここのカテゴリ名だけ取得)
  L孫カテゴリ(ここのカテゴリ名だけ取得)

なんとなく上手くいったので覚書。
{ 続きを読む・・・ }

明けましておめでとう!!

謹賀新年2013年

レスポンシブサイトのナビゲーション

レスポンシブなWEBサイトの横に伸びたグローバルナビゲーションはそのままだと、ウィンドウサイズの横幅が小さくなった時はかっこ悪い。ということで、480px以下になったら折りたたんでドロップダウンメニューにする算段。

まあ、jQueryとcssでシンプルにできるんだけど忘れないための覚書。

まずはベースのhtml。

【html】横並びのナビゲーション

<nav id="gnavi">
<ul>
	<li><a href="#">HOME</a></li>
	<li><a href="#">ABOUT</a></li>
	<li><a href="#">CONTACT</a></li>
	<li><a href="#">LINK</a></li>
</ul>
</nav>

{ 続きを読む・・・ }