Faded Borders for Images

Description

Some web designers like to fade the edges of their images (or select images) in order to provide a softer
contrast between the edges of their image and the background of their website. Doing this typically requires the use
of some sort of photo editing software. Moderately skilled web developers may be able to use CSS and HTML code to
generate a similar effect dynamically. This plugin, however, simplifies the process to merely applying an extra CSS class
to an image after it has been uploaded.

Credits

Special thanks to Ben Nadel for his tutorial on overlaying gradients on images with jQuery.
His tutorial inspired the creation of this plugin. [See the full tutorial]: https://www.bennadel.com/blog/1014-Creating-Transparent-Gradients-With-jQuery.htm

Installation

1. Upload faded-borders-for-images folder to the /wp-content/plugins/ directory
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Insert an image into your page or blog post
4. After inserting the image, click on it, and click the icon that appears in the left-hand corner of the image
5. Click the ‘Advanced Settings’ tab on the window that opens
6. In the CSS Class field, enter the word ‘gradient’
7. Click ‘Update’
8. Publish your post

FAQ

How do I fade the borders of my image?

You have to apply the CSS class “gradient” to the image. To do this, insert the image into your post or page. After inserting it,
click on it, and click the icon that appears in the corner. A window will open allowing you to edit information about the image.
Click the “Advanced Settings” tab, and add the word “gradient” to the CSS Class field. Click “Update”, and then publish your postpage.
That’s it!

Can I customize the color of the faded border?

Yes. In your WordPress Admin Panel, go to Settings, and click the Faded Borders on Images link on the Settings sub-menu. Using the admin screen that appears,
enter the color you would like to use when fading the edges of your images, and click “Save”.

How do I fade the edges of images that are part of my WordPress theme (i.e. not in a post or page)?

Using CSS or the raw code of your theme, apply the class “gradient” to your images. Be sure you have permission before you edit
your WordPress theme, if your theme is not publicly licensed.

Reviews

Contributors & Developers

Changelog

Fixed a problem causing the url to display at the top of each page.
Fixed a glitch in the folder reference.

1.0.3

*Up until now, the color had been dynamically obtained from a hidden span. Created compatability issues with some themes. Fixed that.

1.0.2

*Changed bloginfo(‘url’) to get_bloginfo(‘url’)

1.0.1

*Fixed a glitch in the plugin folder

1.0

• 1.0 is the very first version of the