-
Bannière > Questions / réponses
(misajour le 23 octobre 2008 - Corrections HTML)
Créer une bannière animée libre de droit depuis un site Internet (liens):
(Voir liens dans "Bannière" dans les définitions, colonne de droite: [2)-Définitions])
Créer une bannière animée par sois-même:
Avec le logiciel gratuit Microsoft GifAnimator 1.0
ou le logiciel payant PhotoFiltre 6.15
ou le logiciel payant PhotoFiltre Studio (25
)
ou sous Photoshop pro ([Fenêtre], [Animation])
ou sous Paint Shop pro 5 (ou autre versions)
ou sous Motion artist 2 (Anglais - Flash)
ou avec EasyBanner 4 téléchargeable (http://www.easy-banner.net/)
Format d'une bannière fixe:
De préférence .png (PNG 8) s'il s'agit d'une composition graphique ou .jpg (JPEG) s'il s'agit d'une photo.
Le PNG 24 n'est pas encore compatible avec tous les navigateurs Internet.
(Du moins les effets de transparence ne passent pas)
Formats courants d'une bannière animée:
.gif (GIF) ou .swf (FLASH)
Importer une bannière fixe dans son blog(g) sur Blogg.org:
1) [Modification de mise en page]
2) [Bloc B]
3) [Image/motif en arrière plan]
4) [Parcourir]
5) modifier si nécessaire [Répeter l'image ou le motif]
et/ou [Positionner l'image ou le motif...]
6) [Modifier apparence]
Importer une bannière animée sur son blog(g) sur Blogg.org:
1) Important, les images que vous copiez sur votre blog(g) via l'administration simplifiée sont
automatiquement misenformes par Blogg.org, ce qui gèle l'animation...
2) Que ce soit du GIF ou du FLASH, il faut implanter l'adresse URL de l'image dans le fichier CSS...
(Voir le dossier CSS sur Sos Blogg)
3) Il faut donc soit utiliser un serveur extérieur à votre blog(g) pour obtenir une adresse URL
(Localisant l'emplacement de l'image sur le serveur)
4) Soit créer un billet spécialement pour l'occasion (Il ne faudra plus l'effacer ensuite !)...
(C'est ce que j'ai fait: voir le billet "Bannière animée SOS BLOGG" dans le dossier [Bannière])
5) Le plus simple étant, si vraiment vous n'y arrivez pas, d'envoyer l'adresse URL de l'image
à Thomas de Blogg.org(1) en lui précisant bien qu'il sagit de votre nouvelle bannière et les références
de votre blog(g), identifiant, adresses du blog(g) et adresse mail...
(Sous réserve qu'il ne soit pas submergé par les demandes)
6) Une fois que vous avez importé votre "bannière animée".gif dans le billet...
(Avec l'outil de l'éditeur de texte [Parcourir...])
7) Et que vous avez nommé le billet, passez un [espace] dans le corps du billet [Shift]+[Espace],
et cliquez sur [Publier]...
8) Il faut glisser l'image animée avec la souris (en maintenant appuyé le clic gauche)
dans le corps même du billet.
9) Et supprimer l'image en entête (Celle parcourue) maintenant en double (Avant de valider !)...
(Ce qui ne supprime pas la copie dans le corps du billet bien sûr)
10) Faites "clic droit" sur l'image restée seule dans le corps du billet...
(Celle-ci doit s'animer dans le billet - Ci c'est pas le cas, c'est qu'il y a un problème !)
11) Choisissez "[Propriété]"...
12) Copier l'adresse URL de l'image dans la fenêtre qui vient de s'ouvrir ([Ctrl]+[A] ; [Ctrl]+[C])...
(Sous Internet Explorer 7 ça marche - Sous Firefox faut peut-être passé par le [HTML]
dans l'éditeur de texte, ...au-dessus du billet ?)
13) Voici les lignes à ajouter dans le fichier CSS (blog(g) Blogg.org V2)
Il vous faudra être patient(e) et faire des sauvegardes de 1)-votre image animée, 2)-du fichier CSS
(word ou bloc note) pour la version d'origine et 3)-du fichier modifié différemment nommé.
(En vert ce qui existe déjà, en orange ce qui existe peut-être si une image fixe existe déjà
et en bleu l'URL qu'il faut ajouter ou remplacer):
body {
margin: (Taille de la marge);
background-image: url(http: //images.blog-24.com/( 3numéros ).gif);
background-position:top;
background-repeat:no-repeat;background-color: #(6 chiffres de la couleur du fond du blog);
14) Une fois le CSS validé, il ne faut plus effacer l'image sur le serveur ou sur le billet.
(Mais vous pourrez la remplacer par la suite de la même manière)
15) Il se peut que, si le billet a bougé (date modifiée), il faille alors mettre la nouvelle adresse URL
de l'image dans le fichier CSS.
16) Attention: à chaque nouvelle modification d'images dans [Modification de mise en page],
la bannière est supprimée, il faut alors recoller les lignes de code ci-dessus.
Ne collez pas tout le CSS précédemment sauvegardé, car ce sont vos anciennes images
et anciennes configurations qui y figurent.
Il ne faut vraiment coller que les parties en orange et bleu.
(La partie en vert figurant normalement par défault quand il n'y a pas d'image en haut de blog(g),
ce qui permet aussi de repérer l'emplacement dans le CSS).
17) Par la suite, si vous voulez changer la bannière animée en elle même,
il vous suffira de supprimer l'image en place et de charger la nouvelle [parcourir...]
sans avoir besoin glisser cette nouvelle dans le billet; juste valider celui-ci.
Si l'image est plus grosse que ce qui est toléré par le billet, elle ne s'affichera pas dans celui-ci,
Mais le billet dira qu'il a bien été modifié. En effet l'image est présente maintenant sur le serveur
de Blogg.org, et en haut de votre blog(g) !
Importer une bannière animée sur son blog(g) sur certains autres sites de blog:
Solution 1) Il s'uffit d'importer votre animation gif ou flash en guise de bannière.
Solution 2) La bannière se gère depuis le fichier CSS en ajoutant quelques lignes
pour l'image et son adresse URL préalablement créée.
Solution 3) La méthode pour Blogg.org ci-dessus est peut-être valable pour vous ?
Liens:
(1) Intervention technique Blogg.org: thomas@kgbo.com
Notes:
Lorsque ce billet sera suffisamment complet je créerai un billet "Bug", un billet "Bannières animées" et un billet "Special Bannières photo".
(J'ai ajouté quelques liens à "Bannière" dans les définitions, colonne de droite: [3)-Dictionnaire])
Questions:
1) Si vous arrivez à créer une bannière animée, expliquez moi en com' la manière
dont vous avez procédé, MERCI.
2) Est-ce que quelqu'un sait si sous Photoshop family il est possible de créer une animation ?
3) Le symbol "Euro" ne passe pas dans mon billet... étrange ?
(Je suis obligé de l'écrire en toute lettre !!! ou alors coller une image !!!)
4) Vous avez une précision à apporter ?
Tags : bannière, animer-Bannière
-
Commentaires
Dépanner et optimiser son blog - Time binding
Suivre le flux RSS des commentaires
Ajouter un commentaire
Créer mon blog