Notifications

Step-by-step installation guide, common issues & solutions, code snippets, error codes, config previews, locales previews, SQL previews, and changelogs; all in 1 easily accessible place.

Buy Here

FiveM Forums Post

YouTube Video

Translate

• Click here to translate this page.

• How do I change language?

INSTALLATION GUIDE

Step 0 - First Steps

1. Download your resource from Our Website or GitHub.

2. Unzip the cd_notifications.zip folder and place this folder in your server's resource folder.

3. Add the resource to your server start config (server.cfg): ensure cd_notifications.

Step 1 - Configure Resource

You MUST read all configurable options inside the [cd_notifications/configs/config.lua] file and configure them to suit your server's needs. Please read the ”commented out help text” at the end of each line so you can understand what each config option does.

Step 2 - Adding Notifications

Basic Notification

What are basic notifications?

Basic notifications require only the essential data to be filled in.

client-side to client-side

TriggerEvent('cd_notifications:Add', {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
    }
})

server-side to client-side

TriggerClientEvent('cd_notifications:Add', source, {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
    }
})

Intermediate Notification

What are intermediate notifications?

Intermediate notifications provide more customizability, but for newer developers, they can be confusing.

client-side to client-side

TriggerEvent('cd_notifications:Add', {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
        use_progress = true, --Do you want a progress bar on the notification?
        stack = true, --Do you want this notification to stack?
        sound = 'notification.ogg', --Choose a sound file name from the [sound] folder.
        icon = 'fas fa-bell', --The icon displayed on the notification.
        use_html = true, --Do you want to allow the use of HTML in the title and message?
        fields = {
            use_icon = true, --Do you want the icon to be visible on the notification?
            use_title = true, --Do you want the title to be visible on the notification?
            use_message = true, --Do you want the message to be visible on the notification?
        },
    }
})

server-side to client-side

TriggerClientEvent('cd_notifications:Add', source, {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
        use_progress = true, --Do you want a progress bar on the notification?
        stack = true, --Do you want this notification to stack?
        sound = 'notification.ogg', --Choose a sound file name from the [sound] folder.
        icon = 'fas fa-bell', --The icon displayed on the notification.
        use_html = true, --Do you want to allow the use of HTML in the title and message?
        fields = {
            use_icon = true, --Do you want the icon to be visible on the notification?
            use_title = true, --Do you want the title to be visible on the notification?
            use_message = true, --Do you want the message to be visible on the notification?
        },
    }
})

Advanced Notification

What are advanced notifications?

Advanced notifications provide complete customizability, but only experienced developers should use these.

client-side to client-side

TriggerEvent('cd_notifications:Add', {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
        use_progress = true, --Do you want a progress bar on the notification?
        stack = true, --Do you want this notification to stack?
        sound = 'notification.ogg', --Choose a sound file name from the [sound] folder.
        icon = 'fas fa-bell', --The icon displayed on the notification.
        use_html = true, --Do you want to allow the use of HTML in the title and message?
        fields = {
            use_icon = true, --Do you want the icon to be visible on the notification?
            use_title = true, --Do you want the title to be visible on the notification?
            use_message = true, --Do you want the message to be visible on the notification?
        },

        on_create = { --When a notification is created, you can send data to a nui callback.
            location = {
                resource = 'cd_garage', --The resource name where the nui callback is located.
                destination = 'notification_created', --The nui callback name.
            },
            data = 'console.log("Notification created.")' --The data that's been sent to the nui callback in any script.
        },

        on_click = { --When a notification is clicked, you can send data to a nui callback in any script.
            location = {
                resource = 'cd_garage', --The resource name where the nui callback is located.
                destination = 'notification_clicked', --The nui callback name.
            },
            data = 'console.log("Notification clicked.")' --The data thats been sent to the nui callback.
        },

        style = { --You can customise the notification style in CSS.
            notification = {
                class = 'string | JSON',
                border = 'string | JSON',
                background = 'string | JSON',
        
                title = {
                    title_color = 'string | JSON',
                    size = 'string | JSON'
                },
        
                message = {
                    message_color = 'string | JSON',
                    size = string
                },
                
                icon = {
                    fill = 'string | JSON',
                    size = 'string | JSON',
                },
            },
            stack = {
                primary_color = 'string | JSON',
                secondary_color = 'string | JSON' 
            }
        }
    }
})

server-side to client-side

