Emily runs a small business, selling personalized gifts. A top selling item in her store is a customizable mug. As a buyer, you can upload your pictures and add them to the mug. Last month, she increased her sales, by allowing customers to create and add photo collages, onto gifts.
If you’re wondering how you can do the same? This article is for you!
[space]
Photo Collage Creator on WordPress
A collage is a collection. And, in this case, the collection we are talking about, contains photographs or rather images. A simple photo collage creator would work in the following way:
- Customer selects a Product
- Customer Uploads Photos to create a Collage
- Customer Purchases the Product
This is all okay, from a customer’s point of view. But, if we were to translate this into features, to be provided on a WordPress website (with WooCommerce), we would need to do the following:
Customer selects a Product
The customizable product will have to be added in your WooCommerce store. For example, on Emily’s website, this would be a personalizable mug. Such a product will have a collage template, where photos can be uploaded.
Customer Uploads Photos (which are added to the template)
There would have to be an upload option on the WooCommerce product page, using which a customer can upload pictures. When a customer uploads these pictures, they will have to be added to the collage template so that the customer can see a live preview of the photo collage, he is creating.
Customer Purchases the Product
Once the customer has created the collage, he can submit it, and purchase the product from the WooCommerce store. The collage image will have to be sent along with the purchase order.
[space]
On the usual WordPress website, the obvious gap in this solution, is the Collage Creator Application, that fits into your WooCommerce store, which allows customers to create such photo collages to personalize products.
Do not worry. We have a solution.
[space]
Insta-Woo: The Ultimate Photo Collage Generator
By integrating Instagram and WooCommerce you can create an ultimate collage maker. You can set a grid template, and allow users to pick images from Instagram to form a collage and then purchase it as a product.
Integrating Instagram with WooCommerce
To fetch images from Instagram, we need to use an authentication protocol and then log into the platform. If the collage preview has to be shown, we’ll need to use AJAX.
Adding a Custom Template
Instead of a grid template, you could also allow a custom template to be created, using Canvas.
- There will be an option provided to the store admin, to upload a background image. This background image could basically represent the product, with placeholders for where images can be uploaded. This option will be present on every product page. For example, below, I’ve uploaded an image of a customizable wooden frame. As you can see, there are 3 placeholders.
- As the admin, you will then be able to create and add masks, onto the background image. These masks will be portions of the image, where an uploaded image will be added. Here, you basically have to mark these placeholders.
- Once you’ve done that, you can save the created template and then publish the product.
- On the front-end, a customer will be able to upload images (either from his system or Instagram- the usual way), and a live preview of the product will be shown.
[space]
The Photo Collage Maker, can be integrated into your WordPress website, as a custom solution. The customizable template allows store owners to create any kind of templates they can print. And allows customers to create collages on the fly, to personalize products on sale.
[space]
