Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

AMP support? #13

Open
samazgor opened this issue Jul 26, 2018 · 9 comments
Open

AMP support? #13

samazgor opened this issue Jul 26, 2018 · 9 comments
Assignees
@xiaoiver

Comments

@samazgor
Copy link

How to integrate this for AMP pages?
@xiaoiver xiaoiver self-assigned this Jul 31, 2018
@xiaoiver
Copy link
Contributor

May I ask how do you generate your AMP pages?
Using some Jekyll plugins like amp-jekyll?

@samazgor
Copy link
Author

I've fixed the issue btw. Have to load jekyll-pwa-plugin.rb locally and replace lines from 134 to 144.

I m using amplify

@xiaoiver
Copy link
Contributor

xiaoiver commented Aug 9, 2018

What L134-144 do is simply appending service worker registration code to <body>.
So maybe I should not hard code the inject point like this.

@kalwalt
Copy link

kalwalt commented Jan 20, 2019

Hi @xiaoiver @samazgor i'm using the plugin with amp but i need also to modify the lines from 134 to 144 because amp not allow to inject javscript code, i would to use the code on my host but not sure if i can build and install the gem on Netlify. i could do the modification in the code if someone help me a bit... 😄 I have not so much experience with Ruby and gem.

@samazgor
Copy link
Author

@kalwalt here is what i did for my site.

  • First of all include the following code before </head> of your theme/ template if it's already not there. See amp referencec.

<script async custom-element="amp-install-serviceworker" src="https://cdn.ampproject.org/v0/amp-install-serviceworker-0.1.js"></script>

  • Now install jekyll-pwa plugin manually, choose option 1 - Docs.
  • Modify the jekyll-pwa-plugin.rb file and replace <script> tag from L134 to L144 with the following amp snippet.

<amp-install-serviceworker src="https://sam.azgor.com/sw-register.js" layout="nodisplay"></amp-install-serviceworker>

dont forget to replace sam.azgor.com with your actual domain name.

@kalwalt
Copy link

kalwalt commented Jan 21, 2019

Thank you @samazgor! Yes basically this is what i tryed but the problem is: how i import the plugin inside jekyll? i created the modified jekyll-pwa-plugin.rb but i didn't understand if i have to add to the plugin in _config.yml. i had never do this before. I am not very smart with Jekyll and Ruby 😭 For this reason i modified completely the plugin deleting the self.insert_sw_register_into_body function and his registration. You can see here my code in my fork of the gem.
Basically in this way i inject the code
<amp-install-serviceworker src="https://path/to/service-worker.js" layout="nodisplay"></amp-install-serviceworker>
with a Liquid tag
For now i only tested in my localhost but i would try soon on my website.

@kalwalt
Copy link

kalwalt commented Jan 21, 2019

My modified version of the gem-plugin is on RubyGems here

@samazgor
Copy link
Author

samazgor commented Jan 21, 2019 •
edited

@kalwalt create a folder on the root and name it _plugins. Now copy your ruby file into that folder. See this

@kalwalt
Copy link

kalwalt commented Jan 22, 2019

@samazgor i did as you explain, it works as you said... But in the end i prefer with my custom gem. Thank you for the help! Maybe it will be nice to add an option for custom code injection or disable or enable the injection of the script code....

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@xiaoiver xiaoiver

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@kalwalt @samazgor @xiaoiver