tuto pour lecteur mp3 pour papa

NOTE IMPORTANTE pour la lecture de ce tuto

les images de ce tuto, sont ouvrable pour mieux les voire.

Je te conseilles de les ouvrir en cliquant avec la roulette de ta souris (le truc que tu utilises pour descendre une page, entre ton clique gauche et ton clique droit.  C'est aussi cliquable.) pour qu'elles s'ouvrent dans un nouvel onglet.

Pense à les fermer quand tu as fini de les visionner,  pour ne pas avoir trop d'onglet à ne plus savoir quoi en faire.

Si par accident, tu as cliquer gauche sur ton image, ça prendra la place de l'article que tu lis, il suffira juste de cliquer sur la flèche gauche en haut à gauche de ton navigateur. 

 

Ajouter des mp3 dans ta médiathèque / Récupérer le lien d'un mp3 :

1) Rends toi sur ton blog.

2) Dans contenu/Gérer les fichiers, la médiathèque s'ouvre

 

 

 

 

3) Sur ta gauche va dans le dossier  "musique" puis sur ta droite, clique sur "uploader un fichier"

 

4) Choisis un fichier mp3.

Pour connaitre sa taille (qui ne doit pas dépasser 10mo), il suffit de laisser ta souris sur le fichier désiré sans cliquer dessus. Une étiquette va apparaître avec les infos. ici mon mp3 fait 2.83 mo donc c'est parfait.

Tu sélectionnes le mp3, double clique ou cliques sur ouvrir 

 

5) Une fois le mp3 chargé il apparaît dans le dossier musique

 

6) Double cliques dessus, un nouvel onglet va s'ouvrir avec le lecteur. garde le pour plus tard

 

 

Lorsque tu voudras mettre de la musique pense à passer en 1er temps par ta médiathèque, comme ici . Soit tu doit Upload un mp3, dans ce cas tu ferra toutes les étapes. Soit tu as déjà ton mp3 dans ta médiathèque, alors tu prends en compte les étapes 1) 2) 5) et 6)

 

Mettre la musique sur ton article

1) Sur ton bureau ouvre ton fichier "code mp3.txt". Tu sélectionnes le texte et tu choisis "copier"

2) Sur ton blog, si ta médiathèque est encore ouverte, fermes la et écrit un nouvel article comme tu le fais d'habitude.

• Pour récapituler, tu as deux onglet ; ton blog avec la fenêtre d’édition d'article, et ta musique  mis de coté.
• Dans ta fenêtre d’édition d'article, tu oublis le bouton "musique" ça ne fonctionnera plus jamais (sauf si ils changent le lecteur, mais ça m’étonnerait...)
• tu vas dans "<>" c'est le code source.

 

3) Dans le fenêtre de "code sources HTML" tu supprimes "<p></p>" et tu colles ton code, précédemment copié.

• Si tu veux qu'un seul lecteur  tu dois supprimer les ligne 4, 13 et 14

4  |function  lect2() {$("musique2").innerHTML="<audio src='adresse du titre2' controls>■</audio>";};

13 |<p><a onclick="lect2()">TITRE N°2</a></p>
14 |<div id="musique2"> </div>

 

• Si tu veux plusieurs lecteurs, tu gardes ces lignes et tu les dupliques autant de fois que tu veux de lecteur, à noté que tu dois indiquer  pour chaque titres, un numéro différent au prés de "lect" et "musique"

 

<!-- code javascript adapté à la plateforme Eklablog -->

<script type="text/javascript">// <![CDATA[
function lect1() {$("musique1").innerHTML="<audio src='adresse du titre1' controls>■</audio>";};
function lect2() {$("musique2").innerHTML="<audio src='adresse du titre2' controls>■</audio>";};
function lect3() {$("musique3").innerHTML="<audio src='adresse du titre3' controls>■</audio>";};
function lect4() {$("musique4").innerHTML="<audio src='adresse du titre4' controls>■</audio>";};

// ]]></script>

<!-- code HTML -->
<p>Cliquer sur un titre pour faire apparaitre le lecteur correspondant</p>

<p><a onclick="lect1()">TITRE N°1</a></p>
<div id="musique1"> </div>

<p><a onclick="lect2()">TITRE N°2</a></p>
<div id="musique2"> </div>

<p><a onclick="lect3()">TITRE N°3</a></p>
<div id="musique3"> </div>

<p><a onclick="lect4()">TITRE N°4</a></p>
<div id="musique4"> </div>

 

• Si par exemple tu veux mettre 2 lecteurs par article à chaque fois, ça te fait 10 lecteurs sur une pages, étant donné qu'une page peut contenir 5 articles...
  
  Il faut que tu y penses et que tu te souviennes de ça pour qu'il n'y ai pas de conflits avec les lecteurs...
  
  Pour être tranquille, je te conseils d'aller jusqu'à 10 (si tu ne compte pas en mettre plus de 2 par articles. Après 10, tu recommences, normalement les 1ers lecteurs seront passé sur la pages suivante.
  
  
• Ce que tu as à faire ensuite c'est de copier le lien de ta musique que tu as mis de coté (le second onglet de ton navigateur internet) et de le coller à la place de adresse du titre1 et ainsi de suite avec les autres titres.
  
  
• Tu remplaceras aussi TITRE N°1 par le titre correspondant à la musique1 et ainsi de suite avec TITRE N°2  etc

4) Une fois que tu as terminé, à la fin de ton code, tu mettras un repère pour savoir où tu commencera à insérer des images et/ou à écrire. Ça peut Etre un mot ou des symboles,  tu écrit ce que tu veux.

Moi j'ai mis "DEBUT"

 

5) Tu cliques sur le bouton vert "OK"

Tu prends garde de ne pas supprimer les espaces qui contiennent les lecteurs! Tu sélectionnes ton repère, uniquement, pour insérer du texte et/ou des images

 

6) Mets toi en plein écran avec le bouton en haut à droite, pour être plus à l'aise pendant l'édition (tu peux le faire des le début. Et pour valider la publication, il faut en sortir en cliquant à nouveau sur le bouton plein écran en haut à droite.

 

7) après avoir sélectionné ton mot clé tu y insère ton texte et/ou tes images

PRENDS GARDE à ne jamais supprimer ces "vides" entre chaque titres ou entre titre et le début de ton article !

 

8) Si tu veux positionner tes lecteurs à droite ou au centre, si tu as plusieurs lecteurs  que tu en veux un à gauche, le suivent au centre, et un autre à droite, il te suffi de sélectionner le titre et son vide correspondant et de les positionner comme tu le veux.
Tu remarqueras qu'ils sont, de base, à gauche. Donc si tu veux les laisser à gauche, tu n'as aucune manipulation à faire).

Si tu veux tout positionner pareil a droite ou au centre, tu sélectionnes tout et tu positionne ou tu veux.

Par-contre au cas ou tu y penses, il est impossible de mettre deux lecteurs sur la même ligne.

 

9) Quand tu as fini , tu peux sortir du mode plein écran (étape 6) et cliquer sur "Publier" ou "Enregistrer sans publier"

Et ça donne ça

 

Toi, ainsi que les personnes visitant ton blog, devrez cliquer sur les titres pour voir les lecteurs.