dimanche, 19 juin 2011

Insérer une bannière hautETfort

C'est peut-être la première question qu'on se pose en créant son blog. La bannière (ou bandeau horizontal) est le principal composant graphique qui personnalise l'habillage du blog.

puce.gifChoisir un modèle pour blog hautETfort et insérer une bannière

  1. Cliquez sur l'onglet PRESENTATION de l'éditeur hautETfort.
  2. Cliquez sur un Modèle.
  3. Cliquez sur Personnaliser
  4. Cliquez sur le bouton Parcourir qui suit la zone Bannière.
  5. Cliquez sur le fichier image que vous voulez afficher en tête du blog. Son emplacement apparaît dans la zone Bannière.
  6. Cliquez sur le bouton Télécharger
  7. Cliquez sur le bouton Utiliser ce modèle

Téléchargez votre bannière, chaque fois que vous changez le modèle, les couleurs ou la police de votre blog. Conservez le fichier image correspondant.

i_blue_sm.jpgCes modèles gratuits ne donnent pas la possibilité de télécharger une bannière.

hautetfort bannière hautetfort bannière

puce.gifQuelles dimensions pour ma bannière?

  1. Pour afficher le modèle choisi, cliquez sur Aperçu
  2. Faites un clic droit sur la bannière standard du modèle.
  3. Cliquez sur la commande Afficher l'image de fond du menu déroulant.
  4. Faites un clic droit sur l'image.
  5. Cliquez sur la commande Propriétés du menu déroulant.
  6. Dans les Propriétés de l'image, les Dimensions indiquent en pixels la longueur et la hauteur de la bannière.

Rien ne vous force à créer une bannière de même taille. Toutefois, ces dimensions sont calculées pour que la bannière s'affiche en harmonie avec les autres composants de l'habillage du blog. Une grande bannière cannibalise les notes du blog, une petite bannière n'aide plus à identifier visuellement le blog.

puce.gifPour bloggueurs avancés

Avec cette première publication qui n'a pas pris une ride, je mets fin avec bonheur aux notes pour bloggueurs hautETfort.  Grâce à elles, une démarche technique a déjà commencé dans mon blog emploi. Cela n'exclut pas la sortie ponctuelle de trucs & astuces. Merci à tous.

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (0)

samedi, 14 mai 2011

Avatar, Gravatar et Favicon pour blog hautETfort

Avatar, Gravatar et Favicon sont les icones qui vous identifient visuellement auprès des bloggueurs.
Je propose de produire chaque icone avec Genfavicon. Free Online Favicon Generator. Icon Generator.

Chargez un fichier JPG/GIF/PNG correspondant à l'icone, en indiquant une adresse URL ou un chemin sur votre PC via le bouton Parcourir
Cliquez sur Upload Image

L'image s'affiche dans le cadre supérieur droit. Glissez-déposez le cadre gris autour de la portion qui va servir d'icone.
Cliquez sur la taille de l'icone clicklist.gif

  • Pour un avatar ou un gravatar, cliquez sur une taille au moins égale à 48x48 pixels
  • Pour un favicon, cliquez sur 16x16 pixels

Cliquez sur Capture&Preview

Observez l'aperçu Favicon. Si le résultat convient, cliquez sur
Download Favicon pour obtenir le favicon de votre blog qui s'affiche dans la barre d'adresse, dans un onglet ou dans les favoris de votre navigateur web.
Download PNG pour obtenir l'avatar qui vous sert de portrait numérique dans les réseaux sociaux et autres communautés.

 

Afficher l'avatar dans le profil de blog

  1. Cliquez sur l'onglet TABLEAU DE BORD de l'éditeur hautEtfort.
  2. Cliquez sur A propos
  3. Parcourir Cliquez pour afficher une Nouvelle photo ou Remplacer la photo en cours.
  4. Double-cliquez sur le fichier associé à l'avatar.
  5. Cliquez sur l'onglet PRESENTATION de l'éditeur hautEtfort.
  6. Cliquez sur Contenu des colonnes
  7. Dans la liste des Eléments, vérifiez que Votre photo s'affiche dans la colonne droite ou gauche.
    Si ce n'est pas le cas, cliquez sur Ajouter. Cliquez pour Mettre à jour les modifications

 

Afficher le gravatar devant vos commentaires

