Adding Accelerated Mobile Pages (AMP) to Middleman

#1

Hey guys,

I’ve been noticing that websites with AMP get more love from Google, which isn’t particularly surprising.

I was wondering if anyone has ever added accelerated mobile pages (AMP) to middleman?

A search turns up some hackish solutions that I couldn’t get working.

Option #1) http://adamboro.com/blog/web/accelerated-mobile-pages-middleman/

An interesting idea but it actually ends up generating a wholly independent site in parallel to the static site in /build (maybe there is no other way?).

Option #2) http://everflux.de/middleman-and-google-amp-accelerated-mobile-pages-2116/

Builds both the regular static site in /build and the AMP version in build/amp in tandem.

Does anyone have a good or recommended solution?

#2

Hi there,

I used the option #2 to produce two different builds adding the following code to my config.rb

config[:targets] = {
    :default =>
      {
        :build_dir => "build",
        :link_prefix => nil,
        :features =>
            {
            }
      },
    :amp =>
        {
        :build_dir => "build/amp",
        :link_prefix => "/amp",
        :features =>
            {

            }
        }
}

and on the my template I simply used and if else statement depending on the default or amp build:

<% if target_name?(:default) %>

<!-- Regular HTML/erb -->

<% else %>

<!-- AMP HTML/erb -->

<% end %>

I know it is not an elegant solution but I got an AMP folder with optimized versions of my blog pages.

2 Likes