Ajouter un effet tourne page à son blog
Posté par Demolite le Vendredi 18 décembre 2009 Dans Divers Web, Tuto en vidéo, WordPress 958 LecturesC’est quoi encore ce truc ?
Pour visualiser l’effet allez donc faire un petit tour sur mon autre blog…
Je n’ai pas installé cet effet sur ce blog, car ma bannière étant en flash, l’effet se place en dessous et ça n’a donc plus grand intérêt…
Par contre si vous êtes sur Wordpress et que votre bannière n’est pas en Flash, vous pouvez l’installer.
Sur Canalblog, même avec une bannière flash, ça marche…mais ne me demandez pas pourquoi.
Copier l’adresse suivante :
http://storage.canalblog.com/65/20/251752/47593114.js
Sélectionnez-la, clic droit puis copier
Allez ensuite dans la barre d’adresse de votre navigateur internet puis faites Coller et Enter.
Une page blanche comme celle-ci va s’ouvrir…avec le contenu du fichier Js.
Vous devez modifier seulement les 3 adresses en bleues, en changeant les adresses des images pour mettre les votre à la place et aussi l’adresse web de redirection (celle qui envoie vers un autre blog ou site).
Faites Fichier/Enregistrer sous… pour enregistrer le fichier Js sur votre pc.
Ensuite ouvrez-le en cliquant droit dessus et en sélectionnant Ouvrir avec/Bloc-notes ou Modifier pour certains.
Vous n’êtes pas obligé de changer le nom du fichier, mais vous pouvez le faire quand même.
Une fois qu’il est ouvert dans le bloc-notes, vous devez copier puis coller l’ adresse de l’image de fond dans votre navigateur internet pour l’ouvrir, cliquer droit dessus et l’enregistrer sur votre pc.
Vous devez maintenant l’ouvrir avec Photofiltre ou un autre logiciel de retouche pour la modifier à votre goût, mais vous devez garder les dimensions et aussi respecter la position du cadre avec le texte, sinon lorsque la page se tournera votre texte ne sera plus visible en entier…Enregistrez votre image.
Voici un petit tuto en vidéo sans le son (because j’ai un rhume de dingue) qui vous aidera à modifier le fond :
Pour l’image de l’angle, vous pouvez mettre ce que vous voulez du moment que vous gardez à peu près les mêmes dimensions.
Importez les deux images dans un nouveau message pour en récupérer leur adresse.
Retournez dans le bloc-notes et mettez les nouvelles adresses de vos images dans le fichier Js.
Pour finir vous devez changer l’adresse de redirection et en mettre une autre à la place, si vous ne voulez pas mettre d’adresse, mettez # à la place de l’adresse.
Maintenant vous devez enregistrer votre fichier Js, en cliquant sur Fichier/Enregistrer il va écraser l’ancien.
Vous devez récupérer l’adresse de ce fichier Js en l’important dans un message (Chez Canalblog dans “Insertion d’un fichier”) puis en copiant son adresse en mode html.
Il ne vous reste plus qu’à copier/coller cette adresse dans le script ci-dessous et de copier/coller ce script dans votre page d’accueil (Chez Canalblog) ou dans le header.php sur Wordpress.
<script type="text/javascript"src="http://storage.canalblog.com/65/20/251752/47593114.js"></script>
…
Chez Canalblog ou sur Wordpress collez le script au dessus de la balise </head>
Voilà…c’est tout.
eh bé , comme on dit chez nous , on n’est pas rendu .
je vais essayer sur un vieux blog pour limiter la casse
J’aime bien ton ” voilà c’est tt ”
je vais essayer qd m^ car ça me plaît bien mais gare à la prise de tête
à +
ça commence fort , 2eme opération , je suis déjà bloquée , je n’ai pas de proposition “ouvrir ds bloc-note” , j’avais ça sur mon vieux window xp et là sur mon vista , nothing , y-a-t-il un rapport?
Qu’es ce tu racontes ?
T’es sure que tu fais bien un clic droit sur le fichier ?
et ensuite “ouvrir avec”
Moi aussi j’ai Vista
OUI je suis sure , je viens de trouver mais en cliquant sur modifier et ça m’ouvre sur bloc-note ???????????
je continue , si je peux
ça y est , j’ai avancé :je l’ai placé mais je ne sais pas trop comment le décorer et puis je vois ta petite tête noire au début
C’est normal…tu n’as pas changé la deuxième adresse dans le fichier Js…
A quoi ça sert que je me décarcasse à faire des tuto si tu les lis en diagonale
La fessée !!!
pardon
, là c’est mieux mais c’est pas encore ça 
T’es vraiment terrible toi !
T’as de la chance que je t’ai pas à portée de main…ou de pied car je t’en mettrai bien un aux fesses quand même !
Bourrique va…
Heureusement que je précise qu’il ne faut changer les dimensions de la page avec le pavé de texte…si tu l’agrandis…c’est normal que ça dépasse,
pour ton image en haut, ça doit être une maison non ?
Trop grande…
En tout cas tu dois bien t’amuser à recharger les images à chaque fois dans le fichier js…
Morte de rire !!!
bon là c’est parfait , j’ai m^ mis en coin un fond scintillant pour attirer le regard , pas mal ? non ? qd à changer les dimensions , c’était pas ça le pb , c’était que le dessin était trop à gauche si je le plaçais au milieu sur photofiltre et puis après il était trop à droite alors effectivement ………mais pourquoi faire simple qd on peut faire compliqué
bises et sans rancune
Bonjour,
J’essaie de faire un effet tourne page sur un blog d’essai.
J’ai récupéré l’adresse URL du fichier Js,mais je bute pour trouver l’adresse HTML….Au secours….
Félicitation pout le blog,il est vraiment magnifique….
Jean-marc
Salut,
Tu importes le fichier Js dans un nouveau message, comme si tu voulais le mettre dans un article, tu passes par l’icône “insertion d’un fichier” à côté de celle pour insérer les images, une fois le lien importé dans ton message, tu cliques sur l’icône <> (à côté des autres) qui permet de passer le message en htlm et la tu peux récupérer l’adresse de ton fichier js…
Bonjour,
Yesssssssssss !!!!!!!!!!Ca marche,ça marche.
Plus qu’à peaufiner l’image de fond.
J’ai eu le même pb que Chritine (Dans tes commentaires),pour ouvrir dans “Bloc Note”,j’ai fais “Modifier”(Sous Vista aussi).
Quand j’aurai fini,je te donnerai l’adresse du site d’essai.
Vraiment merci pour tout.
Bon Noël.
Passe de bonnes fëtes de fin d’année.
Jean-Marc ( Le MANS )
J’ai ajouté “Modifier” dans mon tuto…
C’est bizarre car j’ai Vista aussi.
Excellent ! Je garde sous le coude…
Merci !
PS J’adore le design de votre site, le turquoise est ma couleur favorite…
Voilà, c’est fait! Merci beaucoup. Il ne me reste plus qu’à écrire mon article de nouvelle année pour faire un lien.
Bravo pour tous les bons tuyaux. Je passe souvent essayer des petits trucs même si je ne les mets pas tous en ligne ensuite.
A++
Bonjour ,
on vera bien
je tenais a te remercier car vraiment ton blog m aide beaucoup
bon juste que je suis un peu nul , mais ton tuto ma bien aider
l effet est presque réussi , sauf que l on en vois pas le tete de mon emoticone au debut
mais bon , je vais recommencer
salut ! je voulais essayer de l’installer chez moi mais est ce que ça fonctionne sur les blogs over ?
Hello,
Je ne sais pas, je ne connais pas du tout cet plateforme, mais normalement ça devrait marcher…
As tu essayé de mettre le script à un endroit différent dans ta page ?
Salut Demolite!! Merci pour ce tuto et tout ton site! j ai pu installer l effet tourne page sur mon blog et ca fait un super effet! De mon coté j ai tout de meme remarqué que cette animation ne marchait que sous Mozilla et non sous Explorer pour mon blog. J essaie de chercher la faille mais je ne trouve pas. Aurais tu une idee du pourquoi du comment? Merci, A+
Hello,
Bizarre car chez moi ça marche sur les deux navigateurs…
http://demolitetuto.canalblog.com/
Ouvres ce lien avec explorer et tu verras, tu as peut être fait une erreur quelque part…
Salut,
merci pour ce tuto, et pour tout ce qu’on peut trouver sur tes sites. Super boulot, et explications au top.
Je prépare un passage en mode avancé pour intégrer une bannière pub cliquable dans la tétière, et j’ai trouvé tout ce qu’il me faut.
Coucou,
Moi je n’ai pas encore essayé, mais je peux constater que ça fonctionne avec le navigateur Chrome pour les blogs qui l’ont installé.
Avant de tenter, je voulais savoir si ça marche avec le mode normal ou s’il faut passer en mode avancé ?
Merci.
Marie
Hello,
Il faut être en mode avancé
Salut démolite, pour ceux qui arrive pas à ouvrir le script, au lieu de faire “ouvrir avec”, lancer bloc note, fichier ouvrir, chercher votre fichier.js et “ouvrir”
Sinon, avec canalblog, en mode standard, créér un nouveau message, clic sur pour passer en mode html, coller le script une fois que vous avez tout personnaliser, clic sur “brouillon”, et “poster”! J’ai testé, ça gaze!
Houps, je me suis trompé, faut pas mettre le message en “brouillon”, juste normal,
trop cool je te remercie je vais essayer
Chère Démolite,
puis quand on comprend le truc des deux images, 
tutto va bene!
De bon matin, j’ai réussi à faire tourner ma page d’accueil de Bellitalie. Au début le script nous effraie,
Encore un grand merci à toi pour tout ce que tu fais. Grazie Mille
On me félicite pour mon blog sportif mais tout ça c’est grâce à toi et à tes tutos.
Mais là, j’ai beau essayé de copier ton adresse dans mon navigateur, aucune page s’affiche, un fichier à exécuter s’ouvre je clique dessus et ça me mets erreur
Je n’ai pas compris ton message Nel ?
De quelle adresse parle tu ?
Mes excuses, je parlais de l’adresse pour ton tuto “effet tourne page”
http://storage.canalblog.com/65/20/251752/47593114.js
j’ai beau essayé dans tous les sens, rie, niet, nada !!
encore quelques heures devant moi a essayer de comprendre
Heu…bizarre !
Il te propose pas d’ouvrir ou d’enregistrer ?
Si, absolument, mais aussitôt derrière un message d’erreur s’affiche et obliger de fermer, serait-ce parce que je suis sur IE et pas MF ?
Bouge pas je t’envoie le fichier par mail…