Welcartの商品詳細ページのカスタマイズ

新規テーマを作成するにあたってのタスク整理の続き。
商品詳細ページをグリッドレイアウトにあわせるために、フィルターを利用しようとしていたけど、
どうしても処理的に無理が出てしまうので、商品詳細ページ用のファイルを作成する事にした。
以下、そこまでに至った経緯。

商品詳細ページは「the_content」関数をフィルタして、商品の画像や価格、カートに入れるボタンを表示している。
その中のdivタグにgridレイアウトのクラスを定義しようとしていたが、
bootstrapでは、gridレイアウトの定義を「row-fluid」クラスで囲んでやる必要がある。
ただ、この「row-fluid」クラスが曲者で、この定義を２つ並べると、floatがクリアされてしまう。
また商品詳細ページでは、「定価」「販売価格」「在庫状況」が出力される。
レイアウト的には商品画像の横に縦に並べて表示したいのだが、「定価」「販売価格」と「在庫状況」は
divタグの深さが異なり、うまく並べることができない。

一日悩んだ結果、商品詳細ページとsingleページを分離し、独自のレイアウトでページを作成する事に。
と言っても、templateのフォルダ内に「wc_templates/wc_item_single.php」を配置するだけ。
後は「the_content」関数のフィルタを無効化し、その代わりの表示処理を「wc_item_single.php」内に実装すれば終わり。

と、言葉にするのは簡単だけど、「wc_item_single.php」内の処理、結構複雑なんよね。
今日中の実装は無理かな。
続きはまた来週。