► Créer une bannière interactive en bois pour blog ◄
Catégorie : Webdesign Logiciel : Photofiltre 6 Difficulté : Moyen Temps : 15 minutes
Cette bannière imitation bois convient parfaitement pour un blog,
tu peux ajouter les liens de ton choix sur les boutons.
---------------------------------------------------- PARTIE 1 ----------------------------------------------------
CRÉER LE MORCEAU DE BOIS
1 - Ouvre Photofiltre puis ouvre un nouveau document vierge en allant dans Fichier / Nouveau. Choisis ses dimensions : je te conseille 600x60 ou 760x76, cela dépend de la largeur de ton blog. Clique sur Ok.
2 - Nous allons commencer par créer la forme de ton morceau de bois : clique sur l'Outil de sélection Polygone (à droite de l'écran, survole les icônes pour voir leur nom) puis réalise sur ton document une sélection qui ressemble à ça (le trait noir) :
N'hésite pas à zoomer à l'aide de la molette de ta souris
3 - Une fois ta sélection refermée, va dans Sélection / Centrer la sélection / Dans l'image.
4 - Mets la couleur Noire à l'arrière du sélecteur de couleurs en faisant un clic-droit sur la couleur Noire dans la petite palette en haut à droite de ton écran. Appuie sur la touche Suppr de ton clavier.
5 - Fais Ctrl+D suivi de Ctrl+U.
6 - Clique sur ce lien pour ouvrir une texture bois. Fais un clic-droit dessus, choisis Copier l'image puis retourne dans Photofiltre.
7 - Va dans Edition / Coller. Va dans Filtre / Effet d'optique / Flou artistique.
8 - Fais Ctrl+C puis 2 fois Ctrl+Z et va dans Edition / Collage spécial / Assembler le collage, coche la case Gauche et clique sur Ok.
9 - Retourne sur l'autre image avec la forme noire (celle qui est restée seule).
10 - Mets la couleur Blanche à l'avant du sélecteur de couleurs en faisant un clic-gauche sur la couleur Blanche dans la petite palette en haut à droite de ton écran.
11 - Va dans Filtre / Couleur / Filtre coloré, mets la couleur Blanche à 50% et clique sur Ok.
12 - Fais Ctrl+C et Ctrl+Z puis va dans Edition / Collage spécial / Masque. Appuie 2 fois sur la flèche Gauche ◄ de ton clavier puis 2 fois sur la flèche Haute ▲ . Valide avec la touche Entrée.
13 - Va dans Filtre / Couleur / Filtre coloré, mets la couleur Blanche à 70% et clique sur Ok.
14 - Va dans Fichier / Nouveau, ne change rien des paramètres et clique sur Ok.
15 - Tu dois maintenant avoir trois images. Retourne sur la double image (avec la texture bois accrochée) et fais Ctrl+C. Ferme cette image sans la sauvegarder en cliquant sur sa petite croix et en cliquant sur Non.
16 - Rends-toi sur l'image blanche et va dans Edition / Collage spécial / Image et masque associés. Appuie sur la touche Entrée.
17 - Clique sur la petite double-flèche tout en haut, à droite de ton écran, près de la palette, pour faire passer la couleur Noire au premier-plan.
18 - Retourne sur l'image avec ta forme en gris clair et fais Ctrl+C puis ferme-la sans la sauvegarder en cliquant sur sa petite croix et en cliquant sur Non.
19 - Va dans Edition / Collage spécial / Masque. Appuie sur la touche Entrée. Tu dois n'avoir plus qu'une seule image, celle avec ta planche de bois.
---------------------------------------------------- PARTIE 2 ----------------------------------------------------
AJOUTER LE TEXTE
20 - Fais Ctrl+T pour ouvrir l'Outil Texte. Écris d'abord le nom de tes différents boutons (nombre variable) dans la zone de Saisie en les séparant chacun de 6 espaces. Par exemple :
Accueil Logiciels Sommaire Suis-Moi Ma Playlist
21 - Choisis ta police d'écriture (j'ai utilisé Amatic dans mon exemple mais tu peux en prendre une autre). Pour la couleur, survole ton image derrière la fenêtre "Texte", une pipette apparaît : clique sur le bord sombre en bas de ta forme en bois :
22 - Pour essayer, mets la Taille à 20 et clique sur Ok. Ton texte n'est pas très lisible avec cette couleur mais c'est normal.
23 - Tu dois maintenant faire en sorte que ton texte prenne un maximum de place sur ton morceau de bois, sans en dépasser. Pour cela, fais un double-clic sur la sélection de ton texte et modifie la Taille ou bien le nombre d'espaces entre tes mots (l'idéal est qu'il y ait le même nombre d'espaces entre chaque mot). Re-clique sur Ok pour vérifier et recommence jusqu'à ce que ça te convienne. Ton texte doit être centré dans la page (Sélection / Centrer la sélection / Dans l'image).
24 - Quand tes mots épousent parfaitement le morceau de bois, va dans Sélection / Centrer la sélection / Dans l'image si ce n'est pas déjà fait puis et appuie 2 fois sur la flèche Droite ► de ton clavier puis 2 fois sur la flèche Basse ▼ . Valide avec la touche Entrée.
25 - Refait Ctrl+T puis clique à nouveau sur Ok, appuie à nouveau 2 fois sur la flèche Droite ► de ton clavier puis 2 fois sur la flèche Basse ▼ . Valide avec la touche Entrée. (Superposer deux textes identiques dans Photofiltre permet qu'il soit plus "lissé")
26 - Refait Ctrl+T puis change cette fois ci la Couleur en mettant du Blanc et clique sur Ok.
27 - Refait Ctrl+T et clique sur Ok.
28 - Va dans Réglage / Luminosité / Contraste..., mets la Luminosité à -15%, le Contraste à 100%, en choisissant la Couche Jaune et clique sur Ok.
---------------------------------------------------- PARTIE 3 ----------------------------------------------------
DÉCOUPER L'IMAGE EN PLUSIEURS BOUTONS
29 - Re-clique sur la petite double-flèche tout en haut, à droite de ton écran, près de la palette, pour refaire passer la couleur Noire à l'arrière-plan.
30 - Ton image doit avoir une apparence proche de celle de mon exemple (tout en haut de l'article) mais en un seul bloc. Pour les séparer en plusieurs boutons, suis ces étapes :
31 - Zoome une ou deux fois à l'aide de la molette de ta souris et sélectionne le premier bouton, tout à gauche (voir image ci-dessous) lorsque c'est fait, fais Ctrl+X, ce qui copie ton bouton et le colore en noir.
32 - Va ensuite dans Edition / Coller en tant qu'image. Ton premier bouton est isolé, fais un clic-droit dessus en choisis Enregistrer. Je te conseille de créer un dossier dans lequel tu enregistrera tous le morceaux de ta bannière. Choisis le format PNG pour ne pas perdre de qualité. Je te conseille de les numéroter dans l'ordre (commence par nommer le premier bouton "1"). Clique sur Enregistrer.
33 - Retourne sur ta bannière avec une partie en noir et recommence les mêmes étapes :
• Zoome et sélectionne le bouton suivant précisément, sans dépasser sur la zone noire.
• Fais Ctrl+X puis va dans Edition / Coller en tant qu'image.
• Enregistre le bouton qui apparaît.
34 - Recommence ces étapes avec tous les boutons.
Voilà ! C'est fini !
Ta bannière est prête à être intégrée dans un de tes articles Skyrock :
Pour cela, importe tous les boutons dans l'ordre sur ton article, en ligne et ajoute leur un lien à chacun, correspondant à leur fonction.
N'hésite pas à me poser des questions si tu ne comprends pas une partie de ce tutoriel.
Signale moi si il y a une erreur dans le tutoriel.
© Je me réserve tous les droits sur cette astuce, le plagiat n'est bien évidemment pas toléré.
Vous pouvez tout de même utiliser cette astuce pour une image de votre site/blog.
Evy7707, Posté le dimanche 01 mai 2016 12:18
________☼/)_☼_____☼./¯"""/')
¯¯¯¯¯¯¯¯¯\)☼¯☼¯¯¯¯☼'\_„„„„\
Je te souhaite un bon dimanche de 1 er mai ☼