Steemit Blog On Your Website (jQuery Plugin)
I created this very simple plugin for anyone to easily display a Steemit blog on a website. On Wednesday I described how to do this manually but now I put it into a tiny jQuery plugin which is very easy to use but also can be further improved a lot... if there's demand.
Check out the
Demo
Demo
You can find the
Plugin on GitHub
Plugin on GitHub
Include Files
Include jQuery, Steem.js and the plugin itself into your website.
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdn.steemjs.com/lib/latest/steem.min.js"></script>
<script src="https://cdn.rawgit.com/mktcode/steemit-posts/aad36fab/steemit-posts.js"></script>
You can also download those files and upload them to you webspace. However, using these CDN resources saves performance and space and is quicker.
Usage
<script>
$('#blog').steemitBlog({
user: 'mkt',
limit: 10,
// ...
});
</script>
Options
- user: string, the steemit.com username (default:
'mkt'
) - limit: integer, the maximum number of posts to show (default:
10
) - dateCallback: callback, a callback function to manipulation the date output, (default:
function (date) {return date;}
- postTemplate: string, the html template for a post (default:
'<a class="steemit-post" href="https://steemit.com${URL}"><h2>${TITLE}</h2><h5>${DATE}</h5><p>${PAYOUT}</p><p>${COMMENTS} comments</p><p>${UPVOTES} upvotes</p></a>'
- resteemedHtml: string, html output if a post was resteemed,
- defaultImage: string, default image source
Placeholders
In the html of thepostTemplate
option you can use the following placeholders:
- ${TITLE}: post title
- ${RESTEEMED}: resteemed html
- ${DATE}: date of post creation
- ${IMAGE}: post image
- ${PAYOUT}: total post payout in SBD
- ${COMMENTS}: number of comments
- ${UPVOTES}: number of upvotes
I hope you like it and maybe someone actually wants to use it. :)
Give me feedback in the comments. I'll try to improve it over time!
Thank you for your attention!
Technology/Science/Future
Nature/Environment/Sustainability
Society/Ethics/Philosophy
Art/Music/Fun
You should link to a demo ;)
Ok... I updated the post with a demo link. :P The problem was, I didn't actually use the plugin on my website. It was the very dirty "proof of concept" implementation working there. :D Now it's the plugin! ;)
I did in the other post. It's just my website: https://markus-kottlaender.de
cannot install in my joomla website error its says "cannot find xml file sir
This seems to have nothing to do with this plugin. (There is no xml involved.) Could you give me more details on the error? Maybe I can help anyway.
Also I did some updates... you should now use this link to include the plugin:
https://cdn.rawgit.com/mktcode/steemit-posts/dab46ba5/steemit-posts.js
Did you get it to work?
Congratulations @mkt! You have completed some achievement on Steemit and have been rewarded with new badge(s) :
Award for the number of posts published
Click on any badge to view your own Board of Honor on SteemitBoard.
For more information about SteemitBoard, click here
If you no longer want to receive notifications, reply to this comment with the word
STOP