How to Add Header and Icon Image to WordPress Plugins

With upcoming changes on WordPress 4.0, the wordpress.org Plugins Directory’s page is changing after a long pause. The same happening on wp-admin Plugin page too. The new look with have a Plugin Icon With title, descriptions and other info of the Plugin.
This new changes will not put any effect with the earlier Plugin header image. The Plugin header image will be there same as before. For some one new with the WordPress Plugin development, here is how to add the header image please follow the same steps below….

Add Icon Image to WordPress.org Plugins

With upcoming changes on WordPress 4.0, the wordpress.org Plugins Directory’s page is changing after a long pause. The same happening on wp-admin Plugin page too. The new look with have a Plugin Icon With title, descriptions and other info of the Plugin.

This new changes will not put any effect with the earlier Plugin header image. The Plugin header image will be there same as before. For some one new with the WordPress Plugin development, here is how to add the header image please follow the same steps below with the file name banner-772x250.png(or jpg). Image size should be 772x250px.

Assuming u have already done with the initial commit, so you know how to add your developed Plugin to wordpress.org repository. Now to add Icon to your wordpress.org Plugins, here is the steps:

Step 1:

Design your very own Plugin Icon image. Remember when design,

Plugin icons are 128 pixels square. HiDPI (retina) icons are supported at 256 pixels square.

Add Icon Image to WordPress PluginsAdd Icon Image to WordPress PluginsAdd Icon Image to WordPress PluginsAdd Icon Image to WordPress PluginsAdd Icon Image to WordPress PluginsAdd Icon Image to WordPress Plugins

Step 2:

Save your Icon Image with file allowed image type, name and size.
Example: icon-128x128.png, icon-256x256.png or icon.svg

Step 3:

Now look at your wordpress.org Plugin svn directories, there are 4 directories by default. One of them is called assets. Put your saved Icon Image/s on the assets folder.

Wordpress svn folders

Step 4:

Add this file/s to wordpress.org Plugin repository using your svn client.

Step 5:

Commit the changes to wordpress.org Plugin repository using your svn client.

That’s it. Your changes should be displayed any moments now, if everything is ok.

Allowed image type, name and size:

For wordpress.org Plugins Icon Image, 3 file types are allowed,
svg
png
jpg
If you want to use svg, you will need only 1 file, as svg can be scaled to any size. name your svg icon.svg
if u want to use png or jpg you will need two separate icon files,(for apple retina display) icon-128x128.png(or jpg) and icon-256x256.png(or jpg)
The size of the Icon image to WordPress Plugins should 128x128px and 256x256px, if you are using png or jpg. if you use svg, it could be any size as long as the image is square, my recommendation for svg size is 400x400px.

Go ahead and make a awesome Icon image for your wordpress.org Plugins with the information above.  Keep it simple! The Android and iOS Human Interface Guidelines both have some fantastic design tips. Here is a WordPress Plugin of mine that have the Icon image.