Super Simple eCommerce avec Gumroad

Gumroad est un moyen extrêmement simple de créer des produits personnalisables et de commencer à vendre des biens électroniques et physiques en quelques minutes. Il ne s'agit pas d'un produit de remplacement pour tous les systèmes d'achat, mais il peut certainement gérer la vente de votre musique, de vos oeuvres d'art, de vos t-shirts, de vos PDF et bien plus encore..

Regarder le screencast

Vous pouvez également télécharger la vidéo ou vous abonner à YouTube via Webdesigntuts + screencasts.

Lire le tutoriel

Si la vidéo ne vous convient pas, voici un guide écrit pour vous aider à démarrer. N'hésitez pas à poser toutes les questions que vous avez dans les commentaires!

Pourquoi Gumroad?

Je pense littéralement que votre grand-mère pourrait utiliser Gumroad pour lui vendre ses pulls laids. Il est cette facile. Ce n'est pas facile, c'est bien. Le système est très bien conçu pour faciliter le téléchargement, la personnalisation et la gestion des commandes..

Quel est le compromis?

Sans l'API, vous n'avez pas beaucoup de contrôle sur l'apparence de votre page de détail. Ce n'est pas grave car la page de détail des articles est plutôt belle. La seule autre mise en garde à laquelle je puisse penser est que les charrettes JavaScript me semblent toujours un peu précaires. J'ai entendu parler d'histoires de gens qui modifiaient les prix des articles dans divers paniers JavaScript, mais pour être honnête, je ne sais pas s'il est applicable à Gumroad, car cela crée un iframe pour afficher votre produit. Donc, je suppose que lorsque vous cliquez sur le bouton "Je veux ça!" bouton qu'il valide sur le serveur.

Les défauts sont donc beaux, extensibles avec une excellente API et probablement assez sécurisés. Attendez, ce ne sont pas des compromis! Gumroad est-il vraiment aussi bon??

Oui

Le créateur de Gumroad, Sahil Lavingia, a pris de très bonnes décisions lorsqu'il a assemblé Gumroad. Je pense que les décisions qui font que Gumroad fonctionne si bien étaient de soustraire le contrôle au vendeur; assurez-vous que tout ce que vous leur imposez leur va bien; et rendre tout le reste simple et élégant.

Essaye le

Vous ne pouvez rien casser ou rien acheter accidentellement si vous ne saisissez pas vos informations de paiement. Alors allez créer un compte sur gumroad.com maintenant et commencez à regarder autour de vous.

La première chose que vous remarquerez après la connexion, c'est que Gumroad veut que vous créiez des produits..


Créer un produit

Ajouter un titre et télécharger ou lier quelque chose. Si vous vendez un bien électronique (PDF, des icônes vectorielles, de la musique), téléchargez-le ou créez un lien. Si vous vendez un bien physique, il est assez courant de télécharger ou de créer un lien vers une photo..

Donne-moi ton prix. Réglez ceci à n'importe quel prix que vous voulez. Si vous mettez un + dans le champ au lieu d'un nombre, une zone de texte apparaîtra et vous demandera de saisir un prix suggéré. Entrez le prix que vous jugez juste. Cela va mettre en place un système "Payer ce que vous voulez" dans lequel l'acheteur peut obtenir l'article gratuitement, mais il est poussé à acheter l'objet..


Téléchargez ou créez un lien vers une image de couverture de 670px. Ceci est l'image en haut du modal de détail de votre produit. Les gens ont tendance à acheter votre produit plus souvent si vous avez une belle image de couverture. Prenez donc le temps de la créer et de la télécharger..

Décrivez votre produit. Utilisez toutes sortes de mots grands, fantaisistes et citadins.


Cliquez sur le bouton "Options de fichier" pour ajouter les fichiers supplémentaires de votre choix. Si vous avez oublié de compresser votre produit, n'hésitez pas à télécharger des fichiers supplémentaires qui lui sont associés maintenant..

Enregistrer les modifications, cliquez sur publier et saisissez votre http://gum.co/**** lien. Maintenant, vous pouvez partager ce lien avec n'importe qui et voir votre produit. Ils pourraient acheter votre projet si vous remplissiez vos informations de paiement, mais examinons tout ce que nous pouvons contrôler avant de commencer à vendre. Vous pourriez voir quelque chose que vous aimeriez utiliser.

Inventaire, règles d'expédition, formulaires de commande personnalisables, bons de réduction et variantes

