Add the app to a board

Navigate to a board of your choice and click the + button to add a new view. Now go to Apps and click Board to Website Widget. Now all board data is loaded and you see a preview of your widget.

Step 1

Open the app

You are now ready to customize and publish your first widget. At this point, the order of board columns represent the order in your widget. You may want to reorder them in your main board.

Step 2

Customize the settings

Choose a layout and adapt the given settings to your needs like hiding specific board columns or updating colors. You can make your widget perfectly match your website branding.

Step 3

Publish widget

Once you're done setting up your widget and its content, simply click the Publish widget button at the top right and follow the steps along on screen. You can now embed or share your widget.

Documentation

If you want to learn about all the settings you can adjust in detail, just open the in-app documentation in the top right, next to the publish button. You will find a visual reference and a short description.

Advanced Feature

How to use URL parameters on embedded widgets for advanced control

By manually adding URL parameters to your embedded widget, you can take advanced control over what is shown in your widget and overwrite settings. If you need assistance, feel free to contact us.

Use Case

Board items are split into groups

You have one board containing all your items, and those items are separated by groups. And you want to only display items per group across multiple website pages or sections. In this example, we have products on different categories (Show board) and we only want to embed the Barstool group products. The default widget URL looks like this, showing all products:

https://widgets.getgorilla.app/66c9df7655546acb?type=embed

By simply adding the filter_group parameter and passing in the designated group name, you can narrow down the displayed items further:

https://widgets.getgorilla.app/66c9df7655546acb?type=embed&filter_group=Barstool

Tip: If your group name contains blank spaces, you should replace those with %20 to encode the URL properly:

https://widgets.getgorilla.app/3fdb3798bab9c146?type=embed&filter_group=Under%20consideration

Use Case

Overwrite widget settings for specific embeds

Lets stick the the example widget from above (Show board) and overwrite the widgets background, border and headline colors. The default widget URL looks like this, inheriting its default settings:

https://widgets.getgorilla.app/66c9df7655546acb?type=embed

Now lets add three parameters backgroundColor, borderColor and secondaryColor to overwrite the described settings:

https://widgets.getgorilla.app/66c9df7655546acb?type=embed&setting_backgroundColor=%23ffcc00&setting_borderColor=%23ffcc00&setting_secondaryColor=%23ffcc00

Tip: Any setting available in the widget editor can be accessed in URL parameters by its name, like shown above. Any non-alphanumeric letter must be encoded. Since we pass in a HEX code color above, we need to encode # to %23.

Interested in a product demo?

Let's learn about your requirements, answer questions, and
review ways how we can help you and your organization with
our monday.com apps and solutions.