Configuration

The saka-loadingscreen script is highly customizable through two configuration files:

config/config.lua – general behavior settings
config/theme.lua – theme, styling, and animations

Let’s dive into each section.

Config File (config.lua)

This file controls the basic functionality of the loading screen.

Locale

Defines the language used for UI text.

Config.Locale = 'en'

Supported: 'en', 'de', 'fr', 'es', 'it', 'pt', 'ar'.

Server Branding

Config.ServerName = 'SAKA <span>ROLEPLAY</span>'
Config.ServerLogo = 'https://r2.fivemanage.com/oykPExvjfl8eEFverR8nZ/images/sakaIcon.png'

ServerName: The name shown on the loading screen header. (HTML tags allowed for styling)

ServerLogo: URL link or local file path for the logo image.

Tips for Logo

Recommended format: .png with transparent background.

Recommended size: 512x512px or smaller for best performance.

Default Settings

Controls the behavior of the loading experience.

Config.DefaultSettings = {
    ["musicPlayer"] = true,
    ["muteMusicAtStart"] = false,
    ["hideSocialLinks"] = false,
    ["hideExceptLoadingBar"] = false,
    ["startGameAfterLoading"] = false,
}

musicPlayer: Enables the built-in music player.
muteMusicAtStart: Starts music muted.
hideSocialLinks: Hides social links section on the loading screen.
hideExceptLoadingBar: Hides everything except the loading bar.
startGameAfterLoading: Automatically starts the game when loading is complete.

Background Settings

Configure either a video background or an album slideshow.

Config.BackgroundSettings = {
    type = 'video', -- 'video' or 'album'
    
    video = {
        url = 'https://r2.fivemanage.com/oykPExvjfl8eEFverR8nZ/GrandTheftAutoVITrailer1.mp4',
        volume = 0.2,
        mute = true,
        loop = false,
    },
    
    album = {
        {
            source = 'https://r2.fivemanage.com/oykPExvjfl8eEFverR8nZ/image/bg.png',
        },
        -- More images can be added here
    }
}

type: Choose between video or album.
video.url: Path to the video file (.webm recommended for local, or direct URL).
video.volume: Volume level for background video sound.
video.mute: Mute/unmute the video audio.
video.loop: Whether the video should loop automatically.
album.source: Array of images if you use the album slideshow option.

Music List

Manage the background music playlist.

Config.MusicList = {
    {
        Artist = "Anoraak",
        Name = "Gang",
        Cover = "https://r2.fivemanage.com/oykPExvjfl8eEFverR8nZ/images/anoraak.png",
        Link = "https://r2.fivemanage.com/oykPExvjfl8eEFverR8nZ/audio/anoraak.mp3",
    }
}

Artist: Name of the artist displayed on the UI.
Name: Track title.
Cover: Album art shown next to the music player.
Link: Direct link to the .ogg or .mp3 file.

You can add as many songs as you want by adding more entries to the MusicList.

Theme File (theme.lua)

You can select and customize the following pre-defined themes:

Ambient – Soft transparent visuals
Light – Bright and clean theme
Dark – Dark and high-contrast visuals

General Appearance

Defines the main look & feel (text colors, backgrounds, progress bars, etc.)

Example

general = {
    textColor = "#FFFFFF",
    background = "#00000003",
    progressBar = "#FFFFFF",
    progressBarBackground = "#FFFFFF1A",
    musicPlayerBackground = "#FFFFFF24",
    ...
}

textColor: Main text color
background: Base background color
progressBar: Color of the loading bar
musicPlayerBackground: Background color of the music player

Shortcut Keys (Keyboard View)

Controls the design of keyboard shortcut hints and key prompts.

shortcuts = {
    default = "#FFFFFF5C",
    active = "#FFFFFF",
    keyBackground = "#FFFFFF",
    boxShadow = "3px 3px 0px 0px rgba(191, 191, 191, 0.41)",
    ...
}

default: Inactive shortcut color
active: Active shortcut color
keyBackground: Background color for key prompts
boxShadow: Outer and inset shadow styling

Settings Panel

Controls the look of the settings page or music options panel.

settings = {
    boxBackground = "#FFFFFF33",
    switchBackground = "#FFFFFF1C",
    switchCircle = "#FFFFFF",
    activeSwitchBackground = "#FFFFFF66",
    themeBackground = "#FFFFFF1C",
    ...
}

boxBackground: Background color for settings sections
switchBackground: Background color of switches (on/off buttons)
themeBackground: Overall settings panel background

Important Notes

Colors must be valid hex codes (e.g., #FFFFFF) or rgba formats (e.g., rgba(0,0,0,0.5)).
Shadows must follow valid CSS box-shadow syntax.
You can freely create your own theme by duplicating an existing one (ambient, light, dark) and editing the colors.

PreviousInstallation

Last updated 1 day ago