# Mini-games on the landing pages

Mini-games can work on anonymous users coming to your landing pages before passing the registration process. 

You can expose Loyalty Wheel, Scratch & Catch, or GiftBox games for visitors to your landing pages. After playing the game and completing registration, the user will get a prize according to the definition of the prize pool.

{% hint style="warning" %}
Important. 

Smartico supports two modes to run mini-games for the anonymous users.

1. Current page is explaining setup of the game in your main "retention" label with possibility to issue prizes after user completes registration
2. Another approach is to setup games in the [Acquisition label](/welcome/~/changes/B87CND5z8x8BAzJwmSVQ/technical-guides/front-end-integration/acquisition-mode.md), where the prizes cannot be transferred after registration, but you are able to use Popups and Push notifications for the anonymous users.
   {% endhint %}

## Setting up the game template in Smartico BackOffice

You need to create a mini-game template for the Visitor mode and define the prize pool the same way as for the real users.

<figure><img src="/files/XUJdhabADqlVEnSnqQgu" alt=""><figcaption><p>Game template in the Visitor mode</p></figcaption></figure>

After creating a template, take a template ID and use it on the landing page as described below

## Setting up Smartico scripts

**Place the Smartico script on the&#x20;**<mark style="color:red;">**landing page**</mark>**&#x20;by adding the following code**

```javascript

<script>
(function(d, r, b, h, s){h=d.getElementsByTagName('head')[0];s = d.createElement('script');s.onload=b;s.src=r;h.appendChild(s);})
(document, 'https://libs.smartico.ai/smartico.js', function() {
    _smartico.initVisitorMode('_label_key_', { brand_key: '_brand_key_', lang: 'DE' });
});
</script>

```

* Replace `_label_key_` with the appropriate label key.&#x20;
* Replace `_brand_key_` with the brand key relevant to your landing page.&#x20;
* Set `lang` to the 2-symbol ISO 639-1 language code.

**Display the game on the&#x20;**<mark style="color:red;">**landing page**</mark>**, add the following JavaScript to execute and show the game:**

```javascript
<script>
_smartico.showVisitorGame({ 
    template_id: 12345,
    onWin: function(prize) {
        window.location.href = 'https://my-casino.com/index.html?_smartico_visitor_win_uuid=' + prize.visitor_win_uuid;
    }
});
</script>
```

* Set `template_id` to the ID of the mini-game template set up in the Smartico BackOffice
* &#x20;Define the `onWin` callback function and retain the value of `prize.visitor_win_uuid`, which should be passed to your main site after the user completes the registration

{% hint style="info" %}
You can choose how to preserve the value and pass it to the main site, such as using cookies, passing it as a URL parameter, or saving it during the registration flow and retrieving it later on the main site.
{% endhint %}

**Setting a position for the mini-game**

By default, the mini-game is opened in the center of the screen as a modal overlay.

You can optionally position the mini-game to be in a specific place and to be part of the page instead of being modal.

For this, you need to define an iframe with the needed sizes and positions and instruct through the script to load the game in the position of this iframe.

```javascript

<iframe style="width:300px;height:300px" id="myframe"></iframe>

<script>
_smartico.showVisitorGame({ 
    template_id: 12345,
    frame_id: 'myframe'
});
</script
```

**Setting up Smartico scripts on the&#x20;**<mark style="color:red;">**main**</mark>**&#x20;site.**&#x20;

When the user completed registration and is redirected to the main site, you need to transfer visitor\_win\_uuid to the main site.

**1st option** is just to pass it as a query parameter to the main site. .e.g&#x20;

```javascript

 window.location.href = 
  'https://my-casino.com/index.html?_smartico_visitor_win_uuid='
  + prize.visitor_win_uuid;
                
```

**2nd option**, you are transferring the value in any way you prefer, but on the main site, you will need to set it in the global variable like this.

