Widget ares small pieces of HTML code

Widgets are iframes, meaning a short HTML code that has to be copied inside the web page that will show the collection.

To embed a widget inside your page, copy the following code exactly where it has to be shown:

<script src=”https://www.coeli.cat/apps/v2/coeli.js”></script>

<coeli-widget src=”WIDGET-URL”/>

Depending on the URL inside the src=”” it will appear one widget or another.

Which is the URL of each widget?

Widget to show the search box

This widget only shows the search box with a button on its right side to open the advanced search. Once the user does a search, the results will appear under the search box.

To find the URL of this widget do any search from the heritage object panel of Coeli, click “Advanced search”, click “Public URL”, and finally copy the URL that has appeared until “[…]/HeritageObject/search/”.

Widget to show a gallery of objects

This widget shows the search box followed by a list of objects as an image gallery.

To find the URL of the widget, do the corresponding search in the heritage object panel of Coeli, click “Save search” (give it a name and save), click “Advanced search”, click “Public URL”, and finally copy the URL that appeared.

You can recover the URL from the “Stored searches” panel (upper right menu).

IMPORTANT: you must save the search, if you do not, the URL will not remain so in 24h will stop working.

The results will be ordered exactly as the search you have done (by default is by identifier). You can change the sorting by adding the following parameter at the bottom of the URL:


Example of ascendant sorting in Coeli Cirrus by creation date:


To know the name of the property you can consult the object record in J-SON format from the “Net > Headers” browser inspector, or contact with us.

Widget to show an object record

Search the corresponding object inside the heritage object panel of Coeli, click on it, click “Public URL” (if it does not appear, you have to click “Publish” first) and finally copy the URL that appeared.

Change the appearance / design of the widgets

To adapt the design of Coeli widgets following the corporate guide style of your institution, you should go to “Configure widgets” (upper right menu). From there, you will be able to make the necessary modifications above the default template of Coeli.

You can add a static header or footer from the HTML box, and you can modify the aesthetic aspects through CSS from the CSS box.