Player audio Elson<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/amplitudejs@5.3.2\/dist\/amplitude.min.js\"><\/script>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\n\n <style>\n body {\n margin: 0;\n font-family: 'Inter', sans-serif;\n background-color: #ffffff;\n }\n\n .audio-player-container {\n max-width: 420px;\n margin: 40px auto;\n padding: 15px;\n background-color: #ffffff;\n border-radius: 16px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);\n border: 2px solid #d9dce1;\n }\n\n .audio-header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 12px;\n }\n\n .audio-header img {\n width: 48px;\n height: 48px;\n border-radius: 8px;\n object-fit: cover;\n }\n\n .audio-header-text {\n display: flex;\n flex-direction: column;\n }\n\n .audio-title {\n font-weight: 700;\n font-size: 16px;\n color: #001442;\n margin: 0;\n }\n\n .audio-subtitle {\n font-size: 14px;\n color: #666;\n margin: 0;\n }\n\n .audio-progress {\n display: flex;\n align-items: center;\n gap: 8px;\n margin: 8px 0;\n }\n\n .progress-bar {\n flex-grow: 1;\n height: 6px;\n background-color: #eee;\n border-radius: 4px;\n }\n\n .audio-controls {\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: 10px;\n }\n\n .audio-controls button {\n background: none;\n border: none;\n font-size: 20px;\n cursor: pointer;\n color: #001442;\n }\n\n .play-button {\n width: 40px;\n height: 40px;\n background-color: #001442;\n color: #fff;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n }\n\n .logo-elson {\n height: auto;\n max-width: 78px;\n }\n\n @media screen and (max-width: 480px) {\n .audio-player-container {\n margin: 20px auto;\n padding: 10px;\n }\n\n .logo-elson {\n max-width: 78px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"audio-player-container\">\n <div class=\"audio-header\">\n <img decoding=\"async\" src=\"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\" alt=\"Logo Elson\">\n <div class=\"audio-header-text\">\n <p class=\"audio-title\">Cours audio : C\u2019est quoi un podcast ?<\/p>\n <p class=\"audio-subtitle\">De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast<\/p>\n <\/div>\n <\/div>\n\n <div class=\"audio-progress\">\n <span class=\"amplitude-current-time\">00:00<\/span>\n <input type=\"range\" class=\"amplitude-song-slider progress-bar\" \/>\n <span class=\"amplitude-duration-time\">00:00<\/span>\n <\/div>\n\n <div class=\"audio-controls\">\n <button class=\"amplitude-prev\" title=\"Reculer\">\u27f2<\/button>\n <button class=\"amplitude-play-pause play-button\" title=\"Play\/Pause\">\u25b6<\/button>\n <button class=\"amplitude-next\" title=\"Avancer\">\u27f3<\/button>\n <span title=\"Niveau audio\">\ud83d\udcf6<\/span>\n <button class=\"amplitude-playback-speed\">1x<\/button>\n <img decoding=\"async\" class=\"logo-elson\" src=\"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\" alt=\"Logo Elson\">\n <\/div>\n <\/div>\n\n <script>\n Amplitude.init({\n songs: [\n {\n name: \"Cours audio : C\u2019est quoi un podcast ?\",\n artist: \"Elson\",\n album: \"De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast\",\n url: \"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/cours_intro.mp3\",\n cover_art_url: \"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\"\n }\n ]\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Player audio Elson Cours audio : C\u2019est quoi un podcast ? De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast 00:00 00:00 \u27f2 \u25b6 \u27f3 \ud83d\udcf6 1x<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-65","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/comments?post=65"}],"version-history":[{"count":58,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65\/revisions"}],"predecessor-version":[{"id":167,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65\/revisions\/167"}],"wp:attachment":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/media?parent=65"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":65,"date":"2025-07-29T16:17:42","date_gmt":"2025-07-29T16:17:42","guid":{"rendered":"https:\/\/sons.elson.media\/?page_id=65"},"modified":"2025-07-30T11:29:10","modified_gmt":"2025-07-30T11:29:10","slug":"test-playeur-play-pause","status":"publish","type":"page","link":"https:\/\/sons.elson.media\/index.php\/test-playeur-play-pause\/","title":{"rendered":"test playeur play pause"},"content":{"rendered":"\n\n\n\n \n Player audio Elson<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/amplitudejs@5.3.2\/dist\/amplitude.min.js\"><\/script>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;600;700&display=swap\" rel=\"stylesheet\">\n\n <style>\n body {\n margin: 0;\n font-family: 'Inter', sans-serif;\n background-color: #ffffff;\n }\n\n .audio-player-container {\n max-width: 420px;\n margin: 40px auto;\n padding: 15px;\n background-color: #ffffff;\n border-radius: 16px;\n box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);\n border: 2px solid #d9dce1;\n }\n\n .audio-header {\n display: flex;\n align-items: center;\n gap: 12px;\n margin-bottom: 12px;\n }\n\n .audio-header img {\n width: 48px;\n height: 48px;\n border-radius: 8px;\n object-fit: cover;\n }\n\n .audio-header-text {\n display: flex;\n flex-direction: column;\n }\n\n .audio-title {\n font-weight: 700;\n font-size: 16px;\n color: #001442;\n margin: 0;\n }\n\n .audio-subtitle {\n font-size: 14px;\n color: #666;\n margin: 0;\n }\n\n .audio-progress {\n display: flex;\n align-items: center;\n gap: 8px;\n margin: 8px 0;\n }\n\n .progress-bar {\n flex-grow: 1;\n height: 6px;\n background-color: #eee;\n border-radius: 4px;\n }\n\n .audio-controls {\n display: flex;\n align-items: center;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: 10px;\n }\n\n .audio-controls button {\n background: none;\n border: none;\n font-size: 20px;\n cursor: pointer;\n color: #001442;\n }\n\n .play-button {\n width: 40px;\n height: 40px;\n background-color: #001442;\n color: #fff;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 20px;\n }\n\n .logo-elson {\n height: auto;\n max-width: 78px;\n }\n\n @media screen and (max-width: 480px) {\n .audio-player-container {\n margin: 20px auto;\n padding: 10px;\n }\n\n .logo-elson {\n max-width: 78px;\n }\n }\n <\/style>\n<\/head>\n<body>\n\n <div class=\"audio-player-container\">\n <div class=\"audio-header\">\n <img decoding=\"async\" src=\"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\" alt=\"Logo Elson\">\n <div class=\"audio-header-text\">\n <p class=\"audio-title\">Cours audio : C\u2019est quoi un podcast ?<\/p>\n <p class=\"audio-subtitle\">De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast<\/p>\n <\/div>\n <\/div>\n\n <div class=\"audio-progress\">\n <span class=\"amplitude-current-time\">00:00<\/span>\n <input type=\"range\" class=\"amplitude-song-slider progress-bar\" \/>\n <span class=\"amplitude-duration-time\">00:00<\/span>\n <\/div>\n\n <div class=\"audio-controls\">\n <button class=\"amplitude-prev\" title=\"Reculer\">\u27f2<\/button>\n <button class=\"amplitude-play-pause play-button\" title=\"Play\/Pause\">\u25b6<\/button>\n <button class=\"amplitude-next\" title=\"Avancer\">\u27f3<\/button>\n <span title=\"Niveau audio\">\ud83d\udcf6<\/span>\n <button class=\"amplitude-playback-speed\">1x<\/button>\n <img decoding=\"async\" class=\"logo-elson\" src=\"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\" alt=\"Logo Elson\">\n <\/div>\n <\/div>\n\n <script>\n Amplitude.init({\n songs: [\n {\n name: \"Cours audio : C\u2019est quoi un podcast ?\",\n artist: \"Elson\",\n album: \"De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast\",\n url: \"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/cours_intro.mp3\",\n cover_art_url: \"https:\/\/test.elson.media\/wp-content\/uploads\/2025\/07\/LOGOELSON-fond2.png\"\n }\n ]\n });\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Player audio Elson Cours audio : C\u2019est quoi un podcast ? De l\u2019\u00e9coute \u00e0 la cr\u00e9ation de podcast 00:00 00:00 \u27f2 \u25b6 \u27f3 \ud83d\udcf6 1x<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-65","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/comments?post=65"}],"version-history":[{"count":58,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65\/revisions"}],"predecessor-version":[{"id":167,"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/pages\/65\/revisions\/167"}],"wp:attachment":[{"href":"https:\/\/sons.elson.media\/index.php\/wp-json\/wp\/v2\/media?parent=65"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}