Wordpress

Par défaut, lorsqu’un fichier audio est ajouté à un article ou une page, seul un lien apparaît. En cliquant sur ce lien, l’internaute fait apparaître une page noire, avec juste une barre de lecture au centre, la lecture du fichier audio se déclenchant alors. Cette méthode peu ergonomique n’incite guère à sonoriser votre blog/site. Fort heureusement, il suffit d’une extension pour que la gestion des MP3 devienne autrement plus intuitive.

1. INSTALLER MP3-JPLAYER

Il existe de nombreuses extensions dédiées à la lecture MP3. Nous avons retenu MP3-jplayer, très complet et qui reste simple d’usage. Sélectionnez Extensions, Ajouter, tapez « MP3-jPlayer » (sans les guillemets) dans le champ de recherche, cliquez sur le lien Installer maintenant, validez l’installation et activez l’extension.

Insérer printscreen

2. POUR LIRE UN MORCEAU

Pour insérer le lecteur dans un article ou une page, tapez le shortcode [mp3j track= »nom_du_fichier »]

Insérer printscreen

Si le fichier fait partie de la bibliothèque, renseignez seulement son nom. Pour un fichier Internet, vous devrez renseigner l’adresse complète. Pour insérer le lecteur dans la page d’accueil, il faut recourir à un Widget. Sélectionnez Apparence, Widgets, et cliquez/déplacez le Widget MP3j-sh dans la colonne principale. Tapez le code ci-dessus dans la colonne champ et enregistrez.

Insérer printscreen

Par défaut, le lecteur mentionne le titre en gras, assure la lecture/pause, précise le timecode et dispose d’une barrette de navigation. De nombreux éléments peuvent être modulés dans les paramètres ou en ajustant le shortcode (voir ci-après).

Insérer printscreen

3. POUR LIRE UNE LISTE

Le principe est similaire, le shortcode étant un peu différent. Pour une liste simple, tapez le shortcode :

[mp3-jplayer tracks= »titre1,titre2,titre3″]

Pour proposer à la lecture tous les fichiers MP3 contenus dans un dossier, rentrez le shortcode :

[mp3-jplayer tracks= »FEED:/dossier »]

Ce code est à insérer dans l’éditeur de l’article ou de la page. Pour la page d’accueil, il faudra user du Widget MP3j-ui et choisir parmi ses différentes options.

4. PARAMÉTRER LE LECTEUR

Sélectionnez Réglages, MP3 jPlayer. Vous pourrez ainsi ajuster le volume initial, activer la lecture automatique et la lecture en boucle, la taille du lecteur, son alignement, etc. Les couleurs du lecteur et des différents textes peuvent être aussi modulées. D’autre options se dévoileront en cliquant sur More options show : numérotation des pistes, tri alphabétique, marges, lecteur popup, etc. Une fois sauvegardés d’un clic sur Update Settings, les nouveaux paramètres s’appliqueront aux prochaines insertions de lecteur MP3. En revanche, les lecteurs déjà existants dans les pages ne seront pas modifiés.

Insérer printscreen

A insérer :

Un encart reprenant le texte suivant :

Moduler le code

Le paramétrage du lecteur peut aussi s’effectuer en complétant le code de certains attributs. Vous trouverez de nombreux exemples en cliquant sur le lien Show help, tout en haut de la page de paramétrage de l’extension, ou en consultant la page de démonstration disponible sur le site de l’extension.



Le navigateur ne vous servira pas seulement à consulter votre site, c’est aussi celui que vous allez mettre à jour.

Dans l’immense majorité des cas, un site ou un blog s’administrent dans un navigateur. C’est avec ce logiciel que vous personnalisez votre site, c’est avec lui que vous ajoutez du contenu. Quelle que soit votre marque d’ordinateur – un PC, un Mac – , que vous soyez plutôt adepte du navigateur Internet Explorer, de Safari, de Firefox ou de Google Chrome, vous avez donc tout intérêt à en maîtriser quelques fonctions très pratiques. Il peut également s’avérer utile d’installer un second navigateur sur votre ordinateur, d’abord pour vérifier que votre site s’affiche correctement dans les navigateurs les plus courants, ensuite pour tester le site en étant connecté avec un nom d’utilisateur dans un premier navigateur, et connecté avec un autre nom d’utilisateur (ou même en étant tout simplement déconnecté, comme n’importe quel internaute) dans le second navigateur, ce qui vous évitera d’avoir à vous déconnecter / reconnecter continuellement.

Ajouter un site à vos favoris ou à la barre d’outils personnelle

Pour vous rendre sur votre site ou blog, pourquoi retaper à chaque fois son nom ? Même si les navigateurs vous suggèrent des sites correspondant aux quelques lettres que vous commencez à taper dans leur barre d’adresse, vous vous simplifiez la vie en ajoutant à votre liste de favoris l’adresse de ce site, ainsi que celle de son panneau d’administration. Internet Explorer et Chrome parlent de « favoris », Safari préfère le terme de « signets’ et Firefox celui de « marque-pages », mais dans tous les cas, il s’agit de créer un raccourci, accessible d’un clic, vers une page Web que vous fréquentez souvent. Et dans tous les navigateurs, sur PC, le raccourci clavier est Ctrl + D (maintenez la touche Ctrl enfoncée et pressez la touche D), et cmd + D sur Mac. Sur ce premier exemple, nous affichons d »abord la page d’accueil du blog FilTechno.

