Topics
Contact us
- the world's most powerful combination of e-commerce and content management tools. We equip your online storefront with speed, flexibility, and scalability by integrating Shopify with Sanity, the gold standard in headless CMS.
Fast and high-converting: Leave limiting templates behind and enjoy a modern, fast, custom storefront designed for conversion.
Unified Content Management: Manage products and all other website content in a single location with Shopify and Sanity CMS integrated.
Future-Proof: A modern architecture positions your online business for success, ready to adapt to trends and technologies in e-commerce.
First, stepping into the future of headless e-commerce is FUN, fast, and practically limitless.
The traditional way of building content in Shopify, WordPress, and similar platforms mixes the content and layout, making it rigid and useless in any other context.
Going headless means that we separate the back end / content (body) from the front end / layout (head) in which we display the content. In other words, we separate the business logic and content from the presentation. The content is simply a “database” of structured data that we pull into the web application, mobile app, newsletter, or wherever the content needs to be displayed.
...a "headless architecture” means that we separate the content (body) from the layout (head) in which we display the content.
Going headless with Shopify, we can use any technology we want to build a fast and flexible online store or website and pull the content into the web application from several sources, like Shopify and Sanity CMS.
The freedom to combine several platforms and content sources in one solution is called a "composable" architecture, in contrast the traditional "monolithic" architecture with one integrated technical platform.
The future of e-commerce is built on a headless architecture where anything is possible! If your business needs this kind of flexibility, we should talk.
We are delighted with our collaboration. We asked for the future of e-commerce, and Represent has delivered on everything we asked for and more.
Headless e-commerce is the future of online retail. Going headless with Shopify, separating the “shop front” from the “warehouse”, gives you more freedom to design unique customer experiences. It's about speed, flexibility, and staying ahead of the game in a rapidly changing digital world. Paired with the world’s leading platform for structured content management, Sanity CMS, we can’t help but serve you the cliche: “The sky is the limit”!
Go headless and say goodbye to slow page loads that hurt your search engine rankings and user experience. A headless commerce architecture with Shopify and Sanity CMS results in faster, more engaging shopping experiences that boost sales.
With our headless Shopify and Sanity CMS integration, your products sync from Shopify to Sanity via the Shopify storefront API. With the power of the market's leading headless CMS, you can enrich your products with engaging content and seamlessly integrate your products and editorial content. We make even the most complex content structures and relations easy to handle.
By moving content management from Shopify to Sanity CMS, you get tons of powerful content editing features out-of-the-box, including granular version control and real-time collaboration, meaning that multiple content editors can work on the same content simultaneously.
Go headless and get a fast online store by combining Shopify, Sanity (the market's leading headless CMS), and the latest and best web development frameworks and cloud storage.
In Sanity Studio, multiple editors can work on the same content at the same time. In practice, we see editorial teams abandoning Word documents and working on content directly in the CMS.
"Sanity Studio," which is what Sanity calls its editorial interface, is open-source and gives us complete freedom to customize the interface and integrate external services.
Your content is structured completely separate from the presentation layer such as websites, apps, newsletters, etc. We ensure the correct appearance in the code, and the content can live through iterations of design and structure.
Break free from the restrictions of templates and create memorable brand experiences with unlimited flexibility and control. You need to build trust with your audience by feeling unique and authentic while staying with conventions that make your visitors feel safe, and that increase their likelihood of purchasing (aka Conversion Rate Optimization).
If you’re used to the challenges of managing separate Shopify stores for each market or the limitations of Shopify Markets, you’re in for a treat! With a headless Shopify store, we build a single front-end web application (online storefront).
All storefronts and markets run on a single code base for ease of development and maintenance, and you manage all content in one location. We still leverage the power of Shopify either through Shopify Markets or so-called “expansion stores” (separate Shopify stores in one account) if you need different checkout configurations for different markets. The difference is that we pull that data into one unified storefront and simply direct the user to the correct checkout to complete their purchase.
Managing all your product and other content, like landing pages, in Sanity CMS makes content work at least 10x more flexible and enjoyable than working in Shopify, especially when creating content variants for different markets and languages.
In the above example, you can see how we have introduced “Translation Status” to content in Sanity, allowing the editors to work with content in a new language and only make it available to the website visitors when they enable the toggle for that language.
We have even integrated Open AI’s Chat GPT into Sanity Studio, making it easy to duplicate and translate an entire product or landing page in a single click!
With your store’s back end separated from your online store's front-end, you can turn any screen into a digital storefront. Pull content into your online store, newsletters, chatbots, mobile apps, etc.
With a custom-built storefront on a modern technology stack, we can integrate any platform or service you need in the storefront and the Sanity Studio, where you manage your content. Sanity Studio is an open-source React web application that we can fully customise. You can still use Shopify apps as long as they have “API support”, though they may take longer to integrate in a custom storefront than the plug-n-play experience of traditional Shopify stores. That plug-n-play do-it-yourself experience comes at a considerable cost to the performance and speed of your Shopify store, though, so if you’re serious about your online business, it will likely pay off to invest in a custom-built headless Shopify store.
Most of our customers who end up with a headless Shopify solution came to us looking for a flexible and future-proof solution they can build on as they continue to grow. We build solutions with technologies and platforms that will likely be cutting-edge for many more years. By integrating headless Shopify and Sanity headless CMS, we can create any content and shopping experience you can imagine! Are you ready to go headless? Let's have a chat!
Choosing between a headless commerce solution and a traditional e-commerce platform can be challenging. We’ll do our best to guide you in the right direction here, and you can always reach out to us for some advice.
Headless commerce is a fantastic alternative for ambitious businesses, but it’s not the right path for your part-time homemade soap business. If you’re just starting your e-commerce journey and bootstrapping your way to success, a headless commerce solution is likely far too expensive compared to a traditional Shopify template or a simple Squarespace shop. Here are some of the advantages of traditional e-commerce platforms for smaller companies.
If you’re just starting your e-commerce journey and bootstrapping your way to success, a headless commerce solution is likely far too expensive...
A headless commerce solution solves the following use cases well.
We have helped brands like Alfa (Norway’s #1 outdoor footwear brand) succeed with Shopify Plus and developed highly customised retail experiences for brands like Vitamail. The combined power of headless Shopify and Sanity CMS allows us to quickly build complex content structures and present them as engaging, fast, and high-converting Shopify stores.
Our advisors, web designers, and developers help e-commerce brands succeed by focusing on superior user experience (UX) and conversion rate optimisation (CRO) with the latest headless e-commerce technologies.
We work with ambitious brands that invest in their Shopify store as a critical component to their success and growth. If a traditional Shopify template is not enough for your business needs, and you are ready to invest in custom e-commerce experiences, we might be a good fit. We can help you redesign your current store for better performance and conversion rates or build a brand-new store from the ground up.
Read more about how we work and approach projects further down.
We have worked with Represent to develop “the e-commerce solution of the future” integrating Shopify with Sanity CMS. Our main focus has been on conversion rate optimisation. We have focused on clarity, ease of use, and flexible content management that would be simple and enjoyable for our employees. Represent has delivered beyond our expectations in every aspect. They have felt like an integral part of our team and company throughout the process, consistently guiding us with timely and transparent communication. We’re excited to continue our collaboration.
Alexander and Øyvind are our senior advisors with 20+ years of experience in business, design, and technology. We love helping businesses succeed online!
Our design team crafts engaging user experiences (UX), always focusing on conversion rate optimisation (CRO). We are especially proud of Josipa - a powerhouse (and university professor) in UX design.
We are currently a team of ten developers who specialize in Shopify, Sanity CMS and React/Next.js. Our developers and designers work closely together, and Robert on the right over there also has a UX design master's degree!
Shopify has invested in Sanity CMS and developed a tight integration between the two platforms, undoubtedly making Sanity CMS the best option for extending the (very) limited content editing capabilities built into Shopify.
The key benefit of integrating the market's leading headless CMS with Shopify is to extend the content management features of Shopify. We enrich your products and build the data structure for all your content in Sanity, which automatically fetches products from Shopify.
You made it all the way down here, so you must be itching for some details on how a headless Shopify+Sanity solution works, looks, and feels. Let’s dive a little deeper into how the market’s leading headless CMS can give your headless Shopify store content superpowers!
Shopify has invested in Sanity, making it the obvious first CMS choice for businesses in need of better content management capabilities than what Shopify offers (extremely limited..). With the “Sanity Connect” Shopify plugin, any changes you make to your product catalogue in Shopify are instantly reflected in the Sanity Studio, where you manage all your content, including enriching your products with additional content.
With your Shopify product catalogue synced to Sanity, we can enrich your product content to make the buying experience more engaging and high-converting. You’re building your product pages with the same flexibility as landing pages and other content using the world's #1 headless content management platform.
We’ll help you set up all the content modules you need to build your landing pages and other content. Having your products in Sanity alongside your other content, you can easily relate products to a landing page, for example, for an integrated editorial and shopping experience.
We custom-build everything for your business in the Sanity Studio. In the below example, we have built a content type for Retailers related to a Market and a product relation to select which products are available at that retailer in that market, including links to those products on that retailer’s website.
And this is how a retailer looks like in Sanity Studio:
Break free from templates and let our designers, who specialise in user experience (UX) and conversion rate optimisation (CRO), craft a shopping experience unique to your brand and business. We stay true to proven design principles and UX/CRO patterns and will only reinvent the wheel if it makes sense for your business!
We work in separate environments for production (live website), staging (test website), and development. When a feature is ready to be tested, you can do so on a private URL that is not live to the public. Launching new fixes and features to the live store is equally simple and painless. We often push updates several times daily, leveraging “continuous deployment”, allowing us to deploy changes quickly and easily.
Developing a Shopify store used to mean that you were forced to work in their “Liquid” templating language. With a headless Shopify approach, on the other hand, Shopify only represents the back end - the data and business logic. We can build the online storefront using any technologies we see best fit. Still, some options are better suited to ensure efficient development, performance, and maintenance.
If you have spent some time reading up on headless Shopify, you have probably heard about Hydrogen and Oxygen by now. You might be surprised to learn that you have complete flexibility in choosing the programming language for your storefront.
Here’s a quick breakdown of the technology and a few alternatives:
So, should you build your new headless Shopify store with Next.js or Shopify’s Hydrogen framework? The answer couldn’t be more apparent. Like most significant decisions in life and business, “It depends.” ;)
Having a team full of Next.js experts at Represent, as well as a library full of ready-to-use components and content modules (like article templates, CTAs, etc.) we have developed in-house, we can give our clients a faster and better experience using Next.js than Hydrogen. Shopify's Hydrogen is likely the better choice if you’re working with an agency specialising in the Remix framework. Both options can make your dreams come true if handled correctly.
After careful consideration and trials with several US and European web agencies, we chose Represent. They are open and honest, understand our complex requirements, and build outstanding solutions for our online store.
Let's go into our approach to projects and collaboration, to give you a sense of wether we could be a good fit for your business.
First of all, let’s have a chat. It is vital to the success of your project that we get along as people and that our values and approach to problem-solving align. We tend to have productive collaborations with ambitious people and businesses that appreciate a transparent, trust-based process and communication style. Consider us your “friendly experts” who will seamlessly blend into your team as we grow your business.
If a quote with a fixed price for a finished solution is the next item on your wishlist, I’m afraid we can’t help you. The misconception that you or we know all the answers before we have begun our journey is the #1 mistake we see when businesses plan their web project and choose an agency partner. And it’s a clear signal that we’re not a match.
So, what is the right way to approach the project? We scope the project and set clear goals and expectations based on the current situation. We get to know your business, gain a deep understanding of where you’re headed, and consider strategies on how our collaboration can move us toward your goals.
Either with a total or a monthly budget range, we work closely together and make sure you get as much value out of your money as possible.
An agile approach like this vs. the traditional waterfall approach to projects ensures that we are developing the right thing, not the thing we planned when we were still young and dumb ;) We adapt and prioritise, leveraging what we learn throughout the process.
We meet several times a week to discuss and prioritise together, and you get a weekly report each Monday about last week's progress, plans for this week, and a status for the timeline and cost. No surprises. Full transparency.
We avoid placing a project manager between you and our team doing the work. You’ll work directly with our advisors, designers, and developers. Nothing gets lost in translation, and fewer people in meetings equals more budget for producing results. The highest requirement for all roles on our team is excellent communication skills.
It should be easy and fun to work with Represent. We have an open and inclusive process, and everything from timelines and tasks to a dedicated help centre with video training is available to everyone involved in a platform called Notion.
When you sign up to work with us, there’s no commitment. Work with us as long as you’re happy with the results. When you’re solution is live, we do not bill you for a service agreement. Our availability is free of charge. We only charge for the assistance we provide on an hourly basis.
We make it our business to be a joy to work with. Simple. Safe. Fair. We build our business on happy clients :)
A textbook example of how such a process can play out is our journey with Vitamail. We initially wrote a proposal describing the first version of their headless Shopify EU store to expand their health supplement business out of Scandinavia.
At the time of writing, we are five months into our collaboration with Vitamail, continuously releasing new versions of their store. We are yet to expand to the EU, which was our initial mission. And the Vitamail team could not be happier!
Yes, you read that right. We haven’t delivered what we agreed on before starting our project together.
... they started dreaming, and we started making those dreams come true.
When the Vitamail team saw all the flexibility and possibilities of a headless Shopify + Sanity CMS solution, they started dreaming, and we started making those dreams come true. We have built a complex content structure, including a landing page builder, an ingredient database, claims related to the ingredients, studies related to the claims, and products containing those ingredients. We have built the dream product for Vitamail’s marketing department and content editors.
We have also integrated Chat GPT in the Sanity Studio, allowing Vitamail’s content editors to duplicate and translate content to feel local in every market they enter when expanding to the rest of Europe.
This investment will likely pay off big in the long term..
Having built such a solid new foundation for the Nordic stores, the next step of expanding to Europe is actually short and quick. In a couple of weeks, we’re ready to conquer! This investment will likely pay off big in the long term while we bring all that innovation into our EU expansion.
After building a solid new foundation for the Nordic stores, the next step of expanding to the rest of Europe was simple. Within a few weeks, we were already prepared to conquer Europe! The initial reprioritization to strengthen the technical foundation in the Nordics before expanding to the EU gives Vitamail a better long-term return on their investment.
We are continuously developing headless commerce solutions with a range of ambitious companies, from Apex Wheels in Silicon Valley to 4him&her in Scandinavia.
Here are some examples of companies running their stores on a headless infrastructure using Shopify and Sanity CMS.
We would love to get to know you, your business, and how we can work together to help you succeed! Send us a message and we'll schedule a time to meet :)
Let's talk about how you can succeed with a headless Shopify store.
