2016
Tutoriel WIX Développeur
Dimitri PIANETA
Table des matières I) Présentations : ......................................................................................3
II) Tarifications : .......................................................................................3
III) Création d’un site web : ..........................................................................4
IV) Ce logger sur site déjà crée : ....................................................................6
V) Présentation de l’éditeur : .......................................................................8
VI) Comment créer un domaine ? .................................................................. 35
Tutoriel WIX
I) Présentations :
Wix.com est une plateforme de développement Web basée sur le Cloud qui réunit des millions
d’utilisateurs à travers le monde. Wix permet à chacun de créer facilement un site de qualité
professionnelle. Aucune connaissance en programmation n’est nécessaire pour créer votre site.
Wix est disponible gratuitement sans limites dans le temps, mais si vous avez besoin de services
professionnels, comme avoir votre propre nom de domaine ou bénéficier d’une assistance prioritaire,
il est possible de choisir parmi quatre forfaits premium, allant de « Connect Domain » à « eCommerce
».
II) Tarifications :
Tutoriel WIX
III) Création d’un site web :
Étape 1 : Inscription Aller sur : http://fr.wix.com/ Cliquez sur « Commencez Maintenant »
Vous arrivez sur une page ou vous devez vous connectez. Vous avez le choix de vous créer un compte,
ou de vous connecter avec Facebook ou Google+.
Tutoriel WIX
Étape 2 : Bienvenue sur Wix
Choisissez un thème, puis cliquez sur « OK ».
Sélectionnez le « Template » qui vous plait. Un template est un modèle de site déjà en forme, ou il vous reste plus qu’à ajouter vos textes et photos. Cliquez dessus.
Tutoriel WIX
Une nouvelle page s’ouvre : Vous pouvez vérifier si le modèle vous plaît avant de le sélectionner. Si oui cliquez sur « Modifier ce site »
IV) Ce logger sur site déjà crée :
Étape 1 : aller sur http://fr.wix.com/
Tutoriel WIX
Étape 2 : aller sur connecter
Étape 3 : la plateforme de contrôle
Tutoriel WIX
Étape 4 : Cliquez sur modifier
Voici éditeur de page web.
V)Présentation de l’éditeur :
5.1) Éditeur :
1 2
3
4
5
Tutoriel WIX
Menu : de la gestion des pages, de la création de page HTML, gestion du site
Sauvegarde du projet web, Aperçu du site et publier
Onglets d’objets pour créer les éléments pour les pages
Les pages web
Gestions du positionnement des objets dans la page web
5.2) Le menu (1) :
Cliquez sur
Puis un volet avec vos pages
1
2
3
4
5
Tutoriel WIX
Si vous voulez créer une nouvelle page cliquez sur « Ajouter Page »
Le menu SITE : Les onglets sont les éléments pour gérer le site web comme la sauvegarde, aperçu,
publier, voir site publié…
Tutoriel WIX
Le menu Outils : La gestion des options de l’interface de développement
Le menu Aide :
Tutoriel WIX
5.3) Le menu (2) :
Dézoomer Rétablir sauvegarde aperçu du site publier le site
Annuler Format de l’éditeur ordinateur ou mobile
5.4) Le menu (3) :
C’est la zone qui permet de modifier et de créer la page web.
1er choix de l’arrière-plan : le contenu en fond de la page web
Tutoriel WIX
La première étape : choisir si vous voulez mettre en fond sur vos pages web ou une seule page
Vous avez le choix sur trois paramètres : la couleur du fond, image de fond, ou mettre une vidéo au
fond
Après le choix,
Cliquez sur le bouton suivant :
Vous avez le choix sur les pages : cliquez pour toutes les pages soient appliquées l’arrière-plan ou
sur la page souhaiter
Tutoriel WIX
2ème choix : Ajout de contenu
Je vais décrire l’ensemble des éléments que nous pouvons utiliser.
TEXTE
Texte assorti : sont un éventail des possibilités rapides de zone de texte
Titres : zone de texte de titre équivalent à html5 (<h1> </h1>, <h2></h2>….)
Paragraphe : zone de paragraphe équivalent à html5(<p> </p>)
Exemple : (Titre)
Tutoriel WIX
Pour modifier le texte cliquez sur le bouton Modifier texte, puis une fenêtre de paramètre apparait.
Exemple : (Paragraphe)
Identique que l’exemple de titre
IMAGE
C’est la zone pour afficher une image
dans sa page internet.
Thèmes du titre la grosseur de la police et autres
paramètres rapide
La police du texte
Taille de la police du texte
Gras (B), Italique(I), Souligné (U), couleur du texte,
couleur soulignement, lien hypertexte,
Alignements, Puces, Réduire/augmenter la marge
Effets sur le texte
Espacement du texte
Tutoriel WIX
Exemple : Charger une image d’un répertoire de l’ordinateur
1. Aller sur
2. Choisir une image que vous avez sauvegarder :
3. Cliquez sur l’image pour la sélectionnée soit deux cliques de la souris gauche ou sur le bouton
Ajouter à la Page
4. Si vous voulez mettre une nouvelle image, cliquez sur « Télécharger images »
Tutoriel WIX
GALERIE
C’est la zone pour créer une galerie d’image.
Exemple :
1. Changer images : cliquez sur le bon charger images
2. Une fenêtre apparaît de gestion des images
Tutoriel WIX
Pour ajouter une image cliquez sur ajouter images puis sélectionner une image à droite, il
est possible de mettre un titre, un lien hypertexte, description.
Pour supprimer une image, sélectionner l’image puis appuyez sur la corbeille.
Tutoriel WIX
BOUTON
C’est la zone pour créer un bouton. Il y a un grand nombre de bouton à choisir.
Exemple :
Par exemple modifier le texte du bouton, cliquez sur « Changer texte »
Tutoriel WIX
On souhaite par exemple, mettre en lien ouverture ou téléchargement du pdf.
Allez sur la zone « Ajouter un lien », la fenêtre est la suivante
Page/ancre est le lien dans les pages de votre site web
Adresse internet : mettre un lien d’un url d’un autre site web
Document : mettre un document que vous avez sauvegarder dans notre espace
Haut de page : pour revenir en haut de page web
Bas de page : pour aller en bas de page web
Tutoriel WIX
Ici pour mon exemple, je souhaite mettre un document pdf :
Puis sur Choisir fichier, une fenêtre suivante s’affiche :
Soit vous avez sauvegarder un fichier donc sélectionner le fichier que vous voulez mettre dans le
bouton, puis deux cliques ou sur appliquer.
Soit mettre un nouveau document donc aller Télécharger documents. Puis mettre le document qui
va se télécharger, puis sélectionner puis cliquez deux fois.
Tutoriel WIX
Puis en fin faite « Terminé »
Exemple 2 : Changer que le lien
Cliquez sur
Puis même étape que l’exemple 1.
Tutoriel WIX
BOITE
Sont des zones containers qui permet de mettre par exemple après une zone de texte.
Tutoriel WIX
BANDE
Sont des bandes qui permet de faire des entêtes du sites ou autres parties dans le site.
Tutoriel WIX
FORME
Sont des formes pour mettre dans la page.
Tutoriel WIX
VIDEO
Mettre une vidéo sur le site soit par Youtube, Vimeo.
Tutoriel WIX
MUSIQUE
Mettre un morceau ou des morceaux de musique. Il possible de choisir son lecteur de musique.
Exemple :
1) Choisir le lecteur que vous voulez mettre
2) Puis la fenêtre de vos fichiers sauvegardés ou mettre un nouveau fichier « Télécharger
morceaux)
Tutoriel WIX
Réseaux Sociaux
Sont les icônes pour faire les liens avec les réseaux sociaux.
Tutoriel WIX
Contact
Sont les différents formulaires pour envoyer des mails ou la carte google map.
Exemple : Formulaire de mail
1) Allez sur Configurer votre e-mail
pour marquer votre mail
Tutoriel WIX
Exemple : Google map
1) Allez sur changer adresse
2) Puis la fenêtre suivante :
Tutoriel WIX
Menu
Choix du menu soit menu Horizontal ou vertical.
Tutoriel WIX
Liste
Sont une liste de paraphe selon une certaine forme.
BLOG
Faire un blog.
PLUS
Sont des éléments en plus comme mettre du code HTML, FLASH, Bouton PayPal, bouton documents.
Tutoriel WIX
3ème choix : Mettre des gadgets
Il est possible d’acheter ou mettre des gadgets gratuits sur votre site.
Tutoriel WIX
4ème choix : Gestions des téléchargements (en gros le cloud de Wix)
5ème choix : Gestion du blog
Tutoriel WIX
5.5) Le menu (4) :
C’est la zone de fabrication de la page web avec les composants du menu (3).
VI) Comment créer un domaine ?
Prix D'un Domaine Wix Après la Première Année Gratuite
Lorsque vous achetez un domaine Wix en utilisant un bon d'achat pour un domaine gratuit,
le bon d'achat inclut une souscription gratuite pour un pour un domaine.
Apres la première année, le prix du renouvellement de votre domaine Wix varie entre 14.95 et
15.95 euros pour la seconde année (par année).
Gardez à l'esprit que ce prix n'inclut pas les facteurs suivants :
Le type d'extension du domaine Votre devise locale Le nombre d'années sélectionnée Ajout de l'inscription privée Vos lois fiscales ou de TVA locales
Pour contrôler le coût du renouvellement :
1. Connectez-vous à votre compte Wix. 2. En haut à droite, placez votre souris sur le panneau d'utilisateur. 3. Cliquez sur Facturation et paiements. 4. Sous Souscriptions de Domaines, à côté du domaine concerné, cliquez sur Gérer. 5. Cliquez sur Afficher à côté de Montant prochain paiement.
Acheter un domaine chez Wix
Pour acheter un domaine :
1. Cliquez sur Site dans la barre supérieure de l'Éditeur. 2. Cliquez sur Connecter domaine. 3. Cliquez sur Obtenez un nouveau nom de domaine.
Remarque : Si vous n'avez pas encore acheté un forfait Premium pour votre site, vous serez invité à en acheter un.
4. Cliquez sur Acheter un nouveau nom de domaine, ou si vous avez déjà un domaine, cliquez sur Ajouter domaine puis cliquez sur Acheter un nouveau nom de domaine
5. Saisissez le nom de domaine dans la barre de recherche. 6. Cliquez sur Rechercher.
Tutoriel WIX
7. Si le domaine est disponible, cliquez sur Obtenir pour l'enregistrer avec Wix. Remarque : Si le domaine n'est pas disponible, retournez à l'étape 5 et essayez avec un autre domaine ou une autre extension.
8. Choisissez la période d'inscription. 9. Cliquez sur Continuer. 10. Saisissez (ou modifiez) vos coordonnées de contact. 11. Cliquez sur Continuer. 12. Sélectionnez une option d'inscription :
o Inscription privée : Vos coordonnées de contact n'apparaîtront pas dans les informations de votre domaine sur WHOIS. Vous pouvez activer ou désactiver l'inscription privée quand vous le souhaitez.
o Inscription publique : Vos informations resteront accessibles publiquement sur WHOIS. Vous ne pouvez pas modifier cette inscription en privée, même lors du renouvellement.
13. Cliquez sur Continuer. 14. Sélectionnez votre méthode de paiement.
Remarque : Lorsque vous atteignez l'écran de paiement, assurez-vous que le bon de réduction est affiché sur le côté droit.
15. Cliquez sur Valider l'achat.
Suggestion : Cliquez ici pour en savoir plus sur le choix du nom de domaine le plus
pertinent pour vous.
Remarque : Pour connecter votre domaine, cliquez ici.
Tutoriel WIX
Edition 2016
Site dimitripianeta.fr