L'onglet Options contient de nombreux éléments, compte tenu de son apparence compacte et propre. Vous pouvez changer le permalien de l’article que vous vendez (si le permalien n’a pas déjà été utilisé - je me demande si http://gum.co/gumroad-tutorial est disponible, ces gars-là ne me paient pas assez! I je plaisante - je vais retourner au travail maintenant Ian, monsieur! renifler)


Par défaut, vous pouvez livrer une quantité illimitée de votre produit. C'est bien si vous vendez des produits électroniques, mais si vous avez des biens physiques à expédier, vous devez absolument "limiter les ventes à" quelque chose de moins que l'infini..

Si vous ne souhaitez expédier que vers un pays donné, vous pouvez également le modifier..

Vous avez une page de profil qui est à http://gumroad.com/VotreNom d'utilisateur. Si vous y allez, vous pouvez voir des informations de profil standard, mais cela montrera également tous les objets que vous vendez. Si vous ne souhaitez pas qu'un produit apparaisse sur cette page, vous devez décocher la case "Visible sur la page du profil"..

Ci-dessous, vous verrez le formulaire d'achat de l'utilisateur. Ce formulaire contient tout ce qu'un acheteur doit remplir avant de valider sa commande. Par défaut, votre produit nécessite uniquement une adresse électronique. Toutefois, si vous envoyez quelque chose, vous voudrez cliquer sur le bouton "Nécessite des informations sur la livraison". Dans cette zone, vous pouvez également spécifier les champs que vous souhaitez collecter lors du processus de paiement..

Vous pouvez maintenant créer des coupons vers lesquels l'utilisateur peut naviguer directement via une URL que vous lui donnez (quelque chose comme http://gum.co/****/MyCouponCode), et si vous cochez la case "Ajouter un champ d'offre pour acheter "case à cocher, tout le monde peut utiliser le code lors du processus de paiement. Il a même une place pour vous de spécifier le nombre de coupons disponibles, de sorte que vous puissiez faire quelque chose comme: "Les 100 premières personnes à utiliser le code coupon" HamburgerSalad "obtiennent 10 $ de réduction sur leur commande."

Enfin, vous pouvez ajouter des "variantes" au produit. Un bon exemple de ceci serait les t-shirts. Avec des variantes, vous pouvez spécifier la taille des t-shirts et, si vous ajoutez une autre catégorie, vous pouvez spécifier la couleur en même temps..

En avant à l'onglet suivant!

Recettes

Les recettes sont belles mais elles sont plutôt ennuyeuses et explicites. Une fois qu'un produit est vendu, l'acheteur pourra cliquer sur un lien figurant sur le reçu pour accéder instantanément à son dossier (en même temps que ce lien lui sera envoyé par courrier électronique). Vous pouvez écrire un message de remerciement ici.


Les acheteurs

