Create and Manage Game Portal Blocks

This article explains how to use Blocks in the Publisher Dashboard to customize both the layout and functionality of your Game Portal pages. It guides you through adding, editing, rearranging, and deleting Blocks so you can build the experience you want.

Follow the steps below to create and customize your page layout using Blocks.

Add a Block

To add a Block to your page:

1. In your Game Portal project, go to the Pages tab and create a new page or edit an existing one.

2. At the top of the page, click the Manage Blocks tab. The Blocks editor opens with some default Blocks to help you get started.

3. Click Add New Block and select the type of Block you want to add from the drop-down menu:

   • Image: Add images to the page.

   • Video: Add videos to the page.

   • Content Preview: Display previews of your News and Articles.

   • CTA: Insert a call-to-action button.

   • HTML: Embed custom design elements using HTML code.

     The HTML Block only supports inline styles.

   • Daily Bonus: Display the Daily Bonus panel so they can view their reward directly from the page.

   • Progress Bar: Display the Progress Bar offer so they can track their current progress directly from the page.

     The Daily Bonus and Progress Bar are only visible to players who are logged in.

4. The new Block is added to the list of Blocks on the page.

Configure a Block

To edit the information in a Block:

1. In your Game Portal project, go to the Pages tab and you’ll see a list of all your pages.
2. Click the ellipsis of the page you want to edit, and then click Edit.
3. Click the Manage Blocks tab.
4. Click the Block you want to configure to view the fields you can edit.
5. Complete the required fields for the Blocks you’re using:

Image

1. In the Image Block, click Item #1.

2. In Default Image, click Upload to open the Upload Image window. Add an image using one of these methods:

   • To upload an image from the computer, do one of the following:
     • Click the Upload tab and select a file from your computer.
     • Drag and drop a file into the window.
   • To select an existing image from the Assets Library:
     • Click the Media tab.
     • Select an image from the Assets Library and click Save.
     • Click the image to reopen the Upload Image window and click the Upload tab to complete the remaining fields.
   • To use an online image:
     • Toggle Image URL on.
     • Enter the image URL.

3. Assign the image an ID Number.

4. Click the drop-down menu and select an image category such as General or Product.

5. Click Save. The window closes.

6. To add a mobile version of the image:

   • In the Mobile Image box, click Upload.
   • Follow the instructions in Step 2.
   Uploading a Mobile Image replaces the Default Image when the page is viewed on a mobile device.

7. Add a Redirect URL.

8. Click the Visibility drop-down menu to select the Block visibility:

   • Visible To All (default): The Block is visible to all visitors.
   • Logged In Only: The Block is visible only to players who are logged in.
   • Logged Out Only The Block is visible only to players who are logged out.

9. In Segments, enter segment names to display the Block to select groups of players.

10. Click Add Item to add another image.

Video

1. In the Video Block, click Item #1 to view the fields.

2. In the Video URL field, paste the URL of the video.

3. In the Mobile Video URL field, paste a video URL to display a mobile version of the video.

   Entering a Mobile Video URL replaces the Video URL when the page is viewed on a mobile device.

4. Enable Autoplay to start the video automatically.

5. Click the Visibility drop-down menu to select the Block visibility:

   • Visible To All (default): The Block is visible to all visitors.
   • Logged In Only: The Block is shown only to players who are logged in.
   • Logged Out Only: The Block is shown only to players who are logged out.

6. In Segments, enter segment names to display the Block to select groups of players.

7. Click Add Item to add another video.

Content Preview

1. In Content Type, select which content type to display: News or Article.

2. In Title, enter the title that will appear above the preview.

3. In Max items, set the number of content items you want displayed in the preview.

4. Click the Visibility drop-down menu to select the Block visibility:

   • Visible to Everyone (default): The Block is shown to all visitors.
   • Logged-in Users Only: The Block is shown only to players who are logged in.
   • Logged-out Users Only: The Block is shown only to players who are logged out.

5. In Segments, enter segment names to display the Block to select groups of players.

CTA

1. In the CTA Block, open Item #1.

2. In Default Asset, click Upload to open the Upload Image window. Add an image using one of these methods:

   • To upload an image from the computer, do one of the following:
     • Click the Upload tab and select a file from your computer.
     • Drag and drop a file into the window.
   • To select an existing image from the Assets Library:
     • Click the Media tab.
     • Select an image from the Assets Library and click Save.
     • Click on the image to reopen the Upload Image window and click the Upload tab to complete the remaining fields.

3. To add a mobile version of the image:

   • In the Mobile Asset field, click Upload.
   • Follow the instructions in Step 2.
   Uploading a Mobile Asset replaces the Default Asset when the page is viewed on a mobile device.