Procédez en deux temps:

  • Activez la fonction Gravatar dans l'éditeur hautEtfort.
  1. Cliquez sur l'onglet TABLEAU DE BORD
  2. Cliquez sur Généralités
  3. Dans les Propriétés d'affichage, demandez à Afficher le gravatar sur les commentaires.
  4. Cliquez pour Mettre à jour les modifications

L'avatar d'un bloggueur non-référencé s'affiche sous la forme d'un icone bleu/blanc dans un blog hautETfort.
protectimage_script.gif

 

Afficher le favicon de votre blog (bloggueurs avancés ET patients)

Chargez le fichier favicon.ico dans votre blog.

  1. Cliquez sur l'onglet TABLEAU DE BORD de l'éditeur hautEtfort.
  2. Cliquez sur Fichiers
  3. Cliquez sur le dossier où vous ajouterez le favicon: files, images ou media
  4. Ajoutez le fichier favicon.ico
  5. Faites un clic droit sur le fichier favicon.ico dans la liste des fichiers du dossier choisi.
  6. Cliquez sur la commande Copier l'adresse du lien similaire à celui-ci:
    http://votreblog.hautetfort.com/media/02/01/favicon.ico
  7. Cliquez sur Configuration avancée dans l'onglet PRESENTATION
  8. Cliquez sur Oui, Je veux aller dans le design avancé.
  9. Cliquez sur Modifier le template face au Modèle de la page d'accueil
  10. Avant la balise </head> insérez ces 2 lignes de code HTML
    <link rel="shortcut icon"
    coller adresse URL du favicon" type="image/x-icon"/>
    <link rel="icon" href="coller
    URL adresse du favicon" type="image/x-icon"/>
  11. Cliquez sur Enregistrer les modifications

Répétez les phases 9 à 11 pour chaque Modèle de la page...

Mille mercis à Lavande pour le tuto d'origine Insérer un favicon - www.blogtuto.org

Cette note vous a-t-elle été utile?

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (0)

mardi, 15 mars 2011

Partager un album photos hautETfort

Anniversaire, communion, mariage, vous allez immortaliser ces moments par des photos numériques.

Voici des façons simples de partager ou pas les albums photos que vous créez dans votre blog.

A vos APN, shootez, publiez ! Beau printemps 2011 !

Les modes A et B permettent à tout visiteur de feuilleter vos albums photos.

Les modes C et D autorisent les lecteurs que vous informez à ouvrir vos albums.

A - Insérer un album dans une note

  1. Cliquez atafoto.jpg
  2. Cliquez sur l'album à insérerMon album
  3. Cliquez sur dans les Options
  4. Valider Cliquez.

Feuilletez l'album en exemple.

B - Afficher un album dans une colonne de blog

  1. Cliquez sur Contenu des colonnes dans l'onglet PRESENTATION
    Les Albums photos figurent dans les Elements de colonne.
  2. Cliquez sur Ajouter à droite/gauche pour afficher les albums dans la colonne correspondante.
  3. Cliquez sur Modifier pour configurer le mode d'affichage.
  4. Cliquez sur le nombre d'albums à Afficher clicklist.gif
  5. Rangez-les dans l'ordre selon lequel Afficher les albums photosmoveup.gifmovedown.gif
  6. Enregistrer Cliquez.
  7. Mettre à jour les informations Cliquez.

Si vous possédez 5 albums et que vous décidez d'en afficher 3 dans la colonne de blog, ce sont les 3 premiers albums qui apparaissent. Voici un moyen de trier albums publics et  albums privés.

C- Partager un album photo en privé

  1. Cliquez sur l'onglet ALBUMS
  2. Face à l'album de votre choix, cliquez sur Voir l'album
  3. Copiez l'adresse http:// de l'album qui s'affiche dans la barre d'adresse de votre navigateur Internet.

Communiquez cette adresse à ceux avec qui vous voulez partager l'album. Plus besoin d'afficher l'album dans une note ou dans une colonne de blog.

D - Partager un album photo par un lien dans une note

Comme décrit ci-dessus, copiez l'adresse http:// de l'album qui s'affiche dans la barre d'adresse de votre navigateur Internet.

  1. Dans la note, sélectionnez le texte sur lequel vous allez posez le lien vers l'album.
  2. insert_link.jpgCliquez.
  3. Collez l'adresse http:// de l'album dans URL du lien
  4. Insérer Cliquez.

