Dropkiq for Chrome Shopify Liquid Extension

A brand new Google Chrome extension designed to help Shopify Developers write Liquid

Adam Darrah
Mar 10, 2020 12:14 PM
Dropkiq for Chrome Shopify Liquid Extension

Last week, we tried an experiment here at Dropkiq. Our technology is already helping enterprise companies by empowering their internal employees and customers to wrangle their Liquid environments. Now, we asked ourselves if we could bring that exact same experience to Shopify experts? Enter Dropkiq for Chrome. Our newest product that brings the Dropkiq Pro experience to Shopify Developers for free.

Dropkiq for Chrome helps Shopify developers who write Liquid while working on Shopify stores. There is something here for Shopify developers of all skill levels. For beginners, this can be a valuable tool to help you understand what options you have available to you and see a preview of how your Liquid will appear. For Shopify experts, this can be a great tool to verify you’re not making any typos, and see the result of your filters in real time. No matter how experienced you are, we’re all human and make a typo from time to time. Dropkiq for Chrome can help with that.

The way that it works is by using the Google Chrome Extension “popup” feature. Once installed, the Dropkiq icon is at the top right of your browser and you can open it at any time by clicking on the icon. As you type your expression, we are using a combination of the Dropkiq Engine along with TypeaheadJS to autocomplete what you’re typing. We also use the Dropkiq Pro Engine to show a live preview along with an inline hint straight from the Shopify Liquid documentation.

For our power users, We even added a hotkey combos so that you never have to lift your fingers from your keyboard! For Mac users, pressing [Command + i] will instantly open the popup. Then, use Dropkiq for Chrome to write your liquid expression and hit the Enter key to copy to your clipboard. Press [Command + v] to enter the completed Liquid expression into your current document. Checkout this video to see it working in action:

From an engineering point of view, one of the coolest things about Dropkiq for Chrome is that this extension could have been created by anyone using the Dropkiq technology. Since the Dropkiq Engine is the brain of Dropkiq (by actually processes the Liquid the user is typing) the results can be plugged into any frontend UI. Our flagship product uses the Dropkiq Engine to show the results via a Javascript library in your application’s UI. However, the Dropkiq Engine can be used anywhere that Javascript can be executed, such as Browser extensions, code editors, server side javascript, etc.

We would love to know your thoughts about Dropkiq for Chrome extension. You can find it available for download on the Chrome Web Store by searching “Dropkiq”. As always, feel free to email me at adam@dropkiq.com.

You might also like...

Explore how Dropkiq can help improve your user experience.

Writing Liquid expressions is hard. Let Dropkiq help you make it easier.