Setting up "amp-jekyll" plugin leads to an error

Here is the last part of project tree

Sorry, this the one

The error stems from Line:19 in the amp_filter.rb of the amp-jekyll plugin…

Bring this issue up with the gem author and he’ll either tell you how to proceed or he’ll fix the bug in his code…

1 Like

Thanks a lot ashmaroli, and sorry, I should have seen the error earlier. But thank you for your advice to bring the issue to the author.

Previously I loaded the plugins putting the “files.rb” (like amp_filter.rb) into _plugins directory. Secondly, I deleted those "files.rb’ from the _plugins directory and used finally the loading in Gemfile. Shoudn’t I to programmatically uninstall “files.rb” (like amp_filter.rb) from a directory placed somewhere in my computer or is it also the result of the loading of gems in Gemfile ?

Hi ashmaroli,
I found the error. I had in my header.html (that I include in index.html) an image defined as following

<img width="16" height="16" alt="phone icon" scr="{{site.url}}{{site.baseurl}}/assets/images/icons/Phone_number-16px-16px.png">

This was causing the following error

MBP-de-Admin:inger admin$ bundle exec jekyll build
Configuration file: /Users/admin/Documents/Perso/Site-Internet/Jekyll/inger/_config.yml
            Source: /Users/admin/Documents/Perso/Site-Internet/Jekyll/inger
       Destination: /Users/admin/Documents/Perso/Site-Internet/Jekyll/inger/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
  Liquid Exception: undefined method `start_with?' for nil:NilClass in /_layouts/amp.html
jekyll 3.6.2 | Error:  undefined method `start_with?' for nil:NilClass

When I remove this img tag, there no more error.

So I tried to embed an a amp-img tag like the following

<amp-img width="16" height="16" alt="phone icon" scr="{{site.url}}{{site.baseurl}}/assets/images/icons/Phone_number-16px-16px.png" layout="responsive"></amp-img>

But I can’t see the image. I tried to remove {{site.url}}{{site.baseurl}} from the url (to have a relative path) but it doesn’t work. I did as the following link explain but I have no result.

Thank you in advance for your answers

The issue could be the missing / between {{ site.url }} and {{ site.baseurl }}
To avoid confusion use the built-in URLFilters… ( absolute_url and relative_url )

<amp-img
  width="16"
  height="16"
  alt="phone icon"
  src="{{ 'assets/images/icons/Phone_number-16px-16px.png' | absolute_url }}" 
  layout="responsive">
</amp-img>

or

<amp-img
  width="16"
  height="16"
  alt="phone icon"
  src="{{ 'assets/images/icons/Phone_number-16px-16px.png' | relative_url }}" 
  layout="responsive">
</amp-img>
1 Like

Hello ashmaroli and thank you for your answer. Thank you for your advice. But unfortunately nothing shows up, whatever url I set. I checked each time the url and the access to the image

