> For the complete documentation index, see [llms.txt](https://aero-labs.gitbook.io/aero-labs-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://aero-labs.gitbook.io/aero-labs-docs/scripts/ahalloweenloading.md). # AHalloweenLoading A free Halloween loading screen with music, particles, lightning and your own logo, all set up from one config file. ![AHalloweenLoading](https://3178353394-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fm2Hc1pmEtJtEBI0blIeE%2Fuploads%2FXBCnDHD1uErXN0HqVoTx%2FAHalloweenLoading.png?alt=media) {% hint style="success" %} **Free resource.** AHalloweenLoading is free for every server. {% endhint %} A spooky loading screen for your server. Players see your logo and colours over a Halloween background, with drifting particles, a light sweep, random lightning flashes, a live loading bar, social buttons and a built-in music player. Everything you'd want to change is in **one file**, `html/config.json`, plus the `images` and `music` folders. ## Requirements None. It works on every server and framework (Standalone, QBCore, QBox, ESX, TMC). ## Installation 1. Drag the `AHalloweenLoading` folder into your `resources` folder. 2. Add it to your `server.cfg`: ```cfg ensure AHalloweenLoading ``` 3. **Turn off any other loading screen.** A server can only show one loading screen. Remove or stop any other resource that has a `loadscreen` line in its `fxmanifest.lua`. 4. Open `html/config.json` and make it yours (see below). 5. Restart the server and join to see it. The loading screen closes on its own when the player spawns. ## What you can edit | What | Where | | --------------------------------------------------------------------------- | ------------------------------------------ | | Logo, title, texts, colours, effects, particles, music list, social buttons | `html/config.json` | | Background and logo images | `html/images/` (`.png`, `.jpg` or `.webp`) | | Songs | `html/music/` (`.mp3`) | New files you drop into those folders are picked up automatically, as long as they use the file types listed. You don't need to edit `fxmanifest.lua`. {% hint style="warning" %} `config.json` is strict about formatting. Keep the quotes, and put a comma between items but **not** after the last one. If the screen turns blank or your changes don't show, paste the file into [jsonlint.com](https://jsonlint.com) to find the mistake. {% endhint %} ## Customisation FAQ ### How do I change the logo? * **Easiest:** replace `html/images/logopng.png` with your own logo, using the same file name. * **Or:** add your logo to `html/images/` and point the config at it: ```json "useLogo": true, "logoImage": "images/mylogo.png", "logoSize": 300, ``` * `logoSize` is the logo's maximum height in pixels. A PNG with a transparent background looks best. ### How do I show text instead of a logo? Set `useLogo` to `false`. The `title` is then shown as large text, coloured with `titleTextGradient`: ```json "useLogo": false, "title": "My Server", "titleTextGradient": "linear-gradient(90deg, #FF7A1A, #FFA552)", ``` For a single colour, use the same colour twice, for example `linear-gradient(90deg, #FFFFFF, #FFFFFF)`. ### How do I change the colours? Edit `colorTheme`: ```json "colorTheme": { "primary": "#FF7A1A", "secondary": "#8A8F98", "text": "#ECECEC", "background": "#0B0B0C" }, ``` | Colour | Used for | | ------------ | ---------------------------------------------------------------------------- | | `primary` | Your main colour: loading bar, particles, glow and the default button colour | | `secondary` | Second particle colour | | `text` | All text | | `background` | Base background colour | Always use the full 6-digit hex format, such as `#FF7A1A`. Short codes like `#F70` don't work. You can pick colours at [htmlcolorcodes.com](https://htmlcolorcodes.com). ### How do I change the background image? Put your image in `html/images/` and set: ```json "backgroundImage": "images/mybackground.jpg", ``` Use a 1920 × 1080 (16:9) image for the best result. ### How do I change or remove the orange tint over the background? Edit `overlay`: ```json "overlay": { "color": "#FF7A1A", "strength": 0.45 }, ``` `strength` goes from `0` (no tint) to `1` (fully covered). Set it to `0` to show your background exactly as it is. ### How do I change the texts? ```json "subtitle": "Development Server", "loadingText": "Loading AeroLabs amazing scripts..", "footerText": "© 2026 AeroLabs. All rights reserved.", ``` * `subtitle` appears under the logo or title. * `loadingText` appears above the loading bar. * `footerText` appears at the bottom. ### How do I add, change or remove songs? 1. Put your `.mp3` files in `html/music/`. 2. List them under `music.songs`. They play in this order, then loop back to the first: ```json "songs": [ { "title": "My Song", "artist": "My Artist", "file": "music/mysong.mp3" }, { "title": "Another Song", "artist": "Someone", "file": "music/another.mp3" } ] ``` 3. To remove a song, delete its line (and the comma before it if it was the last one). You can also delete the `.mp3` from the folder. {% hint style="info" %} Only use music you have the right to use on your server. Royalty-free sources such as NoCopyrightSounds (NCS) are a safe choice. {% endhint %} ### How do I turn the music off, or change the volume? ```json "music": { "enabled": true, "autoplay": true, "initialVolume": 0.5, ... } ``` * `enabled: false` removes the music player completely. * `autoplay: false` starts the music paused, so players press play themselves. * `initialVolume` goes from `0` (silent) to `1` (full volume). ### How do I change the social buttons? Edit `socialIcons`. Each button has an icon, a link and a background colour: ```json "socialIcons": [ { "iconClass": "fab fa-discord", "link": "https://discord.gg/your-invite", "background": "#5865F2" }, { "iconClass": "fab fa-tiktok", "link": "https://tiktok.com/@yourserver", "background": "#000000" } ] ``` * **Replace the example links with your own.** The defaults point to Æro Labs. * Add or remove buttons by adding or removing entries. * Icons come from [Font Awesome](https://fontawesome.com/search?o=r\&ic=free) (free icons). Popular ones: | Icon | `iconClass` | | --------------- | -------------------------------- | | Discord | `fab fa-discord` | | YouTube | `fab fa-youtube` | | TikTok | `fab fa-tiktok` | | Instagram | `fab fa-instagram` | | Twitch | `fab fa-twitch` | | X (Twitter) | `fab fa-x-twitter` | | Website / store | `fas fa-globe` or `fas fa-store` | ### How do I turn off the lightning, glow or light sweep? ```json "effects": { "ambientGlow": true, "lightSweep": true, "lightning": true, "lightningMinDelay": 9000, "lightningMaxDelay": 22000 }, ``` * Set any effect to `false` to turn it off. * Lightning strikes at a random time between `lightningMinDelay` and `lightningMaxDelay`, in milliseconds (9000 = 9 seconds). ### How do I change or turn off the particles? ```json "particles": { "enabled": true, "count": 80, "connectParticles": true, "connectDistance": 120 }, ``` * `enabled: false` turns them off. * `count` is how many particles are on screen. Lower it if players on slower PCs see stutter. * `connectParticles` draws lines between nearby particles, and `connectDistance` sets how close they must be (in pixels). ### My changes don't show up. What do I do? 1. Check `config.json` for a formatting mistake at [jsonlint.com](https://jsonlint.com). 2. Restart the resource (`restart AHalloweenLoading`) or the server. 3. Fully reconnect to the server. The loading screen only shows while you join. 4. Check that file names in the config match the real files exactly, including capital letters. ## For players * Click **play/pause**, **next** or **mute** on the music player, or press **Space** to pause and play. * If the music doesn't start straight away, click anywhere on the screen. * The screen closes by itself once you've loaded in.