Les visiteurs qui cliquent sur le lien découvrent l'album, les autres ne voient rien.

Ne plus partager un album photo

  1. Cliquez sur l'onglet ALBUMS
  2. Face à l'album de votre choix, cliquez sur Mettre l'album hors ligne

L'album n'est plus accessible dans le blog ou par adresse Internet.

Cette note vous a-t-elle été utile?

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (0)

dimanche, 07 novembre 2010

Musique hautETfort ?

m_aa3ab7f817f1438682722a3794c639a3.jpgIl y a un bail, marieblues me demandait comment mettre un lien vers une chanson dans son blog.
Le brouillon de note a fini à la poubelle parce que je ne suis forcément pas pour la musique de blog.

Les goûts et les couleurs, mais aussi les sons ne se discutent pas. Je ne décrirai pas comment faire jouer une musique d'ambiance à l'affichage d'un blog. Cela peut devenir agaçant, comme au supermarché.

Le principe est identique pour tous les services de musique en ligne (Deezer, YouTube, Soundzit, Last, etc.).

so_o.gifInsérer un fichier son dans une note

  1. Sélectionnez une chanson dans le service, copiez le code htm fourni pour intégrer le fichier son dans un blog.
  2. Ajoutez une note dans l'éditeur hautETfort. Tapez le texte.
  3. media.gifCliquez quand vous voulez intégrer un morceau de musique dans la note.
  4. Cliquez sur l'onglet EMBED
  5. Collez le code copié dans le champ Insérer le code de l'embed
  6. Cliquez sur Valider
  7. Pensez à taper le titre et l'interprète du morceau.

Les eaux de mars - Stacey Kent & Diana Krall

so_o.gifInsérer un lien vers un son dans une note

  1. Sélectionnez une chanson dans le service, copiez le lien URL fourni, à intégrer dans une note de blog.
  2. Ajoutez une note dans l'éditeur hautETfort. Tapez le texte.
  3. Sélectionnez le texte sur lequel vous allez poser un lien vers la chanson choisie.
  4. insert_link.jpgCliquez pour créer le lien.
  5. Collez le lien URL dans le champ URL du lien.
  6. Cliquez sur Valider

J'ai pour habitude d'ajouter une petite note orange pour signaler la possibilité d'écouter une chanson en cliquant sur le lien: La vénus du Mélo - Stacey Kentso_o.gif

Aux bloggueurs avancés

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (3)

Cadres et dorures pour photo

J'ai testé trois possibilités d'embellir une image avec un cadre ancien, façon viel or. L'image source est un bonus offert par l'illustrateur nikosan dans le shop dans son magnifique site - All right reserved 2010 ©.

rsb10.gifInteractive Photo, Art, and Picture Mats and Framing Online - MatShop's MAToMATic

Ce site commerçant propose de personnaliser son cadre en ligne après avoir chargé une photo. Le but est que le client potentiel passe commande si le résultat lui donne satisfaction.

Plusieurs essais sont utiles pour combiner cadre, sous-verre, couleur du mur etc., mais le résultat est édifiant. Pour enregistrer gratuitement la photo encadrée, il suffit de cliquer sur "Save image"

myImageFromMatshop.jpg

rsb10.gifPhotoFunia - Classic Frames

Chargez une photo en ligne, placez-la dans un cadre, enregistrez. Simple et très réaliste, mais impossible de définir la largeur du cadre qui empiète sur la photo. Notez le vieillissement simultané de l'image.

PhotoFunia-4a4bd2.jpg

rsb10.gifPhotoScape : Free Photo Editing Software (Photo Editor) Download

A installer dans Windows, PhotoScape est l'éditeur graphique que je préfère à Picasa. L'encadrement est certes basique, mais il s'agit d'un bon compromis entre les deux solutions précédentes.

Ouvrez un fichier image en mode Edition, cliquez sur le cadre voulu auquel peut s'ajouter un sous-verre. Enregistrez la photo encadrée sous un nom différent.

wallpaper_tea_frame.jpg

Et si une photo présente des taches ou des défauts, le Modérateur explique comment supprimer un élément sur une photo avec WebInpaint (testé et approuvé).

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (0)

samedi, 01 mai 2010

