web-dev-qa-db-ja.com

カスタムテンプレートプレートを使用するためのWooCommerceショップページ

質問をする前に、私は既に https://stackoverflow.com/questions/15025213/wordpress-woocommerce-template-file-overiding で質問をしたことを伝えたいと思います。

私は WooCommerce プラグインを使ってウェブサイトを開発しています。 WooCommerceではすべてうまくいっています。私の要件に従って、私は自分のホームページをショップページにするために、WooCommerceダッシュボードから自分のホームページをショップベースページとして設定しました。今私の要件は、管理者側からアップロードする必要があるいくつかの画像を配置し、画像の上にいくつかのテキストを表示することです。その機能については、Googleで検索したところ、 WordPress Advanced Custom Fields を使用することを推奨する人もいました。インストールしました。

今WooCommerceは私のカスタムテーマを使用していないことがわかりました。独自のカスタムテーマを使用しています。 Advanced Custom Fields plugin _を使用して画像とテキストを表示したいので、画像とテキストのクエリを使用するには、私自身のカスタムテンプレートが本当に必要です。それから私はグーグルを使って解決策を探したところ、テーマのpage.phpのコピーをwoocommerce.phpにコピーしてコードを置き換えるだけの提案がありました。

     <?php while ( have_posts() ) : the_post(); ?>

      <?php get_template_part( 'content', 'page' ); ?>

      <?php comments_template( '', true ); ?>

    <?php endwhile; // end of the loop. ?>

<?php woocommerce_content(); ?>

私はそうしましたが、それでも私の Advanced Custom Fieldsからのカスタムフィールド を取得できていません。とても親切に助けてください。任意の提案や支援はかなりのものになります。ありがとう。

画像とテキストの詳細カスタムフィールドを表示するための私のコードは次のようになります。

<?php $product_tab_banner = get_field('product_tab_banner');
    if($product_tab_banner): ?>
   <?php var_dump($product_tab_banner); ?>
    <div class="nt-highlighted-products">
    <img src="<?php echo $product_tab_banner['url']; ?>" alt="<?php echo $product_tab_banner['alt']; ?>"  width="<?php echo $product_tab_banner['sizes']['featured_product-width'];?>" height="<?php echo $product_tab_banner['sizes']['featured_product-height'];?>" title="<?php echo $product_tab_banner['title']; ?>" />
    </div>
  <?php endif; ?>

私はWordPress TwentyElevenテーマを使用しています。

7
NewUser

あなたの質問を通して、私は woocommerce があなたのカスタムテンプレートを使わないことをあなたに伝えたいのです。独自のテンプレートを使用します。 Wordpressの高度なカスタムフィールドプラグインを使用したいので 私はあなたにこの機能がページと投稿でのみ機能することを伝えたいと思います。そのため woocommerce があなた自身のカスタムテンプレートを使うことを許さないので、あなたは高度なカスタムフィールド機能を使うことができません。

今は何か違うことをするだけです。あなたがあなたの製品を見せたいところにあなた自身のカスタムテンプレートを作るだけです。 http://docs.woothemes.com/document/woocommerce-shortcodes/ にアクセスしてください。ここで woocommerceshortcodes を見ることができます。あなたはあなた自身のカスタマイズで簡単にほとんどすべての製品を見せることができるところ。今すぐこれらの shortcodes を使って製品を表示してください。ここで、 woocommerce が独自のカスタムテンプレートを使用していることがわかりました。それはあなた自身のテンプレートなので、これで高度なカスタムフィールドを簡単に使うことができます。それは明らかですか?あなたが理解できないことがあれば私に答えてください。これがお役に立てば幸いです。

3
user159377

私があなたの問題を正しく理解したかどうかはよくわかりませんが、それを再現しようとします。

最初の WooCommerceドキュメントのこの部分を検討してください

これらのテンプレートの1つを編集したい場合は、同じファイル構造を保ったまま、テーマ内の/woocommerceという名前のディレクトリにコピーしてください。 /templates/cart/cart.phpthemename/woocommerce/cart/cart.phpに移動します。コピーしたファイルは、WooCommerceのデフォルトのテンプレートファイルを上書きします。

2番目の 、これはレプリケーションの手順です。

  • WP 3.5.1、TwentyEleven 1.5、WooCommerce 1.6.6、およびAdvancedCustomFields 4.0.0を使用する
  • 閲覧設定(/wp-admin/options-reading.php)で、ページ "Shop"を静的フロントページとして設定します。
  • 戻り値が "Image Object"で、投稿タイプ "Product"に表示されるように、Image Field(product_tab_banner)を含むACF Field Groupを設定します。

解決策

  • 次のフォルダを作成してください:/wp-content/twentyeleven/woocommerce/
  • この新しく作成されたフォルダにファイル/wp-content/plugins/woocommerce/templates/content-product.phpをコピーします
  • このcontent-product.phpのコピーにあなたのコードを入れてください
$product_tab_banner = get_field('product_tab_banner');
if($product_tab_banner): ?>
    <div class="nt-highlighted-products">
    <img src="<?php echo $product_tab_banner['url']; ?>" 
        alt="<?php echo $product_tab_banner['alt']; ?>"  
        width="<?php echo $product_tab_banner['sizes']['featured_product-width'];?>" 
        height="<?php echo $product_tab_banner['sizes']['featured_product-height'];?>" 
        title="<?php echo $product_tab_banner['title']; ?>" />
    </div>
<?php endif; ?>

これは製品ページです:

product page 
クリックすると拡大します

そしてここでサイトの結果:

site result 


「ショッピング」ページをカスタマイズしたい場合は、ファイル/wp-content/plugins/woocommerce/templates/archive-product.phpをテーマの/woocommerce/フォルダにコピーしてください。

10
brasofilo