Framework
Next.jsVelobici
Velobici is a UK-based e-commerce that produces and sells luxury cycling apparel.
They noticed that their platform started getting traction in Japan and South Korea, so they approached us to implement a translation strategy so that they can have content easily translated.
Tech stack
View allNext.jsHeadless CMS
SanityHeadless Commerce
SwellLibrary & Languages
React
TypeScriptDeployment Platform
Vercel“Working with Tinloof has been an excellent experience. Seif is deeply knowledgable about all things Next.js and Sanity, communication was clear, delivery was punctual and exceeded expectations.
Moreover, Seif and Omar were extremely friendly and personable people.I would highly recommend Tinloof for any web development projects.”
Callum Nowlan-DiasSoftware Developer @ Velobici
Results
Homepage redesign
The homepage is made out of reusable blocks that summarize Velobici's story and link to collections and blog posts.
Blog posts
Similarly to the website pages, blog posts are also made out of various blocks.
In addition to text and image blocks, we also included products carousels to make it possible for users to interact with products directly from blog articles and add them to their carts.
This makes it possible to create stories around new collections and engage users with their products.
Translating content in Sanity
We used Sanity's official internationalization plugin along with Next.js built-in internationalized routing feature to enable translation for each page.
To avoid any redundant code, we created GROQ utility queries to pull translations from Sanity for a specific language and fallback to English if the translated content doesn't exist.
Currency and language selector
To make it easy for users to manage their preferred language or currency, we implemented a selector that allows them to do just that.
The selector's content is also editable and translatable from the CMS.
One-time region selector
To make Velobici accessible for users outside the UK, we implemented a feature that detects the user's country and shows a popup on their first visit to select their preferred shipping region and language.
The content of the popup, including the display image, is of course entirely customizable and translatable from Sanity CMS.
“Working with Tinloof has been an absolute pleasure. We needed to localize our entire e-commerce site and they have done an outstanding job from start to finish. The final product is very easy to use and our whole team can utilize the backend with very little training. I would like to give a shout-out to Seif, who was incredible through the whole process. He was very professional and he has a huge amount of knowledge. I would 100% recommend and I look forward to working with them again in the future.”
Alex LawWebsite Content Manager @ Velobici
