All Collections
Page Types
Sportsbook: Live and Prematch
Sportsbook: Live and Prematch

Create and customize Live and Prematch Sportsbook page type with SpringBuilder

Karen Sahakyan avatar
Written by Karen Sahakyan
Updated over a week ago

SpringBuilder gives you a unique opportunity to create ready-made Sportsbook pages with a click. This process will take only a couple of minutes.

Before going deeper into this step by step guide, we recommend watching this short explainer video to learn about how easy it is to create a Sportsbook webpage using SpringBuilder.

SpringBuilder has two options: Live and Prematch. To get these pages, head over to the Pages app in the Dashboard, click plus and choose Live or/and Prematch Sportsbook.

You will get the default layout for the Sportsbook page with different sections: Sports List, Search, Live match, Game Markets, Betslip and Jackpot. You can reposition each of the elements, change the alignment, adjust the sizes and not only.

You can also find all those elements in the Left Panel, so in case you need one of them, you can easily drag and drop them to the Crafting Area.

Also, each element has its own settings and styling depending on the functionality of the element. For example, you can configure Game Markets element settings and styles: determine the default view, include Market tooltips that will hint your players the info about each market; as well as add background image for each sports type event view; show Statistics on hover or on click. While styles include Fonts, Borders, Height and Colors.

Just click on each element and play with settings and styles if applicable. When it comes to Betslip, make sure to check out this article to customize it the way you want.

All these apply to the Prematch Sportsbook page equally. 

In the Pages app, you can change the settings of Sportsbook page type. Hover over the page, click Edit to customize title and alias of the page, make it published/unpublished and other settings that are typical to all pages.

You can also search for markets in Sportsbook using our search bar.

From here you can also change the layout of Sportsbook from Classic to European and the opposite. Check out this article for further instructions.

In the page settings get to choose the Sports types of Sportsbook by putting the ticks next to the types you want to have:

- All Sports
- E-sports

- Virtual Sports
- General Sports

- Racing Sports
- UFC/MMA Sports

You can work on the coloring of each Page type (Live & Prematch) which will add your business style to the pages. Hit the three dots to go to the Block Settings, choose ‘Edit styles’ and create your color palette. 

There are two categories for colors: Background and Text. Note that these color rules apply throughout your whole website.

You are offered a wide variety of choice for your Sportsbook coloring as it is shown in the images below:

Furthermore, you have the opportunity to add a background image/video for the whole block. All you need to do is choose the block you want and hit the three dots to go to Block Settings. 

Here change the opacity and make it a background cover, which will change your Sportsbook layout to cover and all the columns will generate their own scroll. 

You can add the desired Video as a Block Background as well. Move to Block Background section > Video Background and paste your link of Youtube, Vimeo into the appropriate field. You can also paste the link of a custom video in .mp4, .webm, ogg formats.

Alignment - To change alignment settings of the element, click on the ‘Alignment’ icon and choose the desired position: top, center, bottom.

Visibility Settings - It enables making a certain Element/Block appear on Desktop, Mobile only, or everywhere by default. Simply hit Visibility Settings and choose the desired option from the dropdown menu to get full control over the Visibility of the Divider on your page.

Next comes Location visibility. Include or exclude specific cities or countries or set the appropriate Custom IP.

Mind the Session visibility as well. The latter one, allows to make certain elements visible only to the logged in users of your website.

Trash Icon - If you don't need one of the elements in Sportsbook anymore, click ‘Trash’ to remove it from your page in a blink of an eye.

We're done!

Be sure that our Sportsbook has many advantages, for one, your users can differentiate tennis court types according to the appropriate colors: red, green or brown.

For more information about pages, check out the Pages app article. Also, read about other Page Types here for more insight on SpringBuilder.

Have an idea, a bug or a feature request? Send them directly to the SpringBuilder team via Chat.

Did this answer your question?