[Free Module] AMP Accelerated Mobile Pages - 2.0.20 PS 1.6 / 1.7

[Léopold Jacquot]

This module add the AMP technologie to your shop. Product and category pages will be handle.

The module theme can be customized to represent your brand.

The source code is available here: https://github.com/L3o-pold/prestashopamp

Download here: https://github.com/L3o-pold/prestashopamp/releases

The story behind this module: https://blog.leopoldjacquot.com/2017/11/26/prestashop-amp-module/

Road map:

• CMS pages
• Homepage
• Url rewriting
• Pagination for Prestashop 1.7.x
• Product attributes
• Thirty bees support

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Edited January 24, 2020 by Léopold Jacquot
Fix description bad cleaning (see edit history)

[Attrexx]

I read the story and I was amused, then sad for your misfortune with the data loss and all, but all in all I'm always glad to see Open Source works. They are the future, no matter how hard some try to stop it.
I only wish there was a test environment (PS install) for users to explore.

I am downloading then testing it right now. Will return with feedback. I am excited.

Kudos

 

LE: I am curious for how long are you ready to support this module. I know it's not an obligation, but having initial support will give a boost of confidence to early adopters

Edited February 27, 2018 by Attrexx (see edit history)

[Léopold Jacquot]

Yeah it's funny and sad at the same time. It's great for the Open source world so that was for the best I think.

Do not hesitate to give me your feedback, the module is not perfect but he makes the job I think.

For the support, I received some feedback this week (released first on the French forum), and it improved the module very well. Prestashop 1.7, some bug fixes with configuration and unexpected content description like iframe or images. 5 small released in one week.

It's funny how real world shops are far from the Prestashop out of box. (not like I didn't expect it)

I'm pretty confident for the support, and more people will use it and more I'll be motivated to do it.

Not sure about the roadmap if not a lot of people use it by the way.

PS: About the PS install, you are the second one to ask me for it, for the moment, I do not wish to host a Prestashop demo but again, if many people ask for it, I will reconsider.

Edited February 27, 2018 by Léopold Jacquot (see edit history)

[sinbinrin]

Hi

Thank you for the great module and making it open source.

Installed your module and google throwing errors in search console as below:

 

1)  The tag 'amp-carousel' requires including the 'amp-carousel' extension JavaScript.

<amp-carousel width="400" height="300" layout="responsive" type="slides" autoplay delay="2000"> <amp-img src="//www.----------/943-large_default/258.jpg" width="458" height="612" alt="Handmade Stool" layout="responsive"> </amp-img> <amp-img src="//www.------/944-large_default/indian-footstools-pouffes.jpg" width="458" height="612" layout="responsive" alt="Handmade Ottoman"> </amp-img> </amp-carousel></div><h1 id="product-name-amp">

2)  The parent tag of tag 'amphtml engine v0.js script' is 'body', but it can only be ''.

<script type="text/javascript" src="https://cdn.ampproject.org/v0.js"></script> <script type="text/javascript" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script></body></html>

3) The inline 'style' attribute is not allowed in AMP documents, use 'style amp-custom' tag instead -     in long description.

 

when

 

Help needed.

[Léopold Jacquot]

Hi, can you provide me your Prestashop version and your prestashop URL you are testing in PM?

[sinbinrin]

Sent you PM

 

Thanks

[Léopold Jacquot]

Disable the Move JavaScript to the end of the HTML document option from your back office.

The module should not allow installation if this option is enabled. Did you activate this option after the install?

PS: Try again the validation after this option is disabled

Edited March 1, 2018 by Léopold Jacquot (see edit history)

[sinbinrin]

Ok did as you said.

Disabled move javascript to the end, then reset the module and again enabled move javascript to the end.

 

Did the validation with disabled and after enable move javascript to the end. Cleared cache.

 

No luck.

[Léopold Jacquot]

The Disabled move javascript to the end needs to be OFF all the time not just when the module is installed.

[sinbinrin]

Even though move javascript to the end is disabled the errord are still there and the validation fails.

[Léopold Jacquot]

When I check the website you provided me, the option is still activated

[sinbinrin]

Sorry disabled again and cleaned the cache.

