Horje
Allows you to add textual annotations to images by select a region of the image and then attach a textual description. Wordpress Tutorial

Noted That:

  • To install correctly this demon-image-annotation.zip .
  • Fisrt Download the demon-image-annotation.zip to your computer
  • Extract/Open demon-image-annotation.zip to Your Computer.
  • Then, Find readme.txt file inside demon-image-annotation.zip and Open readme.txt .
  • Now, Read the Requirements of this plugin. Which Wordpress Version and PHP Version are required to run this Plugin in Your Wordpress Site.
  • Then, Follow the Tips Below.

Start the Tips:

1. First Download " demon-image-annotation.zip " Plugin to your Local Computer. (Click Download)

2. Then, Login to your " yourdomain.com/wp-admin " Dashboard.

/stack/wp/e1593231376d7d849d2-4597-4fa3-a6ff-1eca18f72aab.png

3. Then, Click on " Plugins " + " Add New " from left sidemenu of Dashboard.

/stack/wp/e1593231378Screenshot20.png

4. Now, Click on "Upload Plugin" button.

/stack/wp/e1593231380Screenshot-2019-4-2AddPluginsHorjeWordPress.png

 

5. Now, Browse " demon-image-annotation.zip "  Downloaded plugin from your computer, Where you downloaded demon-image-annotation.zip According to Step – 1 Above then, click on " Install Now"

/stack/wp/e15931461531577025694plugin.png

6. Now, Click on " Active Plugin"

/stack/wp/e15932313830ca45529-bf73-4101-8178-53ae60ce549f.png

7. Then, See left sidemenu. " demon image annotation " folder is added on left sidemenu. Now, Click on " demon image annotation " folder.

   Noted that: If you do not see " demon image annotation " folder on left sidemenu then, see at left sidemenu " Settings " or " Tools ".

8. Now you configure yourself oR Watch video tutorial below about  demon image annotation Configurtions and Settings or How to work " demon image annotation " in your WordPress site.

 

oR

After Activated Plugin According to Step-6 then,

  1. Go to " Plugins " + " Installed Plugin " from Wordpress Admin Panel Leftside Menu.
  2. or Direct go to: https://yourdomain/wp-admin/plugins.php
  3. Then, Find " demon image annotation " Activated Plugin from Plugin List.
  4. Then, Click on " Settings " from Plugin that is demon image annotation
  5. Now, Edit/Add/Config the setting and Click on " Save Changes " button,
WP Plugin Setting



Guide

Installation

  1. Put the plugin folder into [wordpress_dir]/wp-content/plugins/
  2. Go into the WordPress admin interface and activate the plugin
  3. Choose the settings you want in demon-image-annotation settings.

How to use

  1. First enter div wrapper id or class in settings where your post content appear, or else the plugin can’t find the wrapper to start.

    Example (.entrybody)

       

  2. To embed annotations and comments on images, your img tag must have id attribute value start with ‘img-‘ , this plugin already did the trick if you enable Auto Generate Image ID option.

  3. If you wish to add an id attribute maunally, here is the guide on how to insert id attribute to img tag.
    – First disable Auto Generate Image ID option
    – Add an id attribute start with ‘img-‘ follow by unique id to img tag.
    – All the images must have unique and different id or else you will get the same comments.

    Example (img-4774005463)

  4. Decide the option for WordPress Comments setting.

    Sync with wordpress comments:
    – image note sync with wordpress comment database
    – modified comment will auto update both database
    – deleted comment from wordpress comment will not sync, have to delete manually in image notes table list.
    – new image note from annoymous will auto add into wordpress comment as waiting approval.
    – the image note only publish when the comment is approve.

    Not sync with wordpress comments:
    – standalone image note database.
    – new image note will publish without approval.

    Pls note if you switch the option, the comments added with previous option will not load.

Usage:

  1. Disable Add Note button:
    Add an addable attribute with value “false” to disable the add note button, but image notes still viewable.
    Login User who can Moderate Comments still able to see Add button option.

  2. Exclude image:
    Add an exclude attribute to disable image annotation function.

  3. Comments thumbnail:
    To add thumbnails to your comments list manually, just add the php code below in your comment callback function.

    comment_ID);
    }?>


textual , allows , annotations , images , select , region , image , then , attach , description ,

Name

Read Article
https://develop.horje.com/learn/1434/reference