Archiver vos notes hautETfort

WORDLE.JPG

Suite à sa mésaventure relatée dans un commentaire sur le blog GeeMee, Octobre nous fait découvrir une fonctionnalité hautETfort permettant d'afficher sur une page unique vos archives de blog classées par ordre chronologique, par thème ou par mots-clés.

En ajoutant chaque élément de colonne correspondant dans "Contenu des colonnes" de l'onglet PRÉSENTATION, vous pouvez proposer vos notes par Catégories, par Tags populaires ou par Archives. Dans ce dernier élément, on trouve en fin de liste un lien vers "Toutes les archives".

Voici comment présenter vos archives classées dans une page et 1 seule, sans encombrer une colonne de blog.

Ajouter la catégorie "Archives"

  1. Cliquez sur l'onglet NOTES de l'éditeur hautETfort.
  2. Cliquez sur Catégories
  3. Ajoutez une catégorie. Tapez le Nom de la catégorie: Archives
  4. Créer une nouvelle catégorie Cliquez sur le bouton.

Classer une note déjà publiée dans la catégorie "Archives"

  1. Cliquez sur Toutes les notes
  2. Cliquez sur la plus ancienne de vos notes parmi les Pages : 1 2 3 ... Page suivante
  3. Cliquez sur Modifier
  4. Cliquez sur la Catégorie Archives clicklist.gif La catégorie "Archives" est attribuée à la note en cours.
  5. Enregistrer Cliquez sur le bouton.

Vous n'utilisez pas encore l'élément de colonne "Catégories" dans votre blog ?

  1. Cliquez sur l'onglet PRESENTATION de l'éditeur hautETfort.
  2. Cliquez sur Contenu des colonnes
  3. Dans la liste des éléments de colonne, repérez "Catégories"
  4. Cliquez sur "Ajouter à doite" ou "Ajouter à gauche"
  5. Changez l'ordre d'affichage des éléments avec les flèches de la Colonne de Navigation Déplacer en hautDéplacer en bas
  6. Mettre à jour ces informations Cliquez sur le bouton en bas de page.

Affichez la page Archives.

  1. Cliquez sur Voir le blog
  2. Cliquez sur Archives dans la liste Catégories.

La page Archives s'affiche. Vous avez le choix de consulter les notes du blog par Catégorie, par Mois[1] ou par Tag[2]. C'EST MAGNIFIQUE!!!
Le nuage de tags de la page Archives affiche la liste complète des mots-clés attribués aux notes. Les tags les plus utilisés s'affichent dans une taille de texte supérieure...

Cliquez ci-contre pour afficher les Archives du blog Upset Diary. Quant à Bougrenette qui souhaite fouiller les archives, la voici comblée!

Dynamisez ensuite vos notes et archives avec LinkWithin.


[1] Si l'archivage se fait souvent mensuellement, vous pouvez décider d'un autre rythme dans TABLEAU DE BORD > Généralités, Propriétés d'archivages.

[2] Gee Mee vous propose aussi de Personnaliser l'élément de colonne "Tags populaires" pour accéder directement à tous les tags dans la page "Toutes les archives"

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (2)

dimanche, 06 décembre 2009

Dynamisez vos notes hautETfort

Je l'ai vu dans d'autres blogs, je l'ai voulu dans le mien. Au bas de chaque note de blog, le widget LinkWithin propose les liens vers des notes similaires, selon le contenu, le titre ou les tags.

LinkWithin affiche une image en vignette et le titre de chaque note en relation avec la note en cours. Le titre s'affiche seul quand la note en lien ne contient aucune image.

Il suffit de cliquer sur une vignette ou un titre pour lire la note proposée. Ainsi, LinkWithin recycle vos archives et met vos notes en avant.

upsetlinkwithin.gif

puce.gif

Obtenir le code html partiel pour intégrer le widget LinkWithin

  1. Cliquez ici pour afficher le site LinkWithin - Related Posts with Thumbnails
  2. Remplissez le formulaire. Sélectionnez les valeurs indiquées ci-dessous.
    Au-delà de 3 notes (stories), il faut contacter le support LinkWithin pour que le widget soit activé par leurs soins. Soyez patient, un mois d'attente peut être nécessaire avant intervention.
  3. Cochez l'option My blog has light text on a dark background si le texte de votre blog s'affiche sur fond foncé.