TriggerClientEvent('cd_notifications:Add', source, {
    title = 'Title', 
    message = 'Message',
    type = 'success', --'success | warning | error | info | dark'.
    options = {
        duration = 5, --(in seconds) How long should the notification last?
        use_progress = true, --Do you want a progress bar on the notification?
        stack = true, --Do you want this notification to stack?
        sound = 'notification.ogg', --Choose a sound file name from the [sound] folder.
        icon = 'fas fa-bell', --The icon displayed on the notification.
        use_html = true, --Do you want to allow the use of HTML in the title and message?
        fields = {
            use_icon = true, --Do you want the icon to be visible on the notification?
            use_title = true, --Do you want the title to be visible on the notification?
            use_message = true, --Do you want the message to be visible on the notification?
        },

        on_create = { --When a notification is created, you have the ability to send data to a nui callback.
            location = {
                resource = 'cd_garage', --The resource name where the nui callback is located.
                destination = 'notification_created', --The nui callback name.
            },
            data = 'console.log("Notification created.")' --The data that's been sent to the nui callback in any script.
        },

        on_click = { --When a notification is clicked, you have the ability to send data to a nui callback in any script.
            location = {
                resource = 'cd_garage', --The resource name where the nui callback is located.
                destination = 'notification_clicked', --The nui callback name.
            },
            data = 'console.log("Notification clicked.")' --The data thats been sent to the nui callback.
        },

        style = { --You can customise the notification style in CSS.
            notification = {
                class = 'string',
                border = 'string',
                background = 'string',
        
                title = {
                    title_color = 'string',
                    size = 'string'
                },
        
                message = {
                    message_color = 'string',
                    size = string
                },
                
                icon = {
                    fill = 'string',
                    size = 'string',
                },
            },
            stack = {
                primary_color = 'string',
                secondary_color = 'string' 
            }
        }
    }
})

INFORMATION

Chat Commands

These chat commands can be renamed and/or disabled in the Keys and Commands section of the [configs/config.lua].

The exact usage for each command will be displayed in the chat suggestions when using the commands in-game.

Command	Description
/notifsettings	Open the notification's settings UI.
/notif_test	(Test Command) This is a test command to test the notifications.

Events

These events are completely optional; you can use them if needed.

client-side to client-side

Remove a Notification

The 1st argument [id] is the unique id for that notification.

TriggerEvent('cd_notifications:Remove', id)

Show Notifications

Allows notifications to be displayed on your screen. This is to be used after you disable them.

TriggerEvent('cd_notifications:ShowNotifications')

Hide Notifications

Disables notifications from being displayed on your screen. This can be useful for cutscenes or minigames.

TriggerEvent('cd_notifications:HideNotifications')

Show Settings UI

Opens the notification's settings UI.

TriggerEvent('cd_notifications:ShowSettings')

Hide Settings UI

Hides the notification's settings UI.

TriggerEvent('cd_notifications:HideSettings')

server-side to client-side

Remove a Notification

The 1st argument [id] is the unique id for that notification.

TriggerClientEvent('cd_notifications:Remove', source, id)

Show Notifications

Allows notifications to be displayed on your screen. This is to be used after you disable them.

TriggerClientEvent('cd_notifications:ShowNotifications', source)

Hide Notifications

Disables notifications from being displayed on your screen. This can be useful for cutscenes or minigames.

TriggerClientEvent('cd_notifications:HideNotifications', source)

Show Settings UI

Opens the notification's settings UI.

TriggerClientEvent('cd_notifications:ShowSettings', source)

Hide Settings UI

Hides the notification's settings UI.

TriggerClientEvent('cd_notifications:HideSettings', source)

COMMON ISSUES

Please check out our Troubleshooting Guide before contacting our support.

🔔 Folder Name Make sure the name of the folder either cd_notifications.

ERROR CODES

If you see an error code not listed below, please open a script support ticket in the Codesign Discord.

Server

N/A

Client

N/A

CHANGELOG

Files Changed

Not every update requires you to replace the whole folder. We do this because we understand it's a pain to redo the configs for every update.

• All Files - This means you should delete your old cd_notifications folder, download and add in the latest version, reconfigure the configs folder and restart your server.

• All Files Except config.lua - This means you should do all of the above (in the All Files section) but additionally make a backup of the config.lua file and replace the new config.lua file with the one you made a backup of.

• Specific Files - This means you can copy and paste the SPECIFIC new files over the old ones and restart the server.

Update Type

On rare occasions, you are forced to update to the latest version. Mostly due to authentication updates where the old versions will no longer work.

• Mandatory - This means you MUST update to this new version, or the old versions will no longer work.

• Optional - This means it's completely your choice whether you wish to update to the latest version. But we do not offer support for old versions for obvious reasons; they are old.

Skipping Updates

If you are attempting to update to the latest version but have skipped previous updates, you should update all files just to be safe. For example., let's say you are currently on v4.0.1, you did not update when v4.0.2 was released, and now v4.0.3 is released, and you want to update; you should always use the “All Files” update method.

v1.0.0

01/06/2023

Files Changed:

• All Files

• All Files Except config.lua

• Specific Files

Update Type:

• Mandatory

• Optional

Changelog:

STATUS

• Development Stage: COMPLETE

• Alpha Test Stage: IN-PROGRESS

• Beta Test Stage: NOT STARTED