```javascript
<script>
    window._smartico_visitor_win_uuid = '667018dc-b158-45b4-b52b-12f3a4a7175c';
</script>
```

**Extended possibilities on the&#x20;**<mark style="color:red;">**landing**</mark>**&#x20;page**

You can get more details about the won prize using the following code:

```javascript
<script>
_smartico.showVisitorGame({ 
    template_id: 12345,
    onWin: function(prize) {
        console.log('Prize ID', prize.id);
        console.log('Prize name', prize.name);
        console.log('Win UUID', prize.visitor_win_uuid);
    }
});
</script>
```

You can prevent the user from playing the game until he completes some steps in the registration process:

```javascript
<script>
var visitorEmail = undefined;

_smartico.showVisitorGame({ 
    template_id: 12345,
    onWin: function(prize) {
        console.log('Prize ID', prize.id);
        console.log('Prize name', prize.name);
        console.log('Win UUID', prize.visitor_win_uuid);
    },
    onBeforePlay: function() {
        if (!visitorEmail) {
            visitorEmail = prompt('Please enter your email', '');
            if (!visitorEmail) {
                return false;
            }
        }
        return true;
    },
})
</script>
```

The onBeforePlay callback should return true or false indicating if a visitor is allowed already to play the game or still need to pass some steps in the registration process.

**Show the game immediately when a visitor opens the landing page**

If you want to show the game right at the point when the landing page is opened, you should place the script in the proper order, as in the example.

```javascript
<script>
(function(d, r, b, h, s){h=d.getElementsByTagName('head')[0];s = d.createElement('script');s.onload=b;s.src=r;h.appendChild(s);})
(document, 'https://libs.smartico.ai/smartico.js', function() {
    _smartico.initVisitorMode('_label_key_', { brand_key: '_brand_key_', lang: 'DE' });
    _smartico.showVisitorGame({ 
        template_id: 12345,
        frame_id: 'myframe'
    });
});
</script>
```

## Instruction for Smartico account managers

To enable mini-games for visitors:

* Add "Mini-games (Visitors)" product on the label
* Pick an existing test user from the label, this user is needed in order for Visitors to act in the system on behalf of the visitor.
* Set GAMIFICATION\_VISTOR\_MODE\_USER\_EXT\_ID to the "User Ext ID Clean" on the label. "User Ext ID Clean" is the same as Ext ID, but without brand specific prefix. E.g. ext id "123:john" and clean will be "john"&#x20;
* On multi-brand solution, be sure that this User Ext ID is from the same brand as will be used in the initialization of the script on the landing page

## FAQ

**Q: Does the Visitor mode require additional configurations?**&#x20;

A: Yes, the Visitor mode requires additional configurations that should be done by Smartico account managers. If you have a multi-brand solution, this setup should be done for all brands associated with your landing pages.

**Q: Is there abuse protection for multiple wins in the games engine?**&#x20;

A: Yes, the game's engine has abuse protection for multiple wins. Once a user plays a game on the landing page and receives a prize after registration, they won't receive additional prizes if they play the visitor game again.

**Q: How long does a user have to complete registration to receive the prize?**&#x20;

A: To receive the prize, the user should complete registration within 24 hours of playing the game.

**Q: Can MatchX game run for the visitor?**&#x20;

A: MatchX is not supported in visitor mode. There is still a possibility to provide it for non-registered users, but it will require the creation of separate labels and more configurations. If you are interested, please contact Smartico Account Managers.

**Q: How are items deducted from the prize pool?**&#x20;

A: The items in the prize pool are fixed and not depleting when won by players.

**Q: How to prevent visitors to play the game multiple times?**&#x20;

A: You can put a cookie or localStorage value in the browser of the user in the onWin callback.  Verify the value on the next visit and don't show the mini-game in case the value is set


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.smartico.ai/welcome/~/changes/B87CND5z8x8BAzJwmSVQ/products/mini-games/mini-games-on-the-landing-pages.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.