Hello, I think that I integrate in a bad way the “amp.html” file according to the documentation (https://github.com/juusaw/amp-jekyll).

I put it in the _layouts folder but without using it somewhere else. As the images I test are in _includes/header.html file which is the following:

I can’t see the utility of the “amp.html” file. Shall I change it, integrate it somewhere, reference it somewhere ? Thank you for your answer

Have you tried pinging the plugin developer? Doesn’t appear any of us are users of it so your guess is as good as ours :nerd_face:

Hello mmistake and thank you for your answer. I pinged the plugin developer but until now no answer. I moved forward and propose a new “header.html” wich is the following : https://github.com/flamant/fileshare/blob/master/header_1.html


But I have the following errors in console

I don’t understand why it doesn’t take into account my src attributes even when I hardcode the url. I checked on browser each url that I wrote and it leads to the proper image. Thank you in advance

i know nothing about amp, but their example of an amp-image tag has a closing tag that you don’t. And even if that is not needed and it is self closing I think you need a slash at the end.

Hello rdyar and thank you for your answer, sorry but my amp-img tag has a closing tag

@flamant, have you been able to find the solution for your problem?

If you still have troubles to get it up & running, can you share your Github repository?

So I can clone it and build your Jekyll pages locally - armed with all the debugging tools I might be able to track down the issues & errors you’re struggling with.

1 Like

Hello pabloduo and thank you for your answer
It is very nice to offer your support

Here is the link to my project repository (it is the beginning of the project)

regards

Looks like your error message is coming from the jekyll-analytics plugin. I tried to build your site and added --verbose --trace and got this output.

E:/Ruby24-x64/lib/ruby/gems/2.4.0/gems/jekyll-analytics-0.1.6/lib/jekyll-analytics.rb:7:in `inject': undefined method `keys' for nil:NilClass (NoMethodError)

Disabling that plugin in the Gemfile stops the error.

I didn’t dig much deeper into your repo but did notice your _layouts/default.html is a little screwy. It needs YAML Front Matter so that could potentially bite you later.

1 Like

@flamant I have looked at your source code and found a few things that I have been able to fix (including jekyll_analytics gem). Just sent out a pull request with my changes (including screenshots as a proof that it somewhat works).

Let me know what you think! :slight_smile:

https://github.com/flamant/inger/pull/1

1 Like

Why would that be a problem in the future, can you give an example or two on the subject? I’m really curious to find out your take on that.

You have quite a bit of experience crafting your own themes (widely used BTW) and probably have seen things going wrong direction more than the rest of us! :blush:

thnx

Off hand I can’t think of one :nerd_face:

I know there was a reason I started adding empty YAML Front Matter to my default.html layouts, but completely forget why. Could have been some edge case I hit with one off my themes and this solved it.

Looking at a few other themes most don’t do it. So maybe it’s not as necessary as I led on.

nvm :blush: but if you find out what was the thing back then, pls update the thread - I would love to know what is that.

thnx!

Hi mmistake and pabloduo, thank you for your answers.
I have several questions

  1. when you say that you tried to build the site what’s the command you think of ? It’s strange, I hadn’t any issue with any kind of command considering jekyll-analytics.
  2. To remove this plugins, is the folowing process correct ?
    • uninstall the plugin by the command gem uninstall jekyll-analytics in the project directory (inger)

    • remove the gem "jekyll-analytics" command from the Gemfile

    • remove the jekyll-analytics line under DEPENDENCIES title

  3. Why the following lines have been removed from the Gemfile.lock file ?
  • jekyll-paginate (1.1.0)
  • jekyll-rss (1.0.0alpha7)
  • jekyll-paginate (~> 1.0)
  1. Why _layouts/default.html is screwy ? Can you give me an example of a proper version ?

  2. considering the _config.yml file, why should I remove url: "https://localhost". I can have that line for development purpose without breaking anything. In production environment, I will have just to replace this variable ?

  3. considering the _config.yml file, why did you add those lines ?
    jekyll_analytics:

    • GoogleAnalytics: # Add, if you want to track with Google Analytics
    • id: UA-123-456 # Required - replace with your tracking id
    • anonymizeIp: false # Optional - Default: false - set to true for anonymized tracking
      Does it replace the jekyll-analytics plugin that was removed in Gemfile ?
  4. Why did you suggest to add those lines in file ?
    Piwik: # Add, if you want to track with Piwik
    url: piwik.example.com # Required - url to piwik installation without trailing /
    siteId: “1234” # Required - replace with your piwik site id (Write id as string)

    MPulse: # Add if you want to track performance with mPulse
    apikey: XXXXX-YYYYY-ZZZZZ-AAAAA-23456 # Required - replace with your mPulse API key
    Are they other plugins to use ? And could you give me an example of their goals ?

  5. how do you understand this piece of code in footer.html file ?
    {% if page.path contains ‘_posts’ %}
    link rel=“amphtml” href="/inger/toto.html">
    {% endif %}
    What does that link tag mean and what is the purpose

Otherwise I am really confused about the src error in header.html