[Insérer printscreen 1]

Dans Internet Explorer, nous pressons Ctrl + D : le navigateur affiche une boîte de dialogue permettant d’indiquer dans quel dossier on souhaite ajouter la page actuelle [Insérer printscreen 2]. Acceptez la proposition qui vous est faite, dans le dossier « Favoris ». Pour afficher la liste de vos sites favoris, cliquez sur l’étoile en haut à droite de la fenêtre d’Internet Explorer.
Autre solution, encore plus rapide, pour accéder à votre site : l’ajouter au Volet des Favoris sous la barre d’adresse d’Internet Explorer (si ce volet n’est pas visible, cliquez sur le menu Outils, Barres d’outils, Volet des Favoris). Cliquez sur l’icône tout à gauche pour ajouter votre site à cette barre d’icônes.

[Insérer printscreen 3]

Dans le navigateur Safari, la combinaison des touches Ctrl + D est équivalente à un clic sur le signe + à gauche de la barre d’adresse. Ajoutez alors votre site à la « Barre de signets », visible juste en dessous.

[Insérer printscreen 4]

Dans le navigateur Chrome, Ctrl + D équivaut à un clic sur l’icône à droite de la barre d’adresse. Vous pouvez également attraper la petite icône à gauche de l’adresse du site, et la glisser dans la barre d’outils située en dessous.

[Insérer printscreen 5]

Dans Firefox, la manip est identique. Au lieu de taper Ctrl + D, vous pouvez soit cliquer sur l’icône étoile à droite de la barre d’adresse pour ajouter un marque-pages (recliquez sur l’étoile pour modifier son emplacement), soit attraper l’icône du site et la glisser dans la barre d’outils située en dessous (Firefox l’appelle la Barre personnelle).

[Insérer printscreen 6]

Jongler avec les onglets

Si la notion d’onglets ne vous est pas familière, vous allez rapidement en comprendre l’intérêt. Les onglets servent à ouvrir plusieurs pages Web dans une seule fenêtre du navigateur ; vous passez d’un onglet à l’autre en cliquant son nom. Quel que soit le navigateur, pour créer un onglet, pressez Ctrl + T (ou cmd + T sur Mac). Vous pouvez également cliquer sur une petite icône située soit juste à droite du dernier onglet ouvert, soit tout à droite de la fenêtre du navigateur. Ci-dessous, trois exemples dans Internet Explorer, Safari et Chrome.

[Insérer printscreen 7]

Ouvrir un lien dans un onglet

[Insérer printscreen 8]

Dans l’exemple ci-dessus, nous avons lancé une recherche sur le mot « Paris » dans Google. Pour conserver la liste de résultats dans un premier onglet et ouvrir une page Web pour consulter l’un des sites proposés, il suffit de cliquer avec le bouton droit de la souris sur le lien et de choisir « Ouvrir dans un nouvel onglet ».

Zapper d’un onglet à l’autre

Chaque onglet prend le nom de la page Web qu’il affiche. Cliquez sur le nom de l’onglet pour l’afficher. Si votre ordinateur est un peu lent, évitez d’ouvrir trop d’onglets, et pensez à refermer ceux devenus inutiles en cliquant sur la croix située à droite de l’onglet.

[Insérer printscreen 9]

Comment profiter des onglets

Pour administrer un site ou un blog, les onglets sont très utiles. Vous pourrez ainsi modifier la présentation d’un article de blog dans le panneau d’administration, conserver cette page d’administration ouverte dans un onglet, et afficher le résultat dans un second onglet. Attention : ce second onglet ne reflétera les modifications apportées que si vous actualisez (rechargez) la page Web, soit en pressant la touche F5 de votre clavier, soit en cliquant sur l’icône représentant une flèche arrondie et tournée vers la droite. Cette icône est présente sur tous les navigateurs, elle se trouve tout à gauche ou à droite de la barre d’adresse.

[Insérer printscreen 10]

A insérer :

– 10 printscreen sans légende indiqués dans le texte ci-dessus.

– un encart reprenant le texte suivant :

Tous les grands navigateurs Web sont gratuits et en français. Voici où les télécharger.

▪ Internet Explorer pour Windows : www.microsoft.com/Internet-Explorer-9
▪ Mozilla Firefox pour Windows, Mac OS et Linux : www.mozilla.com/fr/firefox
▪ Google Chrome pour Windows, Mac OS et Linux : www.google.com/chrome
▪ Apple Safari pour Mac OS et Windows : www.apple.com/fr/safari
▪ Opera pour Windows, Mac OS et Linux : www.opera.com

– 2 légendes sans printscreen :

1. Pour ouvrir un lien dans un onglet, trois solutions : cliquez avec le bouton droit de la souris sur le lien et choisissez' »Ouvrir dans un nouvel onglet ». Ou pressez la touche Ctrl avant de cliquer sur le lien avec le bouton gauche. Ou, encore plus malin, cliquez sur le lien avec la molette de la souris ! Eh oui, cette molette qui sert à faire défiler une page Web vers le bas ou vers le haut peut, elle aussi, être pressée, tout comme les boutons gauche et droit de la souris.

2. Si une page Web de votre site ou blog est déjà affichée dans un onglet, elle ne reflétera pas les modifications que vous y apportez dans le panneau d’administration si, de retour sur l’onglet de cette page Web, vous ne pressez pas la touche F5.