Email:
Blog Link:
Platform:
Width:
  My blog has light text on a dark background
  Get Widget!
Free. No ads. No signups. More traffic.
  1. Cliquez sur le bouton Get Widget! L'écran Install Widget on Other Platforms affiche le code html qui sert à intégrer le widget dans votre blog.

<script>
var linkwithin_site_id = 91386;
</script>
<script src="http://www.linkwithin.com/widget.js"></script>
<a href="http://www.linkwithin.com/"><img src="http://www.linkwithin.com/pixel.png" alt="Related Posts with Thumbnails" style="border: 0" /></a>

Ne copiez pas ce code en l'état, car il est incomplet!

Si LinkWithin s'installe automatiquement pour les services de blogging les plus connus, il est nécessaire de personnaliser la présentation d'un blog hautETfort pour que ce widget s'affiche correctement.

puce.gif

Comment intégrer le wigdet Linkwithin dans un blog hautEtfort?

  1. Cliquez sur l'onglet PRESENTATION de l'Editeur de blog hautETfort.
  2. Cliquez sur Configuration avancée
  3. Cliquez sur Je veux aller dans le design avancé
  4. Face au Modèle de la page lien permanent, cliquez sur Modifier le template
  5. Dans la source html du modèle, localisez les balises </head> et <div=class postbottom>
  6. Juste au-dessus de la balise </head>, copiez-collez le code activant le widget dans chaque note de blog (ci-dessous).
  7. Juste au-dessus de la balise <div=class postbottom>, copiez-collez le code affichant le widget au bas de chaque note (ci-dessous).
  8. Cliquez sur le bouton Enregistrer les modifications
  9. Fermez la fenêtre Modifier le modèle de la page lien permanent

puce.gif

Code activant le widget LinkWithin dans chaque note de blog

<script>
var linkwithin_site_id = 91386;
</script><script>linkwithin_text='Your custom text:'</script>

  • La valeur var linkwithin_site_id est l'identifiant unique pour votre blog.
  • Le code <script>linkwithin_text='Your custom text:'</script> est facultatif. Il sert à remplacer la phrase "Vous aimerez peut-être :" qui présente les notes en relation avec la note en cours.
    Au besoin, copiez-collez ce code et remplacez la valeur Your custom text: par votre texte personnalisé (Encore un tasse de thé ? par exemple)

puce.gif

Code affichant le widget LinkWithin au bas de chaque note

<div class="linkwithin_div"></div><script src="http://www.linkwithin.com/widget.js"></script>

puce.gifVous avez apprécié cette technote ? Gee Mee l'a faite évoluer pour vous livrer cette version vidéo. Suivez le guide ^^

Dynamisez vos notes avec vos archives et LinkWithin dans votre blog Hautetfort from Gee Mee on Vimeo

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (21)

dimanche, 29 novembre 2009

Mon blog se nourrit de commentaires hautETfort

Cette évidence a conduit le service hautETfort à développer l'échange et le suivi de commentaires au sein d'un blog.

La richesse de cette amélioration explique les nombreuses révisions de cette note au contenu très dense.

puce.gif

Configurer l'affichage des commentaires dans votre blog

  1. Cliquez sur l'onglet TABLEAU DE BORD de l'éditeur hautETfort.
  2. Cliquez sur Généralités
  3. Activez les Propriétés d'affichage suivantes.
Afficher le gravatar sur les commentaires
Taille du gravatar : pixels
Afficher le fil des commentaires
  1. Cliquez sur le bouton Mettre à jour ces modifications

Ces propriétés offrent les fonctionnalités suivantes à chaque visiteur qui vient Ecrire un commentaire

  • Son gravatar s'affiche à la Taille que vous fixez, si ce bloggueur est inscrit au service d'identification Gravatar.com
  • L'option permet d'échanger des commentaires entre bloggueurs. Le bloggueur qui coche l'option reçoit une alerte mail à chaque commentaire déposé dans une note qui retient son intérêt. Il peut ouvrir la discussion en choisissant de Répondre à ce commentaire
