How to Tagify

By now, you might already know what is Tagify. If not, you can read about it in “Tags as a Service”.

The idea is simple - it generates keywords (tags) for a content of your choice on your web-sites, this helps solving navigation and categorization issues, so you can focus on what’s important - content, instead of spending your time on solving the navigation issue yourself and building the whole thing from ground up.

Yes, it is that simple and if you’d like to “Tagify” your web-site, just follow these steps:

Click “Log in” button on the right side of the top bar.

2. Register your web-site

After you’ve logged in, you should be able to see “Register site” section in the top menu above.

3. Get app ID for you web-site

On the “Register site” page put the address of the web-site into the “Site” input and click “Register” button, this will result in ID showed above. Copy the ID and save it, you’ll need it later.

4. Add TagifyJS to the web-site

Insert <script type="text/javascript" src="https://www.zoomio.org/tagifyjs/tagify.js"></script> into the <head> section of your registered web-site.

5. a) Mark pages in the list

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>

5. b) Optional - mark individual pages

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>

6. Provide list of relevant

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!