JS component for Tagify.
Checkout demo here github.com/smeshkov/tagifyjs-demo
More info about what is "Tagify" and the reasons behind it can be found here.
Go to Tagify and click "Log in" button at the top-right of the current page.
After you've logged in, you should be able to see "Register site" section in the top menu above.
On the "Register site" put address of the web-site into the "Site" input and click "Register" button, it will result in ID showed above. Copy the ID and save it, you'll need it later.
Insert <script type="text/javascript" src="https://www.zoomio.org/tagifyjs/tagify.js"></script>
into the <head>
section on the registered web-site.
Use API provided by the TagifyJS library to generate tags for selected pages:
<script>
tagifyjs.tagsForAnchors({
// paste your ID from the step 4 in here
appId: 'ID_provided_on_the_step_4',
// CSS class of the pages links (i.e. <a> tags)
// you'd like to generate tags for
anchorsClassName: 'my-awesome-article-link',
// CSS class of the HTML tags you'd like
// to display tags in (should be next to the <a> tags)
targetsClassName: 'my-awesome-article-tags',
// address of the page with relevant pages for a tag
pagesUrl: 'https://my-awesome-web-site.com/blog/relevant',
// number of tags to generate
tagLimit: 3,
// enables admin mode for editing tags
isAdmin: false
});
</script>
This is an optional step. On the pages where you show full body, place following to display releavnt tags:
<script>
tagifyjs.tagsForPage({
// paste your ID from the step 4 in here
appId: 'ID_provided_on_the_step_4',
// CSS id of the HTML tag you'd like
// to display relevant tags/keywords in
targetId: 'my-awesome-relevant-tags',
// address of the page with relevant pages for a tag
pagesUrl: 'https://my-awesome-web-site.com/blog/relevant',
// number of tags to generate
tagLimit: 3,
// enables admin mode for editing tags
isAdmin: false
});
</script>
Final step is to provide a page where you'll display relevant content for given tag/keyword.
It should be a separate page on which you'd need to add following:
<div>
<div id="relevant-pages"></div>
<script>
tagifyjs.relevant({
// paste your ID from the step 4 in here
appId: 'ID_provided_on_the_step_4',
// CSS id of the HTML tag you'd
// like to display relevant stuff in
targetId: 'relevant-pages'
});
</script>
</div>
Congratulations you are now all set and ready to use Tagify!
- Raise a PR against master branch;
- Get PR approved;
- Tag latest commit with the release tag and push it (
TAG=x.y.z npm run tag
); - Merge PR.
- Bump version in
package.json
; - Run
npm run build
; - Run
npm publish --access public
.