sb-marker-cont.gifRépondre à un commentaire renforce le lien avec son émetteur.
sb-marker-cont.gifRépondre à chaque émetteur exige de personnaliser chaque réponse et gonfle articiellement le nombre de commentaires sur une note.
sb-marker-cont.gifRépondre à plusieurs émetteurs dans un commentaire unique peut froisser certains.
sb-marker-cont.gifIl est préférable de s'abonner au fil de discussion avec modération pour ne pas engorger la boîte mail.

i_blue_sm.jpgLes propriétés Afficher le gravatar sur les commentaires et Afficher le fil des commentaires sont automatiquement neutralisées, chaque fois que les commentaires sont désactivés dans une note.

puce.gif

Personnaliser l'affichage des commentaires dans une note

  1. Quand vous ajoutez une note, cliquez dans la Configuration avancée pour Voir les propriétés avancées (commentaires, trackbacks)
  2. Vérifiez le statut des Commentaires
  3. Si vous cliquez sur Aucun ou Fermés, vous désactivez l'ajout de comnentaires, comme l'affichage des gravatars et du fil de discussion.

puce.gif

Gérer les commentaires dans votre blog

Cliquez sur l'onglet NOTES de l'éditeur hautETfort. Cliquez sur Tous les commentaires

Supprimer un commentaire

Jeune bloggueuse, je répondais aux commentaires à tout va. Je me suis censurée après avoir raconté comment je vis dans l'illégalité.

  1. Repérez le(s) commentaire(s) à supprimer.
  2. Cochez la case face à chaque commentaire à supprimer.
  3. Cliquez sur le bouton Supprimer au bas de la liste des commentaires.

Bannir un émetteur de commentaire

Un fâcheux a pollué le blog avec ses commentaires du dimanche. Ma paranoïa s'est emballée, il fallait chasser l'encombrant pour l'éternité.

  1. Repérez le(s) commentaire(s) à supprimer.
  2. Cliquez sur Modifier face au commentaire.
  3. Cliquez sur Bannir cet IP
  4. Cliquez sur le bouton Enregistrer

Mettre à jour un commentaire

Les commentaires sont plus nombreux. Je réponds à tous dans un commentaire unique. C'est bon d'être fainéante!

  1. Repérez le premier commentaire que vous avez rédigé pour répondre.
  2. Cliquez sur Modifier face au commentaire.
  3. Complétez le contenu du commentaire.
  4. Datez le commentaire Ecrit le jour et l'heure de la modification.
  5. Cliquez sur le bouton Enregistrer . Votre commentaire s'affiche au-dessus de ceux auxquels il répond.

i_blue_sm.jpgUtilisez la liste de commentaires comme premier annuaire de contacts. Vous avez le pseudo d'un visiteur, vous y trouverez son adresse mail.

puce.gif

Pour bloggueurs avancés

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (2)

dimanche, 08 novembre 2009

Protéger ses photos hautETfort

Soyons lucide! Rien n'empêche un esprit mal intentionné de s'emparer d'une photo par une simple capture d'écran.
Ne devenons pas parano! Parmi les solutions ici testées, vous en trouverez une suffisamment dissuasive.

puce.gif

Afficher des photos à taille réduite

Cette action simple reste la plus efficace. Quand vous insérez une image dans une note, prenez les précautions suivantes:

  • Cliquez sur la Taille de l'image, Petite ou Vignette
  • Ne cochez pas l'option

2055599857.jpgLa taille d'une vignette est de 150×112 pixels, celle d'une petite image de 100×75 pixels.
tetouill8.jpg

puce.gif

Appliquer un effet sur des photos

tetouill_joker.jpgS'il est utile de marquer des photos professionnelles ou commerciales par un filigrane Free Watermark. Add Custom Watermark. Protect Your Photos and..., cette action n'est pas la plus ludique pour des photos personnelles.

Avec un éditeur d'image en ligne ou installé sur PC, vous pouvez appliquer un flou, ajouter un cadre, rogner un portrait, etc.
Je préfère les services en ligne spécialisés dans le détournement de photos (merci Bougrenette). Actuellement, j'ai un gros faible pour LoonaPix.com. Make Funny Pictures and Add Photo Frames Online.

puce.gif

Afficher les photos d'un album 3D dans un blog hautETfort

Cette action permet d'utiliser une fonctionnalité hautETfort qui gagne à être connue, car très esthétique.

  1. Créez un album photo.
  2. Ajoutez des photos dans un album.
  3. Insérez un album dans une note. Cliquez atafoto.jpg
    • Cliquez sur l'album à insérer Mon album
    • Cliquez sur dans les Options.
    • Valider Cliquez. Feuilletez l'album en exemple.

 

