web-dev-qa-db-fra.com

Comment installer correctement Snipcart dans des composants personnalisés

J'ai un composant personnalisé qui est en fait un formulaire de recherche ajax. Quelqu'un sélectionne certaines options et, lorsqu'il clique sur le bouton Envoyer, je souhaite charger certains produits en fonction des critères sélectionnés.

Je inclut le js / css fichiers snipcart nécessaires à l'intérieur de mon modèle index.php fichier et lorsque j'utilise la validation JS sur le tableau de bord de snipcart, tout est ok.

Lire le Doc de Snipcart je dois ajouter le data-item-url pour chaque produit.

J'ai commencé par mettre: data-item-url="http://mydomain.com/components/com_rouf/scripts/ajaxProducts.php" (c'est le fichier qui exécutait l'appel ajax et imprimait les produits)

Lorsque j'ai essayé d'acheter un produit, dans l'onglet de paiement, je reçois cette erreur:

L'article B1-TEST n'a pas été trouvé à l'adresse http://mydomain.com/components/com_rouf/scripts/ajaxProducts.php .

Puis je l'ai changé en: data-item-url="http://mydomain.com/index.php?option=com_rouf" _ (le fichier de vue dans lequel le code html a été imprimé)

Pas de résultat.

Après cela j'ai déplacé le ajax file mécanisme dans un nouveau view file et au lieu de ajax call J'ai utilisé un form pour envoyer les options de recherche.

essayé les deux data-item-url="http://mydomain.com/index.php?option=com_rouf&view=rouf&layout=products.php"

ET

data-item-url="http://mydomain.com/components/com_rouf/views/rouf/tmpl/products.php"

Même erreur.

Après cela, j'ai pensé que pour imprimer le code html du produit, donc snipcart peut l'explorer et le trouver à la fois dans la vue et dans le fichier ajax un $_POST est obligatoire.

J'ai donc créé un nouveau fichier test.php _ imprimant TOUS les produits.Il s’agit d’une manière retardée et uniquement à des fins de test.

<?php
$db=JFactory::getDbo();
$query='SELECT * from `#__dash_sxoles_pricing` as a left join `#__dash_license_cat` as b on a.license_id=b.id left join `#__dash_sxoles` as c on a.sch_id = c.id  where 1';
$db->setQuery($query);
$res=$db->loadObjectList();

foreach ($res as $row ) {
    $diplCode=$row->code.'-'.$row->name;
    echo '

     <div>'.$row->company.'</div>
                <button type="button" class="snipcart-add-item"
             data-item-name="'.$diplCode.'"
             data-item-price="'.$row->price.'"
             data-item-id="'.$row->id.'-'.$row->license_id.'"
             data-item-url="http://mydomain.com/test.php">
              Add to cart
            </button>
               </div>
               ';
}
?>

N'a pas fonctionné non plus. J'ai déjà envoyé un email @ snipcart mais je n'ai pas eu de réponse.

Quelqu'un a-t-il déjà créé un snipcart dans Joomla! ? Est-ce que je manque complètement quelque chose ici ou?

joomla-3.xcomponentdevelopmente-commerce
4
IseNgaRt

Ok, j'ai trouvé l'erreur. J'avais besoin de définir le codage de caractères sur UTF-8 Dans le script externe, car les valeurs des noms étaient converties en boîtes et cela entraînait des conflits de valeurs.

