Embed and Buzz Directly from any web page!
What's good D.Buzz?
Today would like to take a moment to introduce you to the "EMBED BUZZ BUTTON".
This is a handy-dandy button you can add to any web page and enable your users in one click, to Buzz to D.Buzz.
Here is what the button looks like.
Basically, The Buzz button is a small button displayed on your website where viewers can easily share content onto D.Buzz. It consists of two parts; a link to D.Buzz's 'Buzz' composer and the BuzzWidget.js script to enhance the link with the easily identifiable Buzz button.
The simplified explanation is when you click the button, a pop-up window comes up linking to https://d.buzz/#/intent/buzz .
The magic happens in what information you can pass along to that pop-up window. For now however let's review how to add a 'Buzz' button to your webpage or, DApp.
How to add a Buzz button in your website?
Create a new anchor element with a dbuzz-share-button class to allow the buzzWidget.js script to discover the element and turn it into a Buzz Button.
Set the href attribute value to https://d.buzz/#/intent/buzz to create a link that redirects to the DBuzz Web Intent Composer.
<a class="dbuzz-share-button" href="https://d.buzz/#/intent/buzz">Buzz</a>
Set the Buzz text by customizing Buzz web intent query parameters.
-
<a class="dbuzz-share-button" href="https://d.buzz/#/intent/buzz?text=Hello%20dbuzz">Buzz</a> -
Customize Buzz button parameters using data/attributes.
<a class="dbuzz-share-button" href="https://d.buzz/#/intent/buzz" data-text="Hello dbuzz" data-size="large" data-hashtags="dbuzz,hive" data-url="https://d.buzz">Buzz</a> -
Include BuzzWidget.js script once in your page template to enable tracking of Buzz button widget JavaScript events.
<script type="text/javascript" src="https://d.buzz/buzzWidget.js"></script>
Buzz web intent query parameters
The Text parameter
- Appears preselected in a Buzz composer. If not set, it may be auto-populated from the web page's title element.
The URL parameter
- Contains an absolute HTTP or HTTPS URL to be shared on DBuzz. If not set, it may be auto-populated from location.href of the page.
The Tags' parameter
- Must be separated with a comma. Do not include a preceding "#" from each hashtag; the Buzz composer will automatically add the proper space-separated hashtag.
Buzz Button customization
- Add a data-size attribute value of "large" to display a larger Buzz button
We are writing a developers document that will share with everybody shortly, for now use this as a micro guide to get the "EMBED BUZZ BUTTON" set up on your web page or dapp.
Should you have any questions, please post them below or hit us up on discord at : https://discord.gg/5hQZvTxs
