Fancy badges and SEO improved in steemstem.io v0.6

I have worked on the version 0.6 of our app for more than a month. It took some time since version 0.5 because I was into troubles with several features. However, most problems are now fixed, and v0.6 has been frozen since a few days. It is time to summarize all the changes that have been implemented.

The major new feature of v0.6 concerns gamification, with badges that are displayed close to specific posts.

If a post is posted through the app, the post receives both a grey badge and an automatic 5% stronger upvote. If @steemstem is set as a beneficiary, the post then receives a yellow badge, and normally an up to 5% stronger upvote. I have said normally because I still need to implement this in the voting bot ;)

For some illustrations of the badges, please see below.

In addition, I have tried to fix the Open Graph meta tags associated with each page to get a better SEO. When one inspects any page, we can indeed see those tags. However, those meta tags should be there for the various crawlers crawling the web… Except that they aren’t and I don’t know why. I am still struggling to understand what is going on, and any help would be nice here…

For the rest of this update, I have implemented many bug fixes and improvements (markdown is for instance now supported for post creation). The list, together with a few screenshots, is shown below.

The pull request is available from here, and I recall that our GitHub repository is available from there. The list of commits is given at the end of the post. Starting from v0.7, I will also increase the number of commits, having instead of 4-5 big commits, many smaller ones. This will allow to keep things more organized (one commit per change).

---

Features of v0.6

1. Gamification: Badges (see the figure below)

• Posts posted from the app get a grey posted on steemstem.io badge (commit #2). Note that this guarantees an extra support of 5% when the post is upvoted.
• Posts setting @steemstem as a beneficiary get a golden set steemstem as a beneficiary badge (commit #3). Note that this will soon guarantee an extra support in curation that could range up to 5%.

2. Other improvements

• Markdown is supported for post creation and editing (commit #1, illustrated below).

• The toolbar of the wysiwyg editor when editing an existing post has been improved by more buttons (commit #1).
• Addition of comments in post.js and card.js (commit #2).
• SEO has been improved (via open graph tags when elements are inspected). Crawlers are still not happy, but I can’t change the routing entirely at the moment, which is probably (please confirm if you know) what I have to do (commit #4).

3. Minor bug fixes.

• Fixing the Beneton bug in which the background colors were not displayed in posts. Thanks @alexs1320 for reporting it (commit #2).
• Some posts were displayed twice. (commit #2 and #4).
• The rendering of articles posted on steemstem.io was not great on steemit/busy. This has been improved. Thanks @zen-art for reporting this (commit #4).
• The button for the language selection was stretching over the user button. Thanks @justtryme90 for reporting this (commit #4).
• The compatibility with posts posted with musing ensured (commit #4).
• The permlink generated with each post now contains a timestamp to make it unique. Thanks @alexs1320 for reporting this (commit #4).
• The usage of autolinker (in the post bodies) has been removed. Users are adding their links by themselves and this generates crashes of the app. Thanks @eniowl for reporting this (commit #5).

Summary:

• Pull request link.
• Commits: 1, 2, 3, 4, 5.
• GitHub repository.

---

_{Make sure to follow SteemSTEM on steemstem.io, Steemit, Facebook, Twitter and Instagram to always be up-to-date on our latest news and ideas. Please also consider to support the project by supporting our witness (@stem.witness) or by delegating to @steemstem for a ROI of 65% of our curation rewards (quick delegation links: 50SP | 100SP | 500SP | 1000SP | 5000SP | 10000SP).}