How to Place Multiple Widgets on One Page Effectively

Even though every widget has a dedicated script that you need to integrate it on to your project’s source code, you don’t have to use different scripts for each widget. You can use a single widget initializer for more every widget that you want to place on to your website.

We will create an example script of 5 different widgets (that number can be higher or lower if you want) using the two different methods and compare them to see which one is better in terms of compactness, stability, and performance.

We will get 3 different Fixture & Results widgets and 2 Standings widgets from Widget Configurator (Widget Settings > Configurator) and place their scripts without changing anything and merging them into one initializer.

It adds up to a total of 120 lines of code for a total of 5 scripts. Even though that’s still a very good number for such immense widgets, we can make it a lot smaller than that.

Now, let’s try to use a single initializer for all 5 of the widgets.

As you can see, we have managed to do the same placement with just 30 lines of code, instead of 120.

The key thing to do this is creating a container variable for merging 5 widget initializers into 1 container initializer. Doing that is really easy, just integrate your widget’s bundleId’s, your accountId, and then just fill out your widget configurations like the picture above, and that’s it.

With using one widget initializer for 5 different widgets instead of 5 initializers, we have managed to create a much more compact and easily configurable placement system within our website’s source code. With this method, you will be able the present your live sports data much faster, better and without any hassle. We are strongly recommending to use the Broadage Sports Data Widgets with this method.