[Léopold Jacquot]

Ok, I checked a product page and it's valid but your category pages are not.

Which version of the module you are using?

[sinbinrin]

Latest version 2.0.9

[Léopold Jacquot]

Ok, did you customized the module theme? Because the problem is with the category description, and it's not the same HTML than the module default theme.

[sinbinrin]

No, did not do any customization.

[sinbinrin]

Product page is also not validated. Check the below url

 

https://validator.ampproject.org/#url=https%3A%2F%2Fwww.fastyl.com%2Frugs-carpets%2Fhandmade-floor-carpets

[sinbinrin]

Hi

Just waiting for your solution.

 

Thanks

[Léopold Jacquot]

Sorry, I didn't get any notification about your message...

Your product pages works, you just didn't enter the right URL... 

Example https://www.fastyl.com/module/amp/product?idProduct=598 should works if you disable your move javascript to the end option and clear cache!

 

[Léopold Jacquot]

Try to install latest version (2.0.10), disable the option I told you and try to validate a category page like: https://www.fastyl.com/module/amp/category?idCategory=57

Edited March 3, 2018 by Léopold Jacquot (see edit history)

[Krystian Podemski]

Well done man, i'm not a fan of AMP and i hope it will die some day but... that's not what matters, what matters is that we have yet another great open source contribution to PrestaShop

[sinbinrin]

Thank you for the new version worked well.

 

It would be wonderful if this module works without disabling "Move Javascript to the end" as it affects site speed on desktop.

 

Hope you will support that as speed is the major issue for ecommerce website and every second counts.

 

[Léopold Jacquot]

Hi, @sinbinrin this option is now handled with the new version of the module (2.0.11).

[vkmaxx]

Is AMP some kind of mobile friendly version of the site?
I've checked what AMP is on wikipedia but it doesn't tell me a lot - like some techniques to make web pages load faster.

[Léopold Jacquot]

AMP is a technology to load your website faster for some usage like in Google search engine results or in Facebook.

[sinbinrin]

Hi

2.0.11 worked well as intended.

 

Thank you very much for your support. 

 

Feature Suggestion:  Add product specification on productpage and url rewrite.

 

Thanks again.

[sinbinrin]

Sorry one more feature that you can add is multilingual and multistore.

 

Thanks

[illohacker]

Thats great, Thanks.

[vkmaxx]

On 07/03/2018 at 9:54 AM, Léopold Jacquot said:

AMP is a technology to load your website faster for some usage like in Google search engine results or in Facebook.

Does it serves different web page layout (something similar to mobile theme) or the layout is the same but transferred differently?

[Léopold Jacquot]

It serves a different layout customizable.

[sinbinrin]

Hi

 

Is it possible to show attributes and features.

Because attributes like size, color are mandatory requirements in ecommerce that customers look for.

 

Thanks

[Léopold Jacquot]

Hi,

Yeah it's a nice feature to add in the roadmap.

[Casper_O]

Looks like a promising module.

Regarding your problem with "move javascript to footer" - instead of changing PS_JS_DEFER you could maybe solve it by adding data-keepinline="true" to the Script tag.

That should keep the script tags where you placed it

[Léopold Jacquot]

It's solved since V2.0.11. I used an other trick than the data-keepinline="true" because this attribute will not help in this case.

Edited March 12, 2018 by Léopold Jacquot (see edit history)

[Casper_O]

Your right, i did not have time to test it before I wrote regarding data-keepinline. Forgot that there where other JS added to pages

An other thing i often sees with AMP sites, is a link "back" to the real site, so you can get full details.

keep up the good work

[Léopold Jacquot]

Yes it could be a good idea, anyway, if user click on any link on the AMP page, he'll be redirected to the real site.

[oli4321]

Hi, great project thx for that.

 

I've installed the module (no problems). Deleted cache and checked with amp checker.

But still get the msg that amp is not found.

Am i missing something ?

[Léopold Jacquot]

Hi, are you testing a category or a product page?

[oli4321]

Hi no i did not, the category and product page are working , its perfect thx !

 

i just got one error report from google some <br> in the code.

[Léopold Jacquot]

