Integration notes

Multiple widgets on the same page

<!-- Start Pitchfinder widget -->
<!-- Only use the next line ONCE -->
<script src="https://pitchfinder.org.uk/static/widget/pitchfinder-widget.js"></script>

<!-- Then create as many widgets as you like -->
<script>new PFWidget('standard').render()</script>
<script>new PFWidget('small').render()</script>
<!-- End Pitchfinder widget -->

CSS and styling

The widget will be rendered as a div on your page. You may need to specify additional styling for this div in your site's CSS. For example, if you place it next to an element with a float applied you may want to specify a clear value for the widget. To do this, apply styling to the pitchfinder-widget class.

For example, it might look like this:

.pitchfinder-widget { clear: both; }