Show Gameball Player Widget

Search…
Get started on integrating the Gameball players's profile into your website or web app
In order to show Gameball profile widget, you need to add the widget javascript code snippet to every webpage where you want the widget to appear. Paste the code snippet immediately before the closing tag. If you use templates to dynamically generate pages for your site, like PHP, ASP, or similar technology, you can paste the code snippet into its own file, then include it in your page header.
1
<script>
2
    window.GbLoadInit = function(){
3
        GbSdk.init({
4
            APIKey: '{{Your_API_Key}}'
5
            lang: 'en',
6
            playerUniqueId: '',
7
            playerAttributes:{}
8
        });
9
    };
10
</script>
11
<script defer src="https://assets.gameball.co/widget/js/gameball-init.min.js"></script>
Copied!
Widget Modes
The widget supports two different modes,  a guest view and a player view. Each can be shown to your website visitors with the same code snippet and serve different usecase. 
A guest view is normally what you want your guests (non logged-in user) to see about the programs your offering. This can be used to encourage guest to create accounts and sign in to enjoy your rewards programs. Where a player view is used to let your players (logged-in users) track their programs in your rewards program and enjoy their benifits. 
Guest View
For guest customers, non-logged in users, use the below snippet adding your Gameball APIKey. Please check the article How can you get your account integration details? (API Key & Transaction Key) to learn more on how to get your unique APIKey.
1
<script>
2
    window.GbLoadInit = function(){
3
        GbSdk.init({
4
            APIKey: '{{Your_API_Key}}'
5
            lang: 'en',
6
            playerUniqueId: '',
7
            playerAttributes:{}
8
        });
9
    };
10
</script>
11
<script defer src="https://assets.gameball.co/widget/js/gameball-init.min.js"></script>
Copied!
Player View
For player view, all you need to do is to set the playerUniqueId value to the current logged-in user. This is how your player will be identified and tracked at Gameball, hence make sure to send a permenant consistent id across a user’s lifetime.  Could be database ID, random string, email or anything that uniquely identifies the player.
In addition to the playerUniqueId, optional player attributes can be sent to enrich the player's profile at Gameball. You can send non, all, or selected attributes to Gameball depending on how you would like to enrich your player's profile.
Everytime the widget is initialized with player data, the player profile is created or updated at Gameball side. You may consider enriching your Gameball's player profile with attributes that are not avialable to the UI by using server side Create\Update Player API​
1
<script>
2
    window.GbLoadInit = function(){
3
        GbSdk.init({
4
            APIKey: '{{Your_API_Key}}'
5
            lang: 'en',
6
            playerUniqueId: '{{logged_in_player_unique_id}}',
7
            playerAttributes: {
8
                displayName: 'john austin',
9
                email: '[email protected]',
10
                custom:
11
                {
12
                    'height': '1.8'
13
                }
14
            },
15
        });
16
    };
17
</script>
18
<script defer src="https://assets.gameball.co/widget/js/gameball-init.min.js"></script>
Copied!
Choose an Unchangeable Player Unique ID
Gameball user profile gets created using the playerUniqueId. It is highly recommended to have the unique ID as an identifier that would NEVER be changed. If this unique ID changes for a given player, you risk losing all original data for that player and hence losing their points and rewards on Gameball. Accordingly, it is NOT recommended to use email address or mobile number as the unique ID as both can be changed by the user at anytime.
Widget Parameters Description
Parameter
Type
Required
Description
APIKey
string
Yes
Client API key
lang
string
Yes
Your platform language preference to view Gameball Widget with. 
Note: The language provided should be as per configured languages in your account. If not provided the Gameball profile widget will be shown with your account default language
Example: "en", "fr".
playerUniqueId
string
Yes
Unique identifier for the player in your database.
Could be database ID, random string, email or anything that uniquely identifies the player.
playerAttributes
object
No
An object with set of properties that you want to set for the player.
playerAttributes Object
Parameter
Type
Description
displayName
string
Player's display name
firstName
string
Player's first name
lastName
string
Player's last name
gender
string
Player's gender. Example: M or F, Male or Female.
email
string
Player's email
dateOfBirth
string
Player's date of birth
Example: "1980-09-19T00:00:00.000Z"
joinDate
string
Player join date at your system.
Example: "2019-09-19T21:06:29.158Z"
tags
string
Comma separated string of tags to be attached to the player.
Example: "VIP,Platinum"
community
string
Describe which community a player belongs to.
Example: ?
custom
object
Key value pairs of any extra player attributes.
{"class" : "E2022", "weight" : 78}
Profile Languages
For websites with multiple languages, how you can change Gameball widget language based on active website language. Gameball supports multiple languages for the player profile widget. The widget language can be changed based on your player's (customer) active language on the website.
Learn how you can configure the languages on your Gameball account through this article.
Supported Languages & Codes
Language
Code
Arabic
ar
Dutch
nl
English
en
French
fr
German or Deutsch
de
Hungarian
hu
Italian
it
Portuguese
pt
Spanish
es
Swedish
sv
Taiwanese Mandarin
zh-TW
In order to show the correct language of the widget based on the active language on the website, you just need to use the language code inside the lang variable in the code snippet.
​
​
Installing Gameball - Previous
Web
Track Player Events
Last modified 4mo ago
Copy link
Contents
Widget Modes
Guest View
Player View
Widget Parameters Description
Profile Languages