Category and product pages are the only one supported.

Can you paste the error from Google, and tell us on which page you got the error?

[doceo]

First of all, thanks for the work!

I'm trying to use the module in PS 1.7, now it's installed but I don't see the option of moving the javascript to the end(for disabling it).

What is the new path for the products page... I've tried http://myserver/module/amp/product?idProduct=246 but I get nothing.

[Léopold Jacquot]

Hi, this option is not available in PS 1.7 and isn't not required to me disabled anymore in PS1.6.

You seems to have a problem, because on the link you provided there is an internal server error.

Could you provide me error logs in PM ?

EDIT: For the records, the error came from the pspixel module.

Edited March 26, 2018 by Léopold Jacquot (see edit history)

[KeenGamer]

Hello Leopold,

 

good work but it seems that there is a problem with multilanguge sites. If I check CZ version, AMP is fine. But if I try to test English version, I have the error that xml:lang in <span> is not allowed. And even the text in the source code does not show English version of the product description but the default one in Czech. So it is not working for us.

 

Can you give me some advice or fix?

 

Thank you.

 

Karel

[Léopold Jacquot]

Hi,

Could you send me in Private message your shop url so I can check for the xml:lang error that I can't reproduice.

If you use the /cz or /en like this: /en/module/amp/product?idProduct=1#development=1 you should have the good language content.

Edited April 1, 2018 by Léopold Jacquot (see edit history)

[sinbinrin]

On 3/12/2018 at 2:46 PM, sinbinrin said:

Hi

 

Is it possible to show attributes and features.

Because attributes like size, color are mandatory requirements in ecommerce that customers look for.

 

Thanks

 

Wondering if you can implement suggestion as requested earlier.

 

Regards 

[Léopold Jacquot]

Hi,

Like I said before it was added to the roadmap but there is no date for a release.

[Pecatum]

Hi!

Thanks a lot for your module. I've just installed it on PS 1.6. The product pages are not indexed by Google yet, but I've tested it by copying the link that is displayed in the header section, and validation by Google is OK. And I've also modified TPL and CSS files.

But I have one doubt: when clicking "Add to cart" on one of the AMP pages, nothing seems to be done and no message is displayed. If I return to the "normal" version, then I can see that product has been correctly added to cart. Is this the expected behaviour? I mean, while remaining on the AMP version, user is not really aware of the content of his cart. Also, he has no way to navigate the site, he can only go back to the "normal" version by clicking on the top logo.

Sorry because I think this is not really a problem related to your module. It's more about "training" the customers to what AMP means, I guess... Any idea for this? (maybe displaying a text on every product page trying to explain the user about AMP usage????).

Regards

 

[staut82]

Hello, thanks for the work, but I do not understand how to test the work of your module? 1.6.1.18 https://www.chemodanoff.com.ua/ru/27-пластиковые-чемоданы

[centoasa]

My logo is a little distorted, see attachment.

Can I edit/change my logo to best display into amp pages?

 

[Pecatum]

Hi, and thanks a lot for your module!

I'm customizing it as much as I can (I'm not an expert programmer) but I have one doubt. 

Is it possible to edit the amp links so that they are more "friendly"? For example, something like this:

https://www.pecatum.com/es/module/amp/product?idProduct=156

=>

https://www.pecatum.com/es/amp/jamon-iberico/156-jamon-iberico-de-cebo-campo-charro-8kg.html

Basically, I want to use the canonical link with "amp" somewhere in between...

I'm beginning to play with amp.php file and PS Link class, but maybe there's a simpler, faster way to do it?

Thanks & kind regards! 

Edited April 25, 2018 by Pecatum (see edit history)

[Pecatum]

On 25/4/2018 at 7:14 PM, Pecatum said:

Is it possible to edit the amp links so that they are more "friendly"? For example, something like this:

https://www.pecatum.com/es/module/amp/product?idProduct=156

=>

https://www.pecatum.com/es/amp/jamon-iberico/156-jamon-iberico-de-cebo-campo-charro-8kg.html

 

Well, I just achieved to get:

https://www.pecatum.com/es/amp?idProduct=156

