=== WP SoftLinks ===
Contributors: swiftweb
Donate link: http://www.swiftweb.nl/
Tags: softlink, post link replacement, TinyMCE, data-wp-id
Requires at least: 3.6
Tested up to: 3.9.1
Stable tag: 1.0
License: GPLv3
License URI: http://www.gnu.org/licenses/gpl.html

This plugin allows you to use a simple HTML tag that dynamically generates href and src tags. Easy to use, and extremely helpful.

== Description ==

We were tired to alter every link and image in posts, pages or widgets when switching from development to live environments.

e.g. when you insert an image in TinyMCE on your development environment (http://dev.example.com), the image has a hard URL: http://dev.example.com/media/2014/06/example.jpg
When switching to your live environment (http://live.example.com), you change your WordPress Site URL, but the image in the content is still http://dev.example.com/media/2014/06/example.jpg.
This is very frustrating, you have to alter each page, post, widget etcetera...

This plugin solves that problem. It automatically adds a data-wp-id tag when you insert an image or link in your TinyMCE.
The data-wp-id tag contains a unique ID from the wp-post table in WordPress.

When displaying the content on the front-end this plugin automatically recognizes the data-wp-id tag and replaces the src="" and href="" with the correct permalink.
You can use the tag anywhere you want, simply add the data-wp-id="123" (where 123 is the ID).

= So, how does it work? =

The plugin automatically adds the data-wp-id when inserting an image or link in the WordPress editor.
> Normally it would be: `<img src="http://dev.example.com/media/2014/05/example-150x150.jpg" class="size-thumbnail" width="150" height="150" />`
>
> But with this Plugin: `<img data-wp-id="123" src="#" class="size-thumbnail" width="150" height="150" />`
>
> On the Front-End it will be outputted as: `<img src="http://live.example.com/media/2014/05/example-150x150.jpg" class="size-thumbnail" width="150" height="150" />`

Another example, adding a link:
> Normally it would be: `<a href="http://dev.example.com/example-page" target="_blank" />`
>
> With this Plugin: `<a data-wp-id="100" href="#" target="_blank" />`
>
> On the Front-End it will be outputted as: `<a href="http://live.example.com/example-page" target="_blank" />`

== Installation ==

1. Upload the `wp-softlinks` folder to the `/wp-content/plugins/` directory
1. Activate the plugin through the 'Plugins' menu in WordPress
1. Place `data-wp-id="1234"` in any HTML tag of your choice.

== Frequently Asked Questions ==

= How does it work? =

The plugin has a hook on the_content that parses the content. Every HTML tag that contains a data-wp-id, will be converted in a perfect link or source.

= How does it work under the hood? = 

The plugin uses the DOMDocument Class in PHP to parse the HTML. Tags will be replaced and removed, and clean HTML will be outputted. So no Javascript or whatsoever.

= Do I have to add the data-wp-id tag manually? = 

You can, but it will be inserted automatically by the Plugin, when inserting an Image or Link in the WordPress editor.

= Can you give me an example? = 

Sure, you add a data-wp-id to an image: <img src="#" data-wp-id="24" class="size-thumbnail" />, it will be converted to a clean URL: <img src="http://www.example.com/media/2014/05/example-150x150.jpg" class="size-thumbnail" />

= Can I use this with HTTPS? =

Yes, because the plugin uses the WordPress Site URL to generate a link.

= Can I use it with any HTML tag? =

Sure, you can use any HTML tag, and it recognizes automatically if the tag needs a src="" or href=""

= How does it work with image sizes? =

WordPress adds a class to any image size (e.g. size-thumbnail). The plugin recognizes this class and will return the correct link.

= Can I use it in my plugins and themes? = 

Currently not, but we are working on that.

== Changelog ==

= 1.0 =
Fixed data-wp-id tag in stead of shortcode.

== Upgrade Notice ==

= 1.0 = 
Major upgrade, removed [softlink] shortcode, easier to use with data-wp-id tag.

== Screenshots ==

1. An example how a link works with the data-wp-id
2. An example how an image works with the data-wp-id
3. The image remains intact in the editor
4. The link modal contains an ID field