Je suppose que ceci est une liste de personnes qui ont acheté le produit, mais pour être honnête, je n’ai encore rien vendu avec Gumroad, je ne peux donc pas être sûr de toutes les informations affichées ici. Je suis prêt à parier que les informations fournies dans le "Formulaire d'achat de l'utilisateur" (sous l'onglet "Options") sont répertoriées ici.

N'hésitez pas à soumettre des captures d'écran. Je n'en ai trouvé aucun. :)

Email clients

Lorsque les acheteurs achètent un produit, un courrier électronique est envoyé à l'acheteur et au vendeur. Le vendeur recevra un courrier électronique "Vous avez vendu ProductName". L'acheteur obtiendra un "Vous avez acheté un produit sur Gumroad!" e-mail avec un lien vers leur téléchargement. Vous pouvez personnaliser cet e-mail ici. Vous pouvez également joindre explicitement le fichier à cet e-mail en cochant la case "Joindre le produit à cet e-mail". C'est également un bon moyen d'envoyer à vos acheteurs un fichier mis à jour. Par exemple, les nouvelles versions d'un livre PDF que vous avez écrit.

Non seulement cela, mais si vous voulez simplement envoyer un courrier électronique à vos acheteurs et les informer de quelque chose, vous pouvez laisser la case décochée et simplement leur envoyer un e-mail..


Configuration des options de paiement

Vous pouvez commencer à vendre votre produit maintenant, mais vous ne pourrez pas être payé tant que vous n'avez pas configuré vos options de paiement. Cliquez sur "Paramètres" en haut à droite, puis "Paiement". Une fois sur cet écran, vous serez invité à saisir les informations de votre compte bancaire. Le faire.


Gumroad vous paiera un vendredi sur deux pour toutes les ventes effectuées jusqu'à une semaine avant cette date. Vous devez avoir au moins 10 $ sur votre compte. Donc, vous devez vendre plus de 10 $ de choses, et attendre le vendredi suivant pour rouler avant d'être payé.

Remarque: Il n’est pas clair pour moi à ce stade que des frais supplémentaires (le cas échéant) générés par l'utilisation de PayPal me soient facturés… Je m'attendrais à ce que des frais normaux s'appliquent, en fonction du type de compte PayPal que vous avez, Faites le nous savoir dans les commentaires!

Vendre votre produit

Maintenant que vous avez configuré votre produit comme vous le souhaitez et que vous avez connecté vos informations bancaires ou PayPal, vous pouvez commencer à vendre. Cliquez sur votre produit et "Publiez-le" si vous ne l'avez pas déjà fait. Regardez dans la barre latérale droite de votre produit et vous verrez maintenant un lien "Partager pour vendre", "Partager sur Facebook", "Tweet" et "Mettre sur votre site"..

Partager c'est aimer

Donnez à n'importe qui le lien "Partager pour vendre" (quelque chose comme http://gum.co/****) et ils seront redirigés vers votre page produit. Si vous souhaitez voir à quoi cela ressemble, visitez le lien. Vous pouvez même personnaliser la couleur de fond et la couleur des boutons de chaque page de produit..


Évidemment, vous pouvez partager ceci sur Facebook ou Twitter avec les liens fournis..

Ajout de produits sur votre site

La zone "Mettez-le sur votre site" contient le code d'intégration du lien, un bouton et une incrustation qui créera une fenêtre contextuelle modale lorsque quelqu'un cliquera sur le lien. Le lien ne concerne évidemment que des liens vers votre page produit. Les codes intégrés de bouton et de superposition contiennent deux fichiers JavaScript différents que vous devez placer au bas de votre code HTML juste avant votre fermeture. étiquette.

Le script de bouton transforme vos liens http://gum.co/**** en boutons de marque Gumroad, ce qui est agréable si vous voulez laisser entendre à l'utilisateur que vous utilisez quelque chose qu'il est peut-être déjà familier et que vous avez un compte. avec.

Le script de superposition est très gentil. Tout lien vers un produit (http://gum.co/****) s'ouvrira dans une fenêtre modale d'iframe qui a l'air plutôt jolie et charge la page de détail de votre produit. C’est ainsi que vous transformez votre magasin HTML en un magasin réel avec des objets réels en quelques minutes. Incluez simplement la balise de script de superposition au bas de la page et remplissez vos balises d'ancrage avec des liens vers vos pages de produits. Gumroad fait le reste. Ça ne devient pas plus facile que ça.

Suivi de vos ventes

Si vous avez du mal à faire des ventes ou si vous êtes simplement curieux, vous pouvez consulter le lien "Analytics" en haut de la page. Cela vous mènera à une section où vous pouvez voir:

  • Dans quelle mesure avez-vous réussi au fil du temps (perdez-vous des clients? Peut-être qu'il est temps de mettre à niveau ou de mettre un nouveau produit?)
  • Quel est votre taux de conversion (les gens craignent-ils votre image de couverture, votre description ou votre prix?)
  • D'où viennent vos utilisateurs (êtes-vous gros au Japon? Peut-être devriez-vous créer des coupons en japonais pour montrer votre appréciation).
  • Et enfin, quelques analyses de parrainage (obtenez-vous la plupart de vos acheteurs sur Facebook, Google ou votre blog? Découvrez ce qui vous sert le mieux et exploitez-le au maximum).

Vous pouvez également sélectionner une plage de temps spécifique et filtrer vos résultats en fonction de certains produits..


Personnaliser votre profil

Cliquez sur le lien "Paramètres" en haut de la page. Une fois là-bas, vous pourrez éditer des informations de profil génériques vous concernant. ajoutez votre identifiant Google Analytics pour des analyses encore plus approfondies; et si vous cliquez sur le lien "Personnaliser", vous pourrez modifier le comportement de votre page de profil (http://gumroad.com/VotreUsername) et même en personnaliser le style. Le niveau de personnalisation dépend entièrement de votre capacité à inspecter les éléments et à pirater CSS..



Conclusion

Alors c'est tout. J'espère que vous avez apprécié mon premier tutoriel écrit pour Tuts + et que vous envisagerez d'utiliser Gumroad pour tous les sites où votre ami souhaite que vous vendiez son "oeuvre" (bleh), mais vous ne pouvez pas vous embêter avec un système volumineux comme Magento ou WooCommerce..

Gumroad est incroyablement facile à utiliser et très puissant. Cela vous permet de passer moins de temps à vous soucier de votre boutique en ligne et plus de temps à créer ce que vous aimez (vendre).