Around month ago PeakD String chat have been released for alpha testing. If you haven't given it a try, feel free to visit https://chat.peakd.com and check out the previous announcement post.
Today is the alpha release day for the messaging widget. This post will serve as a tutorial on how to add it with few steps and optionally customize it in the widget editor.
About the messaging widget:
- Supports encrypted direct & group messages
- Community chat channels
- Keychain login/guest account
- Customizable UI
- Themes
How to add messaging widget to a website
Step 1. stwidget.js lib
Download and host (preferred) or add script: https://chat.peakd.com/stwidget.js (Also available on gitlab)
Step 2. Use the generated code from Widget Editor or from the example below:
Generate the code with customization through the widget editor or copy the example on how to embed the widget with JavaScript shown below.
<!DOCTYPE html>
<html>
<head>
<script src="stwidget.js"></script>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Widget Embed Example</title>
</head>
<body>
<p>Widget Embed example</p>
<div id="customDiv"></div>
<p>You can further customize by tweaking properties. Check out the
<a href="https://chat.peakd.com/widgettest">property editor</a>, send feedback and
feature requests in the chat window above or
<a href="https://chat.peakd.com/t/hive-163399/0">open in new window.</a></p>
<script>
var stwidget = new StWidget('https://chat.peakd.com/t/hive-163399/0');
stwidget.properties = { "requireLogin": false, "sidebar": 2};
var element = stwidget.createElement('450px', '556px', false/*overlay*/, true /*resizable*/);
document.getElementById("customDiv").appendChild(element);
</script>
</body>
</html>
The code example above and other examples on how to overlay the widget and show/hide it on a click of a button in JavaScript or Vue are available here.
Further Customization
Feel free to post customization ideas in the chat: https://chat.peakd.com/t/hive-163399/0
Alternatively
Clone the open source frontend repository and host the widget on your domain to customize it as you see fit.
While not alpha released yet, there is a frontend/backend library that can be used to communicate with the messaging backend nodes to read and post messages.
How to support Peak Open Project
WORK WITH US
If you're a project looking to integrate one of these tools message us.
If you're a developer looking for a part time open source project message us.
WITNESS VOTE
Part of the team has been voted as a top block producer on hive (aka "witness"). You can add your vote for us on the main witness page our "witness" account is @steempeak
VOTE HERE: https://peakd.com/witnesses
OPEN PROJECTS PROPOSAL
You can support our proposal to develop open source tools for the whole Hive community using one of the following links:
- PeakD: https://peakd.com/proposals/223
- Hive.blog: https://wallet.hive.blog/proposals
- Ecency: https://ecency.com/proposals/223
- Or directly on Hivesigner
BENEFICIARY
You can donate 5% of your Hive Reward Pool earnings to @peakd to help use improve the interface: Turn on in settings
SHARE IDEAS AND FEEDBACK
We invite you to share and brainstorm some ideas with us:
- Share on posts #HiveLaunchpad or #PeakOpenProjects
- Reach out on this discord channel
- Create a suggestion on our new feature voting site https://feedback.peakd.com -- use category "Peak Open Projects"
The PeakD Team
About us: https://peakd.com/about
Discord - Blog - Twitter - LinkedIn
This is a really excellent app, I think not many people in Hive know about it. But this app could replace Discord for us Hive users in the future. Congratulations and thank you for your work.
Congratulations @peak.open! You have completed the following achievement on the Hive blockchain And have been rewarded with New badge(s)
Your next payout target is 2000 HP.
The unit is Hive Power equivalent because post and comment rewards can be split into HP and HBD
You can view your badges on your board and compare yourself to others in the Ranking
If you no longer want to receive notifications, reply to this comment with the word
STOP
Check out our last posts:
Support the HiveBuzz project. Vote for our proposal!