Add a blog to Shopify
Paste the CMSKite embed into a Shopify page and your posts show there, styled like the rest of your site. It takes about ten minutes.
Before you start
- A CMSKite account with at least one published post. The free plan is enough
- Your blog name. It is the
data-blogvalue in the snippet under Connect website in the dashboard - A Shopify admin login that can edit the theme
Add the embed
Make a page template
Online Store → Themes → Customize. Open the Pages menu at the top and create a template named blog.
Add Custom Liquid
In that template add a Custom Liquid section and paste the snippet. Save.
html<div id="cmskite-blog"></div> <script src="https://cmskite.com/embed.js" data-blog="your-blog" async></script>Make the page
Online Store → Pages → Add page, title it Blog, and choose the blog template. Save, and add it to your menu.
Where the posts live
Posts open at /pages/blog?post=my-post. Shopify allows no server rewrites, so that is the address. Search engines read it, and the sitemap below lists every post.
Check that it works
- Publish a short test post in the dashboard
- Open the Shopify page in a private window and reload. The post should be in the list within a minute
- Open the post. Its address should be your site's, not cmskite.com
- Delete or unpublish the test post when you are done
Tell Google about the posts
Search engines find embedded posts faster with a sitemap that lists them at your own addresses. CMSKite writes one for you:
https://cmskite.com/b/your-blog/site-sitemap.xmlAdd the line Sitemap: https://cmskite.com/b/your-blog/site-sitemap.xml to your robots.txt: Online Store → Themes → Edit code, then add the robots.txt template.
The whole picture is in Making your posts findable.
Match your colours
The embed takes your site's fonts and text colour by itself. Set the accent (links and buttons) with data-accent, as any CSS colour:
<script src="https://cmskite.com/embed.js" data-blog="your-blog" data-accent="#0f766e" async></script>If something is wrong
| What you see | What to do |
|---|---|
| Nothing shows | Check data-blog matches the name under Connect website, and that at least one post is published, not a draft |
| An old post list | Posts appear within a minute of publishing. Reload without the cache (Shift + reload) |
| The page shows your theme's default content | Check the page uses the blog template, not the default page template |
What it cannot do
- Clean /blog/my-post addresses: Shopify allows no rewrites
- Shopify blog features such as blog comments: CMSKite posts are not Shopify blog articles
CMSKite app for Shopify
Instead of pasting the embed, you can connect your store. CMSKite then shows your blog inside your store’s own theme, at your-store.com/apps/blog, with your theme’s header and footer.
Open the card
Go to Website settings → Connect and choose Shopify. Find the Shopify app card.
Connect the store
Type your store’s
myshopify.comaddress, likeexample.myshopify.com, and choose Connect store. Approve the app on Shopify’s screen. If you install from your store’s admin, you land on the same card with the address filled in.Add a menu link
In Shopify, go to Online Store → Navigation and add a link to
/apps/blog.
| Fact | Detail |
|---|---|
| Who can connect | A workspace admin |
| Stores | One store serves one website. A website can serve up to 5 stores |
| What shows | Published, public posts only |
| Liquid in posts | Text in a post cannot run Liquid. {{ and {% are escaped |
| Page title and meta tags | Shopify does not let an app set these here. Each post carries its BlogPosting JSON-LD in the page instead |
Renaming apps/blog | If you rename it in Shopify’s admin, links follow the new path |
To stop, choose Disconnect on the card. The blog stops showing in the store and the app is removed from it. Your posts stay in CMSKite. Uninstalling the app from Shopify also unlinks the store. The app stores no customer data.
The longer guide
Screenshots, costs and the questions people ask are on CMSKite for Shopify.