1/- AJOUTER DES IMAGES DANS LA BIBLIOTHÈQUE DES MÉDIAS. - Cliquer sur «Médias» puis sur l onglet «Bibliothèque». - Cliquer ensuite sur «Ajouter». 1
1 2 - Faire glisser les images à ajouter à l endroit indiqué (1). OU - Sélectionner les fichiers directement dans votre ordinateur (2). - Une fois celle-ci ajoutée, cliquer dessus. 2
- À cet endroit, vous pouvez récupérer l url de l image sélectionnée. 3
2/- CRÉER UNE PAGE. - Cliquer sur «Pages» puis sur l onglet «Toutes les pages». - Cliquer sur «Ajouter». 4
- Taper le Titre de votre page en majuscule. - Cliquer sur «Add New Row». 5
- Cliquer sur «+» pour ajouter une colonne. - Une colonne s est créée. 6
A/- Créer une page standard sur toute la largeur de la page (1colonne). - Cliquer sur le «+» afin d agrandir la colonne au maximum. B/- Créer une page avec trois colonnes. - Cliquer trois fois sur le «+» afin d ajouter trois colonnes. 7
- Puis, cliquer trois fois sur le «+» de chaques colonnes pour les agrandir afin qu elles prennent toute la largeur de la page. (1/3) Retour sur l exemple A/-. - Cliquer sur le «crayon» afin d éditer et paramètrer le contenu de cette colonne. 8
1 2 - Donner un titre à votre colonne. (1) - Cliquer sur le «+ vert» afin d ajouter un élément à l intérieur de cette colonne. (2) - Pour ajouter une image dans votre colonne, sélectionner l icône «Image». 9
1 3 2 4 - Dans cette fenêtre, vous pourrez choisir une image que vous avez déjà ajouté dans la bibliothèque médias en cliquant sur «Browse» ou en écrivant son «url». (1) (voir page 3.) - Dans la case «Size», vous pourrez définir la taille en pixels de votre image. (2) (Si la case est vide, l image se mettra par défaut en pleine page.) - Dans la case «Align», vous pourrez aligner l image sur la gauche, la droite ou encore au centre. (3) - Dans la case «Image Alt», vous pourrez donner un titre à votre image qui sera visible lors du survol de l image. (4) - Après avoir rempli ces différentes cases, cliquer sur «Apply» afin d enregistrer les modifications. (5) 5 10
- Cliquer sur «Apply» afin d enregistrer les modifications. - Cliquer sur le «+» afin d ajouter une colonne. 11
- Cliquer sur le «+» afin d agrandir la colonne au maximum. - Cliquer sur le «crayon» afin d éditer et paramètrer le contenu de cette colonne. 12
1 2 - Donner un titre à votre colonne. (1) - Cliquer sur le «+ vert» afin d ajouter un élément à l intérieur de cette colonne. (2) - Pour ajouter une ligne de séparation dans votre colonne, sélectionner l icône «Divider». 13
- Pour la première ligne de séparation, sélectionner «Dashed Type 1» puis cliquer sur «Apply» pour valider les modifications. 14 - Cliquer sur le «+ vert» afin d ajouter un élément (un titre) à l intérieur de cette colonne.
- Pour ajouter un titre dans votre colonne, sélectionner l icône «Title». 15
1 2 5 3 4 6 - Dans la case «Title Text», taper votre titre. (1) - Dans la case «Font Size», vous pourrez définir la taille en pixels de votre Typographie.(2) - Dans la case «Font Family», vous pourrez choisir la famille de votre Typographie.(3) - Cocher la case «Text Transform Uppercase» afin que votre titre soit en majuscule. (4) - Dans la case «Title Align», sélectionner «left» afin d aligner le texte sur la gauche. (5) - Après avoir rempli ces différentes cases, cliquer sur «Apply» afin d enregistrer les modifications. (6) 16
- Cliquer sur le «+ vert» afin d ajouter un élément (2eme ligne de séparation) à l intérieur de cette colonne. - Pour ajouter la 2eme ligne de séparation dans votre colonne, sélectionner l icône «Divider». 17
- Pour la 2eme bligne de séparation, sélectionner «Solid» puis cliquer sur «Apply» pour valider les modifications. 18 - Cliquer sur «Apply» pour valider les modifications.
- Cliquer sur le «+» afin d ajouter une colonne. - Cliquer sur le «+» afin d agrandir la colonne au maximum. 19
- Cliquer sur le «crayon» afin d éditer et paramètrer le contenu de cette colonne. - Taper votre texte puis cliquer sur «Apply» pour enregistrer les modifications. 20
- Cliquer sur le «Publier» afin de publier la page sur votre site web. 21
- Voici le résultat de votre page web pour l exemple A/-. 22