Color Palette Generator for WordPress

A WordPress plugin to generate color palettes for your images. Show them to your visitors (as we do) and allow your visitors to filter your images by color.

Install the plugin View on Github See it in action

Install, generate, enjoy!

Search for the plugin in your admin area, or download the plugin as a zip-file and upload it to your plugin directory. Once activated you can visit the settings page and start generating your palettes.

Webshop owners
One of the use cases for this plugin is to take the dominant color of your images and use it to let your customers filter your products by color. There is a chance that this plugin needs optimizations for your webshop to work the way you want. In that case, simply contact us using the form below to see what we can do for you.

Easy usage

All attachments will show the palette (once generated) by default if you make use of them. When you insert images into your content there will be some new options available. When you check the 'enable palette' option, this will insert a shortcode instead of the image. On the front-end you'll see the image with its palette.

Developer options
Once the plugin is activated, we add 2 taxonomies: cpg_palette and cpg_dominant_color. You can use these taxonomies to create your own 'color queries'. All images will have one dominant color and 10 palette colors (by default, the number of palette colors is adaptable).

The dominant color is used for the color search page. On activation we will add 20 default dominant colors (see below). All generated dominant colors will be a child term of one of those 20 colors. With this Round Color Class we decide which of the 20 colors is the parent color for the generated dominant color.
Now when your visitors visit one of those 20 colors, all child terms of the queried color will be used. With a query for these terms all related attachments will be shown. Take a look at our color search to get the idea...

Color filters

Once the plugin is activated, a new url structure will be available allowing you to filter your images by color. Simply add '/color/color-name/' behind your site url. There are 20 color names available which are based on the material design colors of Google.

Developer options
If you want to create your own custom color filters, you can check the option 'Create your own color filters?'. A new table will be available for you to edit. You need to specify the name you want to give to the color (this is used for the generation of the permalink), next you decide what the main color is and at last you apply some tints of that color.

Those tints are used to better decide what the closest color is. We match the dominant color of an image against each table row (main color and tints). When we find the closest color, the image will be added to that result. So the more tints, the better we can match to the closest color.
If you've already generated palettes before you change the color table, it's best to regenerate all palettes so your images will be linked to the new colors.

Need help?

If you like to build upon this plugin but don't exactly know how to do so, don't hesitate to contact us using the form below.

Loading...