Access Shopify Asset API from rails App

Access Shopify Asset API from rails App

Hey Fellas!!

This post is a part of shopify app development in rails and accessing shopify asset API from your rails app. You may be aware that shopify let’s you access the assets of your shopify store which could be read and modified from your app. Shopify asset API lets you access the store theme and its liquid files. You can programatically add new liquid files and also modify the existing files.

I came across this requirement but didn’t find complete resource of its implementation, so I thought writing about it.

So without any delay let’s start.

I assume that you have basic knowledge of rails and shopify APIs. Also you have a running rails application and have created and setup an embedded app. You can follow this awesome tutorial for creating your first pubic shopify app in rails. Do look into the video at the end of the linked post.

If you have gone through above link and video tutorial in it. I am sure you are now aware of shopify_app gem. So considering you have configured a rails application and have created your first embedded app, lets continue to learn how we can access the shopify asset API on rails.

via GIPHY

To access the Assets of the store, store admin needs to grant your app the permission to read and modify it. These are called scopes.

You can modify the scopes of your application from /config/initializers/shopify_app.rb

You will find the code like below:

ShopifyApp.configure do |config|
  config.application_name = "My Shopify App"
  config.api_key = "YOUR API KEY"
  config.secret = "YOUR APP SECRET"
  config.scope = "read_themes, write_themes"
  config.embedded_app = true
  config.after_authenticate_job = false
  config.session_repository = Shop
end

Note the line

config.scope = "read_themes, write_themes"

This is what you need to set to read and modify assets. There are other scopes that you can add. For example: “read_orders, read_products” etc according to your requirement.

So after you set this. You need to fresh install the APP so that the store admin approves the app to access above permissions.Or you can do this installation steps after you come to an end of this post after you wrote the required code to access the API.

Now after the scopes has been configured, let’s see how we access the Asset API. Its really simple as you have already installed the shopify_app gem.

This will access the asset of live theme

#This will access the asset of live theme
@assets   = ShopifyAPI::Asset.find(:all)
#or if you want to access the asset of particular theme. 
@assets   = ShopifyAPI::Asset.find(:all, params: {"theme_id": themeid})

#You can access the theme API to get theme id from below:

@themes= ShopifyAPI::Theme.find(:all)

That’s it you now have all the liquid files and assets on the @assets instance variable.

You can print it on your view file. with code below:

<h2>Assets</h2>
<% if @assets.present? %>
  <% @assets.each do |asset| %>
    <li><%=  asset.key %></li>
    <li><% asset.value %></li>
  <% end %>
<% else %>
    <p>No asset files</p>
<% end %>

In above code you just printed out the key value pair. This will print the asset file name and value inside it.

Above line

@assets   = ShopifyAPI::Asset.find(:all)

gets all the theme files. What if you need to access only one particular file. This is easy too.Just do.

#This will get the content of theme.liquid
@theme   = ShopifyAPI::Asset.find('layout/theme.liquid')

you can access its content by doing @theme.value

Now you can sucessfully read the asset file. Let’s extend this one step further and modify the content and save it.

Let’s take above code snippet and continue from there. We have

@theme   = ShopifyAPI::Asset.find('layout/theme.liquid')
@theme.value.sub!('<div class="navin">Content to replace</div>', "<div class="replaced-content">Replaced conntent</div>")
@theme.save

Voila!! You just modified the liquid file. You can verify the changes from your shopify admin too.

That’s it for this post. Hope it helps.

Cheers!!