We wanted to build a plugin that makes shopping easy directly on the blog without opening any new tabs.

What it does

The blogger can easily add links to the blog text with an admin tool. The reader can find the shop box under a highlighted text by clicking it. In the shop box it is an ease to buy the product without leaving the page.

The reader doesn't have to search through the Internet for the one product that was featured on the blog. With the shop in blog the available sizes are directly visible in the shop box and buying the item is just few clicks away.

The bloggers can earn by curating the outfits for their readers as a service. The links doesn't have to be updated after adding them ( need to maintain affiliate links anymore). The link will automatically disappear if the product is no longer available.

How we built it

We created a Wordpress Plugin (PHP). The whole functionality happens in Javascript, there are two Javascript-Files: One for the admin-area to add a Zalando product to the blog and the other for the Frontend for the user to actually shop the product.

The Admin-Javascript is only activated on the post.php file in the Wordpress and adds a custom buttom to the WYSIWYG-Editor. By pressing it, a popup shows where the content creator can select a product based on a fullText search against the Zalando API or by pasting the URL to the Zalando-Shop into the searchbar. This will create a span-tag into the blog content, containing a special data-attribute with the Zalando product ID.

Based on this ID, the Frontend Javascript detects these items, check if they are avaible in the shop, and if they are, it creates a shop below them. The Frontend Javascript uses the Zalando-API as well.

Challenges we ran into

Due to the time limit we didn't have time to develop the multiple item buying as far as we would have wanted. The back-end is basically ready for that.

Accomplishments that we're proud of

We were able to create the plugin in this short amount of time with a small team. We have a working solution to show!

What we learned

No one in our team had experience with the Wordpress and its plugins. Using the API was also new for all of our team members.

What's next for shop in blog

We would improve the possibility of buying multiple items with "Get the look"-shop box. The order and the payment confirmations are also under construction.

Share this project: