FiveM Modding Tutorial

Step 1: Inside your server folder navigate to: resources/[test]/keks. It is recommended that you make a copy of this resource and rename it. Do not edit the original.

Step 2: Inside the keks folder, create a folder called music and inside it place your audio you wish to use. For this example I left mine called Loading.ogg. It needs to be in .ogg format to work. Also be aware it is case sensitive.

Step 3: Edit index.html and add the following code just below the <body> tag.

   <audio id="Loading" autoplay loop >
         <source src="https://forum.cfx.re/t/how-to-custom-loading-screen-with-music/music/Loading.ogg" type="audio/ogg">
    </audio>
	<script>
     var vid = document.getElementById("Loading");
     vid.volume = 0.2
    </script>

Step 4: Replace loadscreen.jpg with an image of your choice.

Step 5: Double click index.html and it will open in a web browser. You should then see your custom loading screen and hear your custom music.

Step 6: Edit __resource.lua and add the file path to your music. Don’t forget the comma!

Step 7: Don’t forget to add the resource ‘start keks’ (or whatever you called it if you chose to rename it) to your server.cfg.

aaand that’s all folks. Any questions or issues please ask, I’ll try my best to help.

Original source: https://forum.cfx.re/t/how-to-custom-loading-screen-with-music/5746