puce.gif

Pour bloggueurs avancés: Interdire le passage de la souris au-dessus d'une photo

tetouill8.jpg

Cette action empêche le clic droit pour enregistrer l'image sur PC et affiche un avertissement quand un visiteur pointe vers l'image. Elle nécessite de manipuler la source html de la note.

Saluons Tétouille qui s'est prêté sans peur et sans reproche à ces manipulations (tentez de survoler la photo avec la souris ;)

Merci à Jef, auteur des articles suivants sur lesquels vous pouvez vous appuyer.
BLTGOLD.GIFProtéger ses photos contre le vol : les solutions - VirusPhoto
BLTGOLD.GIF3 astuces pour protéger ses photos contre le vol - VirusPhoto

  1. Insérez une image dans une note.
  2. Cliquez sur HTML dans la barre d'outils.
  3. Dans la source html de la note, localisez le code correspondant à l'image insérée <img src="http://monblog.hautetfort.com/media/maphoto.jpg">
  4. Devant le code de l'image, copiez-collez <a href="javascript:void(0)" onmouseover="alert('Cette photo est mon portrait - Merci de ne pas la copier!')>
  5. Derrière le code de l'image, copiez-collez </a>
  6. Vérifiez le code final de l'image:
    <a href="javascript:void(0)" onmouseover="alert('Cette photo est mon portrait - Merci de ne pas la copier!')><img src="http://monblog.hautetfort.com/media/maphoto.jpg"></a>
  7. En bas de l'Editeur de la source HTML, cliquez sur le bouton Mettre à jour

Merci à kriss qui rappelle que cette action fonctionne sous 2 conditions:

  • Vous devez activer le javascript dans les options de votre Explorateur Internet.
  • La source html de la note ne doit pas contenir la balise <noscript> qui neutralise javascript.

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (7)

lundi, 27 juillet 2009

Polaroïdissime

La note d'Alexandra "Des polaroids sur son blog Hautetfort : Le blog Hautetfort" me donne envie de comparer trois générateurs de polaroïd en ligne. Ci-dessous, le modèle qui a patiemment subi mes tests.

BathingSuit1920s.jpg

Mes critères pour sélectionner chaque générateur sont les suivants:

  1. service en ligne, gratuit et sans inscription
  2. fonction unique (ne produit que des polaroïds)
  3. possibilité d'enregistrer par un clic droit sur l'image finale (aucun code à manipuler)

rsb25.gifPhoto Notes

  • Points forts: utilisation ludique, possiblité de choisir un modèle de polaroïd, de taper la légende avec la fonte et la couleur de votre choix
  • Points faibles: obligation de charger une image carrée pour éviter sa compression, trop de fond perdu autour du polaroïd
BathingPhotonotes.jpg

rsb25.gifInstantizer.com - free online graphics tool - wrap pictures into a polaroid-style frame

  • Points forts: utilisation rapide, possibilité de taper la légende ou d'orienter la photo selon l'angle de votre choix, respect de l'image d'origine
  • Point faible: rectangle interne à retoucher pour un cadre photo harmonieux
Bathinginstantizer.jpg

rsb25.gifRollip - Create Polaroids from your photos!

  • Points forts: possiblité de choisir la taille et le rendu de la photo, bons redimensionnement et recadrage de l'image
  • Points faibles: prise en main moins facile, cadre photo un peu kitsch par sa texture plus vraie que nature
Bathingrollipsmall.jpg

Quelque soit le générateur choisi, vous pourrez redimensionner, faire pivoter le polaroïd ou ajouter une légende dans un éditeur d'image en ligne, tel que DrPic.com Free Web Picture Editor and Image Host - Crop, Resize, Text
La simplicité de cet éditeur gratuit m'a conquise. Le plus est la facilité avec laquelle on encadre une photo (pour obtenir un polaroïd par exemple).

J'ai un faible pour le mignon Photo Notes, mais je parie sur la progression de Rollip dont cet encadrement est esthétique.

Bathingrollipasis.jpg

Écrit par Upset Diary©2007-2012 dans Hotline hautETfort | Commentaires (4)

Toutes les notes