Simply by adding page "amp_product" in Preferences > SEO & URLS, and then: "URL Rewrite" => amp.

Just a small advance, but at least... I keep working on it.

Edited April 26, 2018 by Pecatum (see edit history)

[staut82]

2 hours ago, Pecatum said:

 

Well, I just achieved to get:

https://www.pecatum.com/es/amp?idProduct=156

Simply by adding page "amp_product" in Preferences > SEO & URLS, and then: "URL Rewrite" => amp.

Just a small advance, but at least... I keep working on it.

Thanks for the great advice I will try

[Pecatum]

17 hours ago, Pecatum said:

 

Well, I just achieved to get:

https://www.pecatum.com/es/amp?idProduct=156

Simply by adding page "amp_product" in Preferences > SEO & URLS, and then: "URL Rewrite" => amp.

Just a small advance, but at least... I keep working on it.

 

Now I got this:

https://www.pecatum.com/es/amp?idProduct=160-chorizo-iberico-de-bellota-campo-charro-12kg

Instead of:

https://www.pecatum.com/es/amp?idProduct=160

What I did was to define:

$ampLink = $this->context->link->getModuleLink('amp', 'product', array('idProduct' => $product->id."-".$product->link_rewrite), true, $this->context->language->id, $this->context->shop->id, true);

Instead of:

$ampLink = $this->context->link->getModuleLink('amp', 'product', array('idProduct' => $product->id), true, $this->context->language->id, $this->context->shop->id, true);

My next efforts will be focused on how to replace that "?idProduct=? by simply "/". But I will wait a few days to have a clearer mind... I tried it not using getModuleLink, but it doesn't work. One of my tries was:

$this->context->shop->getBaseURL(true).$this->context->language->iso_code."/".$product->link_rewrite;

The URL was then well constructed, but it didn't work (Page not Found).

I've also seen that it doesn't work for multilanguage sites, so I have a problem there too... A different problem, so I will try to explain it by separate.

[Pecatum]

On 1/4/2018 at 3:23 PM, Léopold Jacquot said:

Hi,

Could you send me in Private message your shop url so I can check for the xml:lang error that I can't reproduice.

If you use the /cz or /en like this: /en/module/amp/product?idProduct=1#development=1 you should have the good language content.

 

Hi Léopold,

I also got an error with multilanguage urls. Default version of my site (Spanish) works ok:

https://www.pecatum.com/es/amp?idProduct=160-chorizo-iberico-de-bellota-campo-charro-12kg

But the other 2 versions (English and German) do not:

https://www.pecatum.com/en/amp?idProduct=160-iberian-acorn-fed-sausage-chorizo-iberico-de-bellota-campo-charro-12kg

https://www.pecatum.com/de/amp?idProduct=160-pata-negra-paprikawurst-chorizo-bellota-campo-charro-spanien

Any idea why?

