Skip to content
This repository has been archived by the owner on Apr 2, 2020. It is now read-only.

Commit

Permalink
Merge pull request #37 from fusioneng/release-0-1-0
Browse files Browse the repository at this point in the history 
Update readme and strings for v0.1.0
  • Loading branch information
Daniel Bachhuber committed Jun 3, 2015
2 parents 9e5904b + b256c3a commit 1e3e7e8
Show file tree
Hide file tree
Showing 6 changed files with 111 additions and 203 deletions.
127 changes: 37 additions & 90 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,73 +1,44 @@
# Image-shortcake #
**Contributors:** fusionengineering
**Tags:** shortcodes, images
**Requires at least:** 3.0.1
**Tested up to:** 4.2
**Stable tag:** 0.1
**License:** GPLv2 or later
**License URI:** http://www.gnu.org/licenses/gpl-2.0.html

Image Shortcake adds a shortcode for images, so that themes can template and
filter images displayed in posts. It is designed to work with the UI provided
by the [Shortcake (Shortcode UI)](https://github.com/fusioneng/Shortcake)
plugin,
# Image Shortcake #
**Contributors:** fusionengineering, goldenapples, danielbachhuber
**Tags:** shortcodes, images
**Requires at least:** 3.0.1
**Tested up to:** 4.2
**Stable tag:** 0.1.0
**License:** GPLv2 or later
**License URI:** http://www.gnu.org/licenses/gpl-2.0.html

Image Shortcake adds a shortcode for images, so that themes can template and filter images displayed in posts. Although it can be used standalone, it is designed to work with the UI provided by the [Shortcake (Shortcode UI)](https://github.com/fusioneng/Shortcake) plugin.

## Description ##

When images are inserted into posts from the media library or media uploader,
only the html of the `<img>` tag and the link around it (if any) are preserved.
This means that themes which want to change the way images are marked up in
content don't have an easy way of doing this.
When images are inserted into posts from the media library or media uploader, only the html of the `<img>` tag and the link around it (if any) are preserved. This means that themes which want to change the way images are marked up in content don't have an easy way of doing this.

Image Shortcake is an attempt to solve this problem, by saving images in post
content as _shortcodes_ rather than HTML. The output of shortcodes can be
easily filtered in themes, plugins and templates, and since the original
attachment data is preseved as attributes on the shortcode, it becomes much
easier for modify the way images are marked up in themes.
Image Shortcake is an attempt to solve this problem, by saving images in post content as _shortcodes_ rather than HTML. The output of shortcodes can be easily filtered in themes, plugins and templates, and since the original attachment data is preseved as attributes on the shortcode, it becomes much easier for modify the way images are marked up in themes.

For best results, use this with the [Shortcake (Shortcode
UI)](https://github.com/fusioneng/Shortcake) plugin. Shortcake offers an
easy to use interface to manage shortcodes in post content.
For best results, use this with the [Shortcake (Shortcode UI)](https://github.com/fusioneng/Shortcake) plugin. Shortcake offers an easy to use interface to manage shortcodes in post content.

What could you use this for? Well, at [Fusion](http://fusion.net) we use this
shortcode for:
What could you use this for? Well, at [Fusion](http://fusion.net) we use this shortcode for:

* **Responsive Images**. By filtering the output of the `[img]` shortcode
image tag, we're able to insert the `srcset` attribute, so that all of
the images on our site are served responsively to browsers that support
that.
* **Responsive Images**. By filtering the output of the `[img]` shortcode image tag, we're able to insert the `srcset` attribute, so that all of
the images on our site are served responsively to browsers that support that.

* **Inline sharing buttons**. We've added share links to each of the
images on our site. Because these are inserted through a filter on
a shortcode and not in the post content, it's easy to modify them on the
fly. And having this logic in template files rather in on-page javascript
that runs after page load makes it quicker for users.
* **Inline sharing buttons**. We've added share links to each of the images on our site. Because these are inserted through a filter on a shortcode and not in the post content, it's easy to modify them on the fly. And having this logic in template files rather in on-page javascript that runs after page load makes it quicker for users.

* **Photo credits**. We've added "credit" as an image meta field, and we
use a filter on 'img_shortcode_output_after_linkify' to display it on all
images.
* **Photo credits**. We've added "credit" as an image meta field, and we use a filter on 'img_shortcode_output_after_linkify' to display it on all images.

See the [Installation](#Installation) section for more ideas and tips for
custom image templates.
See the [Installation](#Installation) section for more ideas and tips for custom image templates. [Get involved with the project](https://github.com/fusioneng/image-shortcake) on Github.

## Installation ##

### Customizing Output ###

The whole point of using shortcodes rather than HTML tags for images is
that you can customize the markup of images in your theme. This plugin
offers three primary hooks to modify the output:
The whole point of using shortcodes rather than HTML tags for images is that you can customize the markup of images in your theme. This plugin offers three primary hooks to modify the output:

* `img_shortcode_output_img_tag`: Filters the output of the <img> tag
before wrapping it in link or caption
* `img_shortcode_output_after_linkify`: Filters the output of the <img>
tag after wrapping in link
* `img_shortcode_output_after_captionify`: Filters the output of the <img>
tag after wrapping in link and attaching caption
* `img_shortcode_output_img_tag`: Filters the output of the <img> tag before wrapping it in link or caption
* `img_shortcode_output_after_linkify`: Filters the output of the <img> tag after wrapping in link
* `img_shortcode_output_after_captionify`: Filters the output of the <img> tag after wrapping in link and attaching caption

You can, of course, disregard the markup generated by this plugin
altogether and use a template part for images if you want. This example
adds EXIF data below all images containing those fields, in all post content:
You can, of course, disregard the markup generated by this plugin altogether and use a template part for images if you want. This example adds EXIF data below all images containing those fields, in all post content:

in the theme's `functions.php`:

Expand Down Expand Up @@ -106,7 +77,7 @@ in a template file called `inline-image.php`:
if ( is_array( $exif_data ) ) {
echo '<ul class="image-meta">';
foreach ( $exif_data as $field => $value ) {
echo '<li>' . $field . ': ' . $value . '</li>';
** echo '<li>' . $field . ':** ' . $value . '</li>';
}
echo '</ul>';
}
Expand All @@ -115,54 +86,30 @@ in a template file called `inline-image.php`:

### Data Migration ###

The plugin comes with two [WP-CLI](http://wp-cli.org) commands to migrate
images in your existing content into the `[img]` shortcode format used by
this plugin. _Note: if it isn't clear, this is an early release -- use
at your own risk, and make sure you've backed up your posts before
migrating!_
The plugin comes with two [WP-CLI](http://wp-cli.org) commands to migrate images in your existing content into the `[img]` shortcode format used by
**this plugin. _Note:** if it isn't clear, this is an early release -- use at your own risk, and make sure you've backed up your posts before migrating!_

`wp image-shortcake migrate <ids> [--dry-run]`

This command searches the post content of the posts specified in `<ids>`,
and replaces any `<img>` tags or `[caption]` shortcodes with `[img]`
shortcodes. Currently it only catches images added through the media
library; custom img tags will not be converted.
This command searches the post content of the posts specified in `<ids>`, and replaces any `<img>` tags or `[caption]` shortcodes with `[img]`
shortcodes. Currently it only catches images added through the media library; custom img tags will not be converted.

If you add the `--dry-run` flag, no replacements will actually be
performed, just a summary report of the changes which would have been
made.
If you add the `--dry-run` flag, no replacements will actually be performed, just a summary report of the changes which would have been made.

`wp image-shortcake revert <ids> [--dry-run]`

This command finds all `[img]` shortcodes in the content of any of the
posts specified in `<ids>`, and replaces them with the markup that would
be generated by those shortcodes. Note that this runs any filters in your
theme, so that if you have filtered the output of the shortcodes at any
output, those filters will be reflected in the coverted post content.

This command finds all `[img]` shortcodes in the content of any of the posts specified in `<ids>`, and replaces them with the markup that would be generated by those shortcodes. Note that this runs any filters in your theme, so that if you have filtered the output of the shortcodes at any output, those filters will be reflected in the coverted post content.

## Screenshots ##

### Shortcode UI form as accessed from Insert Media > Insert Post Element ###
![Shortcode UI form as accessed from Insert Media > Insert Post
Element](http://s.wordpress.org/extend/plugins/image-shortcake/screenshot-1.png)

This is the Shortcode UI form as accessed from Insert Media > Insert Post
Element. (Note that you can also insert images as usual, by inserting them in
the Media Library - they will be transparently converted into shortcodes behind
the scenes for you.)
### 1. This is the shortcode UI form as accessed from **Insert Media > Insert Post Element**. (Note that you can also insert images as usual, by inserting them in the Media Library - they will be transparently converted into shortcodes behind the scenes for you.) ###
![This is the shortcode UI form as accessed from **Insert Media > Insert Post Element**. (Note that you can also insert images as usual, by inserting them in the Media Library - they will be transparently converted into shortcodes behind the scenes for you.)](http://s.wordpress.org/extend/plugins/image-shortcake/screenshot-1.png)

### Image preview renders in the editor just as usual ###

![Image preview in editor](http://s.wordpress.org/extend/plugins/image-shortcake/screenshot-2.png)

Image preview renders in the editor just as it normally would. The Shortcake
plugin's edit/delete buttons are available to modify the shortcode through the
provided UI.
### 2. Once inserted into a post, the image preview renders in the editor just as it normally would. The Shortcake plugin's edit/delete buttons are available to modify the shortcode through the provided UI. ###
![Once inserted into a post, the image preview renders in the editor just as it normally would. The Shortcake plugin's edit/delete buttons are available to modify the shortcode through the provided UI.](http://s.wordpress.org/extend/plugins/image-shortcake/screenshot-2.png)


## Changelog ##

### 0.1 ###
Initial release (May 1, 2015)

### 0.1.0 (May 1, 2015) ###
* Initial release
2 changes: 1 addition & 1 deletion image-shortcake.php
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<?php
/*
Plugin Name: Image-shortcake
Version: 0.1-alpha
Version: 0.1.0
Description: Provides a shortcode for image elements. Use with the Shortcake plugin for a preview of images
Author: fusionengineering, goldenapples
Author URI: https://github.com/fusioneng
Expand Down
82 changes: 45 additions & 37 deletions languages/image-shortcake.pot
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,16 +2,16 @@
# This file is distributed under the same license as the Image-shortcake package.
msgid ""
msgstr ""
"Project-Id-Version: Image-shortcake 0.1-alpha\n"
"Project-Id-Version: Image-shortcake 0.1.0\n"
"Report-Msgid-Bugs-To: http://wordpress.org/support/plugin/image-shortcake\n"
"POT-Creation-Date: 2015-05-04 14:42:41+00:00\n"
"POT-Creation-Date: 2015-06-03 23:38:07+00:00\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=utf-8\n"
"Content-Transfer-Encoding: 8bit\n"
"PO-Revision-Date: 2015-MO-DA HO:MI+ZONE\n"
"Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
"Language-Team: LANGUAGE <[email protected]>\n"
"X-Generator: grunt-wp-i18n 0.5.1\n"
"X-Generator: grunt-wp-i18n 0.5.2\n"
"X-Poedit-KeywordsList: "
"__;_e;_x:1,2c;_ex:1,2c;_n:1,2;_nx:1,2,4c;_n_noop:1,2;_nx_noop:1,2,3c;esc_"
"attr__;esc_html__;esc_attr_e;esc_html_e;esc_attr_x:1,2c;esc_html_x:1,2c;\n"
Expand All @@ -24,100 +24,108 @@ msgstr ""
"X-Poedit-Bookmarks: \n"
"X-Textdomain-Support: yes\n"

#: image-shortcake.php:80
#: image-shortcake.php:107
msgid ""
"Shortcode UI plugin is not active. No UI will be available for the image "
"shortcode."
msgstr ""

#: inc/class-img-shortcode.php:22
msgid "Image"
msgid "Thumbnail"
msgstr ""

#: inc/class-img-shortcode.php:29
msgid "Choose Attachment"
#: inc/class-img-shortcode.php:23
msgid "Medium"
msgstr ""

#: inc/class-img-shortcode.php:33 inc/class-img-shortcode.php:34
msgid "Select Image"
#: inc/class-img-shortcode.php:24
msgid "Large"
msgstr ""

#: inc/class-img-shortcode.php:38
msgid "Image size"
#: inc/class-img-shortcode.php:25
msgid "Full size"
msgstr ""

#: inc/class-img-shortcode.php:44
msgid "Thumbnail (%s px)"
#: inc/class-img-shortcode.php:46
msgid "Image"
msgstr ""

#: inc/class-img-shortcode.php:50
msgid "Medium (%s px)"
#: inc/class-img-shortcode.php:53
msgid "Choose Attachment"
msgstr ""

#: inc/class-img-shortcode.php:56
msgid "Large (%s px)"
#: inc/class-img-shortcode.php:57 inc/class-img-shortcode.php:58
msgid "Select Image"
msgstr ""

#: inc/class-img-shortcode.php:60
msgid "Full size"
#: inc/class-img-shortcode.php:62
msgid "Image size"
msgstr ""

#: inc/class-img-shortcode.php:65
#: inc/class-img-shortcode.php:70
msgid "Alt"
msgstr ""

#: inc/class-img-shortcode.php:68
#: inc/class-img-shortcode.php:73
msgid "Alt text for the image"
msgstr ""

#: inc/class-img-shortcode.php:72
#: inc/class-img-shortcode.php:74 inc/class-img-shortcode.php:82
msgid "Quote marks and HTML tags are not allowed"
msgstr ""

#: inc/class-img-shortcode.php:78
msgid "Caption"
msgstr ""

#: inc/class-img-shortcode.php:75
#: inc/class-img-shortcode.php:81
msgid "Caption for the image"
msgstr ""

#: inc/class-img-shortcode.php:79
#: inc/class-img-shortcode.php:86
msgid "Alignment"
msgstr ""

#: inc/class-img-shortcode.php:83
msgid "None (inline)"
#: inc/class-img-shortcode.php:91
msgid "Left"
msgstr ""

#: inc/class-img-shortcode.php:84
msgid "Float left"
#: inc/class-img-shortcode.php:92
msgid "Center"
msgstr ""

#: inc/class-img-shortcode.php:85
msgid "Float right"
#: inc/class-img-shortcode.php:93
msgid "Right"
msgstr ""

#: inc/class-img-shortcode.php:86
msgid "Center"
#: inc/class-img-shortcode.php:94
msgid "None"
msgstr ""

#: inc/class-img-shortcode.php:91
#: inc/class-img-shortcode.php:99
msgid "Link to"
msgstr ""

#: inc/class-img-shortcode.php:95
#: inc/class-img-shortcode.php:104
msgid "None (no link)"
msgstr ""

#: inc/class-img-shortcode.php:96
#: inc/class-img-shortcode.php:105
msgid "Link to attachment file"
msgstr ""

#: inc/class-img-shortcode.php:97
#: inc/class-img-shortcode.php:106
msgid "Link to file"
msgstr ""

#: inc/class-img-shortcode.php:98
#: inc/class-img-shortcode.php:107 inc/class-img-shortcode.php:112
msgid "Custom link"
msgstr ""

#: inc/class-img-shortcode.php:115
msgid "URL to link to (if above link is \"custom\")"
msgstr ""

#. Plugin Name of the plugin/theme
msgid "Image-shortcake"
msgstr ""
Expand Down
Loading

0 comments on commit 1e3e7e8

Please sign in to comment.