Image descriptor is a wordpress plugin which provides an interface to revolutionize your wordpress installation and take your app to the next level.
This plugin is compatible with wordpress 3.5 and above.
Admin section of this plugin is built in Superheroic AngularJS and the awesome jQuery with Twitter Bootstrap.
This plugin provide ways to prepare different creative sections for your web app and in that section you can make some parts highlighted and provide description for those parts. These are hotspots. This plugin is used to describe images. This plugin can be used for different domains such as Education, Health, Engineering etc.
Demo URL : http://worldeschool.in/wp-image-descriptor/
It is very easy to use and has the following features :
100% Responsive and works in all platforms(Mobile, Tablets & Desktops).
Optimized for Touch devices
Social media integration
Cross browser compatibility
Multiple instance on the same page
Shows tweets and youtube videos
Strong interface built in AngularJS and jQuery
Ease to use builder with live preview
Connector style for popup
Draggable popup and icon in live preview
More than 250 Font Awesome icons
Wave and Blink hotspot animations
Popups in Twitter Bootstrap
Drag and drop feature
Image descriptor wordpress plugin is very useful in creating some exclusively creative sections for your web application and its responsive behaviour provides compatibility with small screen and touch devices.
How to use?
Demo URL: http://youtu.be/EpQOqNrU_W4
Click on Image descriptor in the admin menu.
Click on Add new button.
A panel will appear with hotspot name and description.
Fill these fields and submit the form.
Now a screen will appear where we will have to design the awesome.
First of all provide the height and width of the hotspot block container.
Background image can be uploaded, image must be optimized before uploading.
You can also provide background color.
Check the responsive checkbox for enabling responsive behaviour.
Select the icons from the icon list by clicking on any one of the icons.
Selected icon will appear in right side.
Drag and drop the icon into the container.
Hotspot specific fields will appear down.
Show popup on select box provide options for how the popup will appear eg in case of always option the popup apears always, for click the popup will appear on click and for mouseover the popup will appear on mouseover event.
You can provide icon color and icon hover color.
Desired popup position should be provided(top, right, bottom, left).
Provide the desired popup content in the textarea.
In case of social media, like twitter provide the screen name and youtube provide the youtube URL in the text box.
Drag and drop the popup associated with the hotspot anywhere in the block.
Give color to connectors
Copy shortcode from listing page and paste in the editor of post or pages.
More awesome animations to come.
More options for popup position with animated connectors between popup and icon.
Resizeable rectangle as icon.
Sources & credits
Wordpress CMS form http://wordpress.org
AngularJS form http://angularjs.org
Demo Images form http://flicker.com
Twitter Bootstrap from http://twitter.github.io/bootstrap/
jQuery.js from http://jquery.com/
Icons form Font awesome http://fontawesome.io
Minicolors from http://www.abeautifulsite.net
Demo images from: