Shopify Question posted in
The Shopify help center can be found here.

How to add JavaScript in Shopify public app

Im developing a Shopify public app using Ruby on Rails. I want disaply some information in all the store front pages. The official documents only explains about the admin panel modifications. How can I access the store front? And where I should add the scripts, I mean in which controller?

Actually Im a PHP Developer. Im new to Shopify and also Ruby on Rails. Im trying to develop a shopify public app which will show product related information in all pages (front-end). I followed shopify’s tutorial first, and created a hello world like app which displays products list in admin side. But I really cant find anything that make changes in the store frontend.

So please help me that how to make changes in frontend. Also I want to get the current user information and product details (if it is a product view page).

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    We can use config.scripttags to load javascripts in shopify store front pages. The syntax will be as follows:

    config.scripttags = [
  {event:'onload', src: 'https://domainname.com/path_to_script.js'},
]

    You should add this code in the shopify_app Gem initializer file, which can be found in

    config/initializers/shopify_app.rb

    Hope this will help someone..!


  2. 0

    It sounds like you’re asking where you need to place your JS files to have them load up on the Front End. This should help:

    http://railsapps.github.io/rails-javascript-include-external.html#locations

    Whether you use the Rails asset pipeline or add a tag directly to a view, you have to make a choice about where to put any local JavaScript file.

    We have a choice of three locations for a local JavaScript file:

    the app/assets/javascripts folder

    the lib/assets/javascripts folder

    the vendor/assets/javascripts folder

    Here are guidelines for selecting a location for your scripts:

    Use app/assets/javascripts for JavaScript you create for your application.

    Use lib/assets/javascripts for scripts that are shared by many applications (but use a gem if you can).

    Use vendor/assets/javascripts for copies of jQuery plugins, etc., from other developers.

    Login or Signup to reply.
  3. 0

    You can refer this from shopify which provides you admin APIs for add new page , update page , get customer, get products etc.. like that

    Shopify Admin APIs

    there is section for online store which contains the pages API also you can see API for products , orders and customers.

    you can also add your js file in online store pages with https endpoint statically in admin account of shopify
    example code

    <div id="test"></div>
<script async="true" src="https://www.example.com/test.js"></script>

    add your js code like this in online store page and check that your js is loading there or not

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search