4. Add a Redirect URL.

5. Select External Web Store Redirect if the redirect link as an external web store URL.

6. In Button Text, enter a label for the CTA button.

7. Click the Visibility drop-down menu to select the Block visibility:

   • Visible to Everyone (default): The Block is shown to all visitors.
   • Logged-in Users Only: The Block is shown only to players who are logged in.
   • Logged-out Users Only: The Block is shown only to players who are logged out.

8. In Segments, enter segment names to display the Block to select groups of players.

HTML

1. Click the HTML Block to view the HTML field.

2. Click inside the HTML editor box and enter your HTML:

   • The field is required and you must enter a value.
   • If you need styling, use inline styles. For example: <div style="...">...</div>.

3. Click the Visibility drop-down menu to select the Block visibility:

   • Visible To All (default): The Block is visible to all visitors.
   • Logged In Only: The Block is visible only to players who are logged in.
   • Logged Out Only The Block is visible only to players who are logged out.

4. In Segments, enter segment names to display the Block to select groups of players.

Progress Bar

1. In Default Background Image, click Upload to open the Upload Image window. Add an image using one of these methods:

   • To upload an image from the computer, do one of the following:
     • Click the Upload tab and select a file from your computer.
     • Drag and drop a file into the window.
   • To select an existing image from the Assets Library:
     • Click the Media tab.
     • Select an image from the Assets Library and click Save. The image is saved and the Upload Image window closes.
     • Click on the image to reopen the Upload Image window and click the Upload tab to complete the remaining fields.
   • To use an online image:
     • Toggle Image URL on.
     • Enter the image URL.

2. Assign the image an ID Number.

3. Click the drop-down menu and select an image category such as General or Product.

4. Click Save. The window closes.

5. To add a mobile version of the image:

   • In the Mobile Background Image box, click Upload.
   • Follow the instructions in Step 2.
   Uploading a Mobile Image replaces the Default Image when the page is viewed on a mobile device.

6. Add a Redirect URL.

7. Select External Web Store Redirect if the redirect link as an external web store URL.

8. Click the Visibility drop-down menu to select the Block visibility:

   • Visible To All (default): The Block is visible to all visitors.
   • Logged In Only: The Block is visible only to players who are logged in.
   • Logged Out Only The Block is visible only to players who are logged out.

9. In Segments, enter segment names to display the Block to select groups of players.

Daily Bonus

1. In Default Background Image, click Upload to open the Upload Image window. Add an image using one of these methods:

   • To upload an image from the computer, do one of the following:
     • Click the Upload tab and select a file from your computer.
     • Drag and drop a file into the window.
   • To select an existing image from the Assets Library:
     • Click the Media tab.
     • Select an image from the Assets Library and click Save. The image is saved and the Upload Image window closes.
     • Click on the image to reopen the Upload Image window and click the Upload tab to complete the remaining fields.
   • To use an online image:
     • Toggle Image URL on.
     • Enter the image URL.

2. Assign the image an ID Number.

3. Click the drop-down menu and select an image category such as General or Background.

4. Click Save. The window closes.

5. To add a mobile version of the background image:

   • In the Mobile Background Image box, click Upload.
   • Follow the instructions in Step 2.
   Uploading a Mobile Image replaces the Default Image when the page is viewed on a mobile device.

6. Add a Redirect URL.

7. Enable External Web Store Redirect if the redirect link as an external web store URL.

8. Click the Visibility drop-down menu to select the Block visibility:

   • Visible To All (default): The Block is visible to all visitors.
   • Logged In Only: The Block is visible only to players who are logged in.
   • Logged Out Only The Block is visible only to players who are logged out.

9. In Segments, enter segment names to display the Block to select groups of players.

10. On the top-right of the page, click Update to save your changes.

Reorder a Block

To move the Blocks to different spots in the page layout:

1. In your Game Portal project, go to the Pages tab and you’ll see a list of all your pages.
2. Click the ellipsis of the page you want to edit, and then select Edit.
3. Click the Manage Blocks tab.
4. Use the drag handle to hold and drag the Block to the desired position in the layout.

Delete a Block

1. In your Game Portal project, go to the Pages tab and you’ll see a list of all your pages.
2. Click the ellipsis of the page you want to edit, and then select Edit.
3. Click the Manage Blocks tab.
4. Locate the Block you want to delete, and then click the trash icon on the right side of the Block.

Export and import a Block

You can export and import Blocks to resue them in a different page.

To export a Block:

1. On the top of the page, click Export.
2. The page’s Blocks are downloaded as a JSON file.

To import a Block:

1. Go to the page where you want to add the Blocks, and then click Import to upload the downloaded JSON file from your computer.
2. The imported Blocks will appear on your page.