Modifications

A faire

quand tu vas sur le site la première fois impeccable, tout s’affiche comme il faut, par contre si tu cliques sur un article et après que tu reviens sur la page d’accueil : les podcasts ne s’affichent plus et il faut automatiquement cliquer sur actualiser, toujours le même soucis !
temps longs également « par rubrique » et « par quartier » (si tu peux enlever le « s » car c’est mieux au singulier et là c’est au pluriel)
pour les rubriques : peux tu ajouter « Logement » ; « Femmes » ; « Migrations »
pb événement à venir : « No upcoming events scheduled yet. Stay tuned! »
Souci chargement des styles css page « emission par années

Modifications faites

~~mise en page de l’agenda (quand on ouvre l’article, tout est sur la gauche)~~
améliorer la page d’accueil au niveau mise en page :
~~bouton lecture : trop gros (le réduire car moche)~~
il y a plein de typos différentes (lecture aléatoire # de reportage podcast # par quartier…# un média de proximité#que le texte en paragraphe…) ; si on pouvait mettre la même partout ce serait bien plus joli et propre. genre la typo de Ligne16 (voir PJ charte graphique)
– Au tout début de la page d’accueil : le fait que les podcasts débordent à gauche et à droite et ne soit pas aligné au reste de la page , je trouve aussi que c’est brouillon / à voir mais bon je sais que tu vas être gavé (j’aime bien le côté propre et simple, en exemple le média Molenzine : https://molenzine.be/ – regarde alignement gauche droite, avec une marge – je trouve que c’est beau. et dans ce cas on met moins de podcast pas de pb.
~~– et si le bloc de la description du média de proximité (bloc en bas) peut être après le bloc des podcasts du début avant par quartier et par rubrique, c’est mieux~~
~~par rubrique et par quartier : mise en page très espacée, très grossière (j’aimerai que cela soit plus fin)~~
~~changer la couleur des fonds de blancs à « creme »~~
~~quand on clique « tous les podcasts », il y en a mais pas tous s’affiche et il n’y a pas les autres pages~~
~~logo de la BNP Paribas (en pj)~~
~~faire la page 2025 (pour avoir tous les podcasts de 2025 là tu t’es arrêté à 2024)~~
~~ajout du logo metropole nice cote d’azur qui finance l’action de ligne16 (comité de rédaction adultes depuis 2024-2025 (je te l’ai envoyé par email sur ton gmail le 8~~ ~~juillet)~~

Modification à prévoir à long terme

Statistique écoute d’un podcast et du site ?
je te remet aussi l’envie d’avoir « précédent – suivant » quand tu es sur un article si c’est possible
Bandeau de défilement de news
Automatisation des posts sur les reseaux sociaux
Passage en theme fse optimisation du chargemnet
Suppression elementor pour optimiser le chargement
Basculer le carousel en css pour supprimer l’extension Happy Elementor
Systeme de commentaire en bas des podcasts
ajout d’un captcha pour le formulaire
revoir le workflow : hebergeur podcast > persitent player > podst wordpress

Extensions

Ajax Search Lite

Est utilisé dans le header du site pour la recherche (ajax)

LoginPress

Permet de modifier le rôle « contributeur » afin d’autoriser l’upload de fichier média pour les Podcast, podcast gérer par Sonaar…

Happy Elementor Addon

Horizontal timeline > page un media citoeyn
Mini galerie logo partenaires > page un media citoyen

Royal Elementor Addons

Post Grid/slider/carousel > page accueil, section en ce moment / focus
Menu de navigation

Code boutons play / pause essential grid

<!– Conteneur pour les lecteurs –>
<div id= »players-container »>

<div class= »player » data-post-id= »{ id:%post_id% } »>
<a class= »link play podcast-btn » href= »javascript:IRON.sonaar.player.setPlayerAndPlay({ id:%post_id% }) » onclick= »togglePlayPause(event) »>
<i class= »fa-solid fa-circle-play »></i> <!– Icône de lecture –>
Lecture
</a>
<a class= »link pause podcast-btn » href= »javascript:IRON.sonaar.player.pause({ id:%post_id% }) » style= »display:none; » onclick= »togglePlayPause(event) »>
<i class= »fa-solid fa-circle-pause »></i> <!– Icône de pause –>
Pause
</a>
</div>

</div>

// Parcours chaque lecteur et attache les événements
players.forEach(player => {
const playButton = player.querySelector(‘.play’);
const pauseButton = player.querySelector(‘.pause’);
const postId = player.getAttribute(‘data-post-id’);

playButton.addEventListener(‘click’, function(event) {
event.preventDefault();
togglePlayPause(event, postId);
});

pauseButton.addEventListener(‘click’, function(event) {
event.preventDefault();
togglePlayPause(event, postId);
});
});

// Fonction pour basculer entre les boutons PLAY et PAUSE pour un lecteur donné
function togglePlayPause(event, postId) {
const clickedButton = event.currentTarget; // Bouton sur lequel on a cliqué
const parentPlayer = clickedButton.parentNode; // Parent de l’élément cliqué
const playButton = parentPlayer.querySelector(‘.play’);
const pauseButton = parentPlayer.querySelector(‘.pause’);

if (clickedButton.classList.contains(‘play’)) {
playButton.style.display = ‘none’;
pauseButton.style.display = ‘inline-block’;
IRON.sonaar.player.pause({ id: postId });
// Exécuter l’action de lecture avec postId
IRON.sonaar.player.setPlayerAndPlay({ id: postId });

} else if (clickedButton.classList.contains(‘pause’)) {
playButton.style.display = ‘inline-block’;
pauseButton.style.display = ‘none’;
// Exécuter l’action de pause avec postId
IRON.sonaar.player.pause({ id: postId });
}
}
</script>

Notes