Je vous fournirai toutes les étapes que j'ai suivies pour atteindre le résultat final.

  • Ajout du Javascript/CSS inclus dans l'en-tête du fichier d'index du template
  • Au tableau de bord snipcarts je valide que les includes sont bien
  • Sur snipcarts Dashboard, je définis le domaine dans lequel je vais utiliser snipcart (vous ne pouvez pas l'utiliser sur localhost)

Maintenant, pour la création dynamique de produits (montrer les produits en fonction de certains termes), il y a 2 façons:

  • Définissez data-item-url Sur un script externe sur lequel vous imprimerez TOUS les produits (façon LAME)
  • Définissez data-item-url Sur le même fichier, mais joignez $_SESSION vars, De sorte que les produits soient imprimés au niveau de la HTTP REQUEST, À la sortie de quelqu'un.

Pour le script externe: Vous devez définir le codage de caractères sur UTF-8 <?php header("Content-Type: text/html; charset=utf-8"); ?> Ceci empêchera la conversion des caractères multi-octets en blocs et garantira que le nom de l'élément sera identique. Je ne suggère pas celui-ci car vous ne devez PAS utiliser defined( '_JEXEC' ) or die( 'Restricted access' ); au-dessus du fichier, car snipcart http req échouera. Ainsi, vous aurez une page avec toutes les informations de votre produit ouverte à tout le monde.

Pour rappeler le même fichier: Le data-item-url Devrait ressembler à cela:

echo 'data-item-url="http://domain.com/index.php?option=com_rouf&view=rouf&layout=products&loc='.$_GET["loc"].'&lic='.$_GET["lic"].'">';

Le seul inconvénient est que je dois utiliser $_GET À la place de $_POST, Bien que je ne transmette aucune donnée cruciale. (Je ne peux pas penser à un moyen d'y parvenir avec $_POST. Si quelqu'un pouvait suggérer quelque chose, ce serait génial)

Je publierai le code php que j'utilise pour une meilleure explication si quelqu'un a encore du mal à l'avenir:

<?php
 //select the products base on location and type of products
 $loc = $_GET['loc']; 
 $diploma = $_GET['lic']; 

 $query=$db->getQuery(true);
 $query->select('a.*')
       ->from($db->quoteName('#__dash_sxoles', 'a'))
       ->join('LEFT',$db->quoteName('#__dash_sxoles_pricing', 'b') . ' ON (' . $db->quoteName('a.id') . ' = ' .$db->qupteName('b.sch_id') .')')
       ->where('a.location='.$db->quote($loc))
       ->where('b.license_id'.$db->quote($diploma));
$db->setQuery($query);
$src=$db->loadObjectList();

//print the data with data-url of each product recalling the same view file with $_GET params

foreach ($src as $row) {
  echo '
  <div class="col-lg-3 ">
  <div class="st-inner ajaxcontainer" style="">
  <div>'.$row->company.'</div>
  <button type="button" class="snipcart-add-item"
  data-item-name="'.$diplCode.'"
  data-item-price="'.$row->price.'"
  data-item-id="'.$row->sch_id.'-'.$row->license_id.'"
  data-item-url="http://domain.com/index.php?option=com_rouf&view=rouf&layout=products&loc='.$_GET["loc"].'&lic='.$_GET["lic"].'">
    Add to cart
 </button>
 </div>
 </div>';
}

EDIT: J'ai trouvé un meilleur moyen en utilisant $_POST Pour le formulaire et $_GET Uniquement pour la demande du snipcart.

$loc = $_POST['loc'];
$diploma = $_POST['lic'];
if (isset($_GET['loc'], $_GET['lic'])) {
    $loc=$_GET['loc'];
    $diploma=$_GET['lic'];
    unset($_GET['loc']);
    unset($_GET['lic']);
}
3
IseNgaRt

La valeur en data-item-url doit être une URL où se trouve le bouton d'achat. En regardant la source de la page spécifiée dans le data-item-url attribut nous devons trouver le réel snipcart-add-item bouton pour le produit spécifique.

On dirait que la solution que vous avez essayée avec le test.php fichier pourrait fonctionner. Alors peut-être que c'est un problème avec la configuration des domaines.

Nous avons un article dans notre base de connaissances qui peut être intéressant:

URL de donnée non valide

La raison la plus courante est que la valeur spécifiée dans data-item-url n'est pas valide.

Avant de terminer la commande, Snipcart envoie une requête HTTP à la valeur spécifiée dans cet attribut pour s'assurer que le prix et les autres informations importantes n'ont pas été modifiés par quelqu'un qui sait utiliser les outils de développement de navigateur.

Vous pouvez en savoir plus à ce sujet dans notre documentation: http://docs.snipcart.com/getting-started/security

L'URL spécifiée doit être une URL où le bouton d'achat du produit sera disponible sur le source de la page.

Remarque importante: pour les utilisateurs disposant d'un site Web d'une seule page, le champ url-élément-de-données doit être renseigné uniquement avec votre nom de domaine de base, tel que www.example.com, ou avec une simple barre oblique /.

Configuration de domaines non valide

En outre, vous devez autoriser le domaine et les sous-domaines pour lesquels vos produits sont disponibles. Si vous vous connectez au tableau de bord et accédez à Paramètres> Général, vous pourrez définir votre nom de domaine par défaut, ainsi que les domaines et sous-domaines autorisés supplémentaires.

Par exemple, si la valeur de l'élément de données élémentaire est http://test.mysite.com/products/1 et que votre domaine par défaut est mysite.com, il échouera. Vous devrez ajouter test.mysite.com dans les sous-domaines autorisés.

Si vous le souhaitez, vous pouvez également utiliser une URL relative (/ products/1). Mais nous ne validerons le produit que dans votre nom de domaine par défaut. Ainsi, dans l'exemple ci-dessus, si la valeur url-élément-de-données était/products/1, nous ferions la demande HTTP pour valider les informations sur http://mysite.com/products/1 .

Pour spécifier une URL relative, la valeur de data-item-url doit commencer par un /.

2
Charles Ouellet