web-dev-qa-db-fra.com

Page de la boutique WooCommerce pour utiliser mon modèle personnalisé

Avant de poser la question, je tiens à vous dire que j'ai déjà posé la question dans https://stackoverflow.com/questions/15025213/wordpress-woocommerce-template-file-overiding

J'utilise le plugin WooCommerce pour développer un site Web. Tout va bien avec WooCommerce. Conformément à mes exigences, j'ai configuré ma page d'accueil en tant que page de base du tableau de bord WooCommerce pour que ma page d'accueil devienne la page de la boutique. Maintenant, mon exigence est de placer des images qui doivent être téléchargées à partir de l’administrateur et d’afficher du texte par-dessus les images. Pour cette fonctionnalité, j'ai cherché sur Google et certaines personnes m'ont suggéré d'utiliser WordPress Advanced Custom Fields . Je viens de l'installer.

Maintenant, j'ai vu que WooCommerce n'utilise pas mon thème personnalisé. Il utilise son propre thème personnalisé. Étant donné que je souhaite afficher des images et du texte à l'aide du plugin Champs personnalisés avancés , j'ai vraiment besoin de mon propre modèle personnalisé pour utiliser les requêtes d'images et de texte. Ensuite, j'ai de nouveau cherché une solution sur Google. J'ai proposé de copier le page.php du thème dans le woocommerce.php, puis de remplacer le code:

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

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

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

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

avec

<?php woocommerce_content(); ?>

Je l'ai fait mais je ne reçois toujours pas mes champs personnalisés à partir de Advanced Custom Fields . Alors aidez-moi gentiment. Toute suggestion et aide seront appréciables. Merci.

Mon code pour afficher les champs personnalisés avancés pour l'image et le texte est le suivant:

<?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; ?>

J'utilise le thème WordPress TwentyEleven.

theme-developmentpluginschild-themeadvanced-custom-fields
7
NewUser

En passant en revue votre question, je veux vous dire que woocommerce n’utilisera pas votre modèle personnalisé. Il utilisera son propre modèle. Comme vous voulez utiliser wordpress plugin de champs personnalisés avancés je tiens à vous dire que cette fonctionnalité ne fonctionne que sur la page et la publication. Donc, en tant que woocommerce ne permettra pas d'utiliser votre propre modèle personnalisé, vous ne pouvez pas utiliser les fonctionnalités de champs personnalisés avancés.

Maintenant, faites quelque chose de différent. Créez simplement votre propre modèle personnalisé à l'endroit où vous souhaitez afficher vos produits. Ensuite, allez simplement sur le site http://docs.woothemes.com/document/woocommerce-shortcodes/ Vous pouvez voir les codes abrégés du woocommerce . Où vous pouvez facilement montrer presque tous les produits avec votre propre personnalisation. Maintenant, utilisez ces shortcodes pour afficher les produits. Ici, vous avez réalisé que woocommerce utilise votre propre modèle personnalisé. Maintenant que c'est votre propre modèle, vous pouvez facilement utiliser des champs personnalisés avancés avec cela. Est-ce clair? Si quelque chose que vous ne comprenez pas, répondez-moi. J'espère que ceci vous aidera.

3
user159377

Je ne suis pas tout à fait sûr de bien comprendre votre problème, mais voici ma tentative pour le reproduire.

First , considérons cette partie de la documentation WooCommerce :

Si vous souhaitez modifier l'un de ces modèles, copiez-le simplement dans un répertoire de votre thème nommé /woocommerce, en conservant la même structure de fichier, par exemple. déplacez /templates/cart/cart.php vers themename/woocommerce/cart/cart.php. Le fichier copié remplacera désormais le fichier de modèle par défaut de WooCommerce.

Second , ce sont les étapes de réplication:

  • Utilisation de WP 3.5.1, TwentyEleven 1.5, WooCommerce 1.6.6 et AdvancedCustomFields 4.0.0
  • Définissez la page "Boutique" comme page de couverture statique dans les paramètres de lecture (/wp-admin/options-reading.php).
  • Définir un groupe de champs ACF contenant un champ d'image (product_tab_banner), avec la valeur de retour comme "Objet d'image" et à afficher dans le type de publication "Produit"

Solution :

  • Créez le dossier suivant: /wp-content/twentyeleven/woocommerce/
  • Copiez le fichier: /wp-content/plugins/woocommerce/templates/content-product.php dans ce dossier nouvellement créé.
  • Placez votre code dans cette copie de 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; ?>

Voici la page du produit:

 product page 
cliquez pour agrandir ⤴

et voici le résultat dans le site:

 site result 

Si vous souhaitez personnaliser la page "Boutique", copiez le fichier /wp-content/plugins/woocommerce/templates/archive-product.php dans le dossier /woocommerce/ de votre thème.

10
brasofilo