diff --git a/app/views/pages/music1.twig b/app/views/pages/music1.twig
index b213ed3..81a057d 100644
--- a/app/views/pages/music1.twig
+++ b/app/views/pages/music1.twig
@@ -35,6 +35,7 @@
     <!-- right album stuff -->
     <div class="col-sm-7 col-xs-12">
       <article id="music-player-card" class="card">
+        <h4 id="track-title">{{ songs[0].title }}</h4>
         <audio id="music-player" controls>
           <source src="{{ songs[0].audio_file }}.ogg" type="audio/ogg" />
           <source src="{{ songs[0].audio_file }}.mp3" type="audio/mpeg" />
diff --git a/app/views/pages/music2.twig b/app/views/pages/music2.twig
index 6bf8381..c3e8a1d 100644
--- a/app/views/pages/music2.twig
+++ b/app/views/pages/music2.twig
@@ -34,6 +34,7 @@
 
       <!-- music player -->
       <article id="music-player-card" class="card">
+        <h4 id="track-title">{{ songs[0].title }}</h4>
         <audio id="music-player" controls>
           <source src="{{ songs[0].audio_file }}.ogg" type="audio/ogg" />
           <source src="{{ songs[0].audio_file }}.mp3" type="audio/mpeg" />
diff --git a/public/js/music.js b/public/js/music.js
index 8047f49..688e592 100755
--- a/public/js/music.js
+++ b/public/js/music.js
@@ -139,6 +139,9 @@ function changeAudioSources(trackElem, autoplay) {
     }
   });
 
+  // change track title
+  $('#track-title').text(trackElem.data('title'));
+
   // reload music player
   player.load();