(Yes, I modified amphtml to get the product.link_rewrite in the URL, but then I tried with the default amphtml and it's the same)

Thanks!

[Pecatum]

On 30/3/2018 at 1:57 PM, KeenGamer said:

Hello Leopold,

 

good work but it seems that there is a problem with multilanguge sites. If I check CZ version, AMP is fine. But if I try to test English version, I have the error that xml:lang in <span> is not allowed. And even the text in the source code does not show English version of the product description but the default one in Czech. So it is not working for us.

 

Can you give me some advice or fix?

 

Thank you.

 

Karel

 

Hi Karel,

I guess you're getting that error in the Google AMP Validator, right? I faced the same problem but it's not related to Leopold's AMP module, but to Google AMP rules. My problem was that, when translating my site to other languages, somehow Prestashop added a <span> label with xml:lang and some more things to my translated texts in the product descriptions. And it didn't happen in all products, just in some ones (mostly when I used bold text, for example).

Since I was not able to see why Prestashop did this, what I did was to go those products and edit those descriptions. Do it by editing the source code. There you will see those <span> labels .Simply delete them (or just the xml:lang parameter) and then validate them again. For example:

<p><span xml:lang....>This is the text</span></p>  => <p>This is the text</p>

In my case it happened in just some products, hope it's the same for you.

Hope it works!

[Pecatum]

19 minutes ago, Pecatum said:

 

Hi Léopold,

I also got an error with multilanguage urls. Default version of my site (Spanish) works ok:

https://www.pecatum.com/es/amp?idProduct=160-chorizo-iberico-de-bellota-campo-charro-12kg

But the other 2 versions (English and German) do not:

https://www.pecatum.com/en/amp?idProduct=160-iberian-acorn-fed-sausage-chorizo-iberico-de-bellota-campo-charro-12kg

https://www.pecatum.com/de/amp?idProduct=160-pata-negra-paprikawurst-chorizo-bellota-campo-charro-spanien

Any idea why?

(Yes, I modified amphtml to get the product.link_rewrite in the URL, but then I tried with the default amphtml and it's the same)

Thanks!

 

Ok, I'm sorry for writing so many messages together, but I'm finding solutions to my own problems on the run. This one was caused because I used Preferences > SEO & URLS to set friendly URLs for module-amp-product and module-amp-category. In the field "URL Rewrite" (in Spanish "URL Reescrita"), I entered value "amp" for all the languages.

I've tried with a different value for each language and now it works! So my AMP links now look like this:

https://www.pecatum.com/es/amp?idProduct=160-chorizo-iberico-de-bellota-campo-charro-12kg

https://www.pecatum.com/en/amp-en?idProduct=160-iberian-acorn-fed-sausage-chorizo-iberico-de-bellota-campo-charro-12kg

https://www.pecatum.com/de/amp-de?idProduct=160-pata-negra-paprikawurst-chorizo-bellota-campo-charro-spanien

 

[KeenGamer]

Guys, just a question. Have you experienced more sales, better conversions with AMP or not? There are still many reasons to go for it and many against...

[sinbinrin]

If you are looking for better conversions with this thread module, it is not worth. Though the module works, it throws error in google webmaster tool. Secondly it is very basic module which does not show quantity, attribute and features on product page which is a must have for product detailing from a conversion point.

I did install the module but since did not had basic ecommerce features so uninstalled it. 

Amp is worth a try for mobile conversions, If you feel the need buy from prestashop addons. 

[Blawdi]

Hello

I do not understand the operation, I installed it, checking on check amp it's good, I saw the url through the module, however how does it work? When we go on google with his mobile proposed links will be in amp? but if we go on the classic url nothing is transformed into AMP ?! it's normal?

[Blawdi]

i have problem :

Les pages AMP et canoniques ne présentent pas le même contenu (Critique)

Assurez-vous que la page AMP et la page canonique présentent le même contenu. Les pages AMP au contenu différent de la page canonique peuvent figurer dans les résultats de recherche Google sans les fonctionnalités d'affichage spécifiques au format AMP. En savoir plus

URL de page AMP :

https://www.rue45.fr/module/amp/category?idCategory=4

URL canonique :

https://www.rue45.fr/4-habitat

Dernière détection :

03/06/2018

 

 

 

 

[tortex]

Hello everyone, I have a question about this module, in the amp version of each product page there is a link to the original version of the product, but in the original version the link to the amp version is not created

this exists in the head of the AMP version <link rel = "canonical" href = "https: /mipagina.com/categoria/producto.html">
But this does not exist in the head of the original version of the product <link rel = "amphtml" href = "https://mipagina.com/module/amp/producto.html">
Is it possible that my template is not the default one? In what way could this link be generated in the header of the original version of the page of each product / category?

I do not know if you can answer me but I thank you from now on.

@pecatum veo que tu página si que aperece el "link rel" lo has hecho tu o lo generó el módulo atutomáticamente.

Un saludo!

[tortex]

6 minutes ago, tortex said:

Hello everyone, I have a question about this module, in the amp version of each product page there is a link to the original version of the product, but in the original version the link to the amp version is not created

this exists in the head of the AMP version <link rel = "canonical" href = "https: /mipagina.com/categoria/producto.html">
But this does not exist in the head of the original version of the product <link rel = "amphtml" href = "https://mipagina.com/module/amp/producto.html">
Is it possible that my template is not the default one? In what way could this link be generated in the header of the original version of the page of each product / category?

I do not know if you can answer me but I thank you from now on.

@pecatum veo que tu página si que aperece el "link rel" lo has hecho tu o lo generó el módulo atutomáticamente.

Un saludo!

Ok I answer to myself, after restarting the module appears the "link rel" in the head of the original version
Thank you!

[Léopold Jacquot]

Hi,

Sorry for the delay.

I am aware of a bug with the multilanguage that throws error in Google search console.

I'll work on a fix as soon as possible.

[centoasa]

Sorry, but on my latest fresh nstalaltion of 1.7.4 and php 7.2 I've error 500 on product page.

[ANGELO Vintage]

I think is better to post Issues here: https://github.com/L3o-pold/prestashopamp/issues

instead to use the forum.

[Nick797]

Hi,

I have installed the module and it works good! Great job! I did the AMP test and it said that the product pages are AMP pages. I sent my data to Google for the SEO/indexin. Is there something else to do? 

Thanks a lot 

[marek slachta]

Hi Léopold, really appreciate your work.

I instaled the module, few times, also try it with move javascript to footer, cleared cache, but not working, also google send me message that there isa crawl problem now.

I have a multilanguage stroe, is that a problem, can I make it run ?

 

thank you for your answer

 

https://validator.ampproject.org/#url=https%3A%2F%2Fbattletested.sk%2Fsk%2F

https://battletested.sk/sk/

[marlowera]

On 27.02.2018 at 7:38 PM, Léopold Jacquot said:

This module add the AMP technologie to your shop. Product and category pages will be handle.

The module theme can be customized to represent your brand.

The source code is available here: https://github.com/L3o-pold/prestashopamp

The story behind this module: https://blog.leopoldjacquot.com/2017/11/26/prestashop-amp-module/

Road map:

• CMS pages
• Homepage
• Url rewriting
• Pagination for Prestashop 1.7.x

 

 

 

 

 

amp.zip

It works ok but the page loads slowly

[YAMER1]

Thanks

Edited July 27, 2018 by YAMER1 (see edit history)

[Léopold Jacquot]

Hi,

A new version is available and should fix multilanguage issues.

Do not hesitate to came back to me if needed. Thanks for your patience.

[moatazattia]

i have multisite/multilanguage/multi currency ...

 

installed the module and enabled per shop and for all shops , but i cant validate the html , always gives errors like

 

any ideas , toutrials what to do , as im not developer..

 

Edit: my version is 1.6.20

 

Edited August 22, 2018 by moatazattia (see edit history)

[Léopold Jacquot]

Hi guys,

New version released to add PL language and prevent FB pixel module incompatibility.

If you have any issues, please create an issue https://github.com/L3o-pold/prestashopamp/issues/new with details and if needed URL of your shop by PM or any other way. 

Edited November 11, 2018 by Léopold Jacquot (see edit history)

[centoasa]

Thanks so much @Léopold Jacquot great work!

[Bolonia]

Hi this work on 1.7.4.4?   Because   i install and not working =(

[Léopold Jacquot]

Hi @Bolonia it should works. Can you give us more information than just not working?

[tuananhngd]

On 11/21/2018 at 12:08 PM, Léopold Jacquot said:

Hi @Bolonia it should works. Can you give us more information than just not working?

Hi Jac,

is it suitable and well working with presta 1.7.3.2?

could you have link of its demo?

Best regards

[HaCos]

If product has attribuets, attributes options doesnt show up on product page. Has anyone resolved this?

[Léopold Jacquot]

Hi @Ng. Tuấn Anh 

There is no demo available just try it.

@HaCosThis module is not handling attributes options. I'll add it to the roadmap but do not hope that it will be implemented.

[SHOSHO31]

Hello

I have prestashop 1.6.1 and we have this error in google webmaster : 

 

Les attributs de la balise AMP HTML spécifient une mise en page incorrecte.

L'attribut "width" dans la balise "amp-img" est défini sur une valeur incorrecte : "".

Thank you for your help

 

Si vous pouvez me répondre en francais ca m'arrangerai. Merci d'avance

[Léopold Jacquot]

@SHOSHO31 Hi,

Could you me PM me your website please.