Thank you for choosing golive.fm web widgets solution!
...
Info | ||
---|---|---|
| ||
This section is only relevant if you deployed your widgets before 30/03/2017 |
Previous widget code
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
<div id="goevent-web" class="goevent-web"> <div class="goevent-web-widget clearfix" data-id="!account" data-default-role="account"></div> <div class="containerPage"> <div class="goevent-web-widget" data-id="!programmation" data-default-role="artists"></div> </div> <script async src="https://s3.amazonaws.com/goeventweb-static.greencopper.com/HASH/PROJECTNAME-YEAR/assets/widgets/widgets_loader.min.js" type="text/javascript"></script> <div id="goevent-web-loader" data-lang="eng"></div> </div> |
Changing the default widget
Changing the default widget (the first widget seen when the page is loaded) is really easy. All you have to do is change the 'data-default-role' value to the widget you want (artists, grid, events, or timeline). If you want the widgets on separate pages of your website, and on each pages show a different widget on page load, you'll have to copy/paste our code in each page, and change the 'data-default-role' attribute.
Example : You have a 'lineup' page on your website where you want to show the artists widget on page load. You'll have your 'data-default-role' set to artists, like this :
Code Block | ||||
---|---|---|---|---|
| ||||
<div id="goevent-web" class="goevent-web"> <div class="goevent-web-widget clearfix" data-id="!account" data-default-role="account"></div> <div class="containerPage"> <div class="goevent-web-widget" data-id="!programmation" data-default-role="artists"></div> </div> <script async src="https://s3.amazonaws.com/goeventweb-static.greencopper.com/HASH/PROJECTNAME-YEAR/assets/widgets/widgets_loader.min.js" type="text/javascript"></script> <div id="goevent-web-loader" data-lang="fre"></div> </div> |
You also have a 'schedule' page on your website, where instead you want to show the grid widget on page load. You'll have your 'data-default-role' set to grid, like this :
Code Block | ||||
---|---|---|---|---|
| ||||
<div id="goevent-web" class="goevent-web"> <div class="goevent-web-widget clearfix" data-id="!account" data-default-role="account"></div> <div class="containerPage"> <div class="goevent-web-widget" data-id="!programmation" data-default-role="grid"></div> </div> <script async src="https://s3.amazonaws.com/goeventweb-static.greencopper.com/HASH/PROJECTNAME-YEAR/assets/widgets/widgets_loader.min.js" type="text/javascript"></script> <div id="goevent-web-loader" data-lang="fre"></div> </div> |
Support for Multiple Languages
If you have a multi-language website (e.g. supporting English and French at the same time), you will have to embed one set of code by language. Simply copy/paste the code in the pages that need to expose the widgets. Change the 'data-lang' attribute in the code so it refers to the appropriate language code (ie : 'eng','fre','spa', etc...).
See below a code sample for the french widgets:
Code Block | ||||
---|---|---|---|---|
| ||||
<div id="goevent-web" class="goevent-web"> <div class="goevent-web-widget clearfix" data-id="!account" data-default-role="account"></div> <div class="containerPage"> <div class="goevent-web-widget" data-id="!programmation" data-default-role="artists"></div> </div> <script async src="https://s3.amazonaws.com/goeventweb-static.greencopper.com/HASH/PROJECTNAME-YEAR/assets/widgets/widgets_loader.min.js" type="text/javascript"></script> <div id="goevent-web-loader" data-lang="fre"></div> </div> |
Force the alphabetical segments of the Artists widget to show or hide
By default, the segments on the Artists widget, sorted alphabetically, are shown if there are 15 or more artists on the widget.
You can bypass this rule by adding the attribute "data-alpha-segments” to the "goevent-web-loader” <div> tag and setting it to “true” or “false”.
See an example here:
Code Block | ||||
---|---|---|---|---|
| ||||
<div id="goevent-web" class="goevent-web"> <div class="goevent-web-widget clearfix" data-id="!account" data-default-role="account"></div> <div class="containerPage"> <div class="goevent-web-widget" data-id="!programmation" data-default-role="artists"></div> </div> <script async src="https://s3.amazonaws.com/goeventweb-static.greencopper.com/HASH/PROJECTNAME-YEAR/assets/widgets/widgets_loader.min.js" type="text/javascript"></script> <div id="goevent-web-loader" data-lang="fre" data-alpha-segments="true"></div> </div> |
...