Here's the example from the datagrepper docs:
<html> <body> <h1>My Site</h1> <p class="lead">Welcome to my site.</p> <p>Here is my latest Fedora activity:</p> <script id="datagrepper-widget" src="https://apps.fedoraproject.org/datagrepper/widget.js?css=true" data-user="ralph" data-rows_per_page="40"> </script> <footer>Happy Hacking!</footer> </body> </html>
Just copy-and-paste that into a file called testing-stuff.html on your machine, and then open that file in your browser. You should see something like this:
Like the docs say, you can change the data- attributes on the <script> tag to perform different kinds of queries. For instance, the following would render a widget showing only Bodhi events about the Firefox package:
<script id="datagrepper-widget" src="https://apps.fedoraproject.org/datagrepper/widget.js?css=true" data-category="bodhi" data-package="firefox" data-rows_per_page="20"> </script>
You might want to include such a thing on a status page for a project you're working on.
You can make queries about all the fedmsg topics (see the fedmsg docs for the full list), topics like org.fedoraproject.prod.fedbadges.badge.award which would render a feed of the latest Fedora Badges awards:
<script id="datagrepper-widget" src="https://apps.fedoraproject.org/datagrepper/widget.js?css=true" data-topic="org.fedoraproject.prod.fedbadges.badge.award" data-rows_per_page="40"> </script>
Please let me know in #fedora-apps on freenode if you have any questions (or if you find some cool use for it -- I love hearing that stuff).