Speed Up Drupal websites with Google AMP by setting up & enabling Google AMP for a speedy Drupal websites this is a simple matter of following five easy steps. Check this blog for description of the process.
2. In the past few years, the number of users who access the internet through mobile
devices has increased rapidly. In fact, statistics now show that these users have
outnumbered all other users, particularly the desktop users.
Drupal is now responsive out of the box. However, if you are wondering how to further
improve Drupal’s performance for mobile devices, Google has got the perfect answer in
the form of Accelerated Mobile Pages (AMP) that allows instant delivery of web pages.
In these slides I will show you how to implement AMP on your Drupal powered website.
3. Pre-requisites
First of all, make sure that you have Composer and Drush installed on your server
before proceeding. Fortunately, Cloudways provides Drush and Composer preinstalled
on its servers.
Next up is the installation of AMP. Follow these steps to install it on your Drupal site:
•Download modules, theme and composer manager
•Download amp module dependencies with composer
•Download amp theme with composer
•Configure AMP module Configure AMP theme
4. Download Modules, Theme and Composer Manager
Go to the CLI and enter the following commands to download the required modules,
theme and composer manager for AMP.
drush dl amp, amptheme, composer_manager
Next start enabling the downloaded items. Keep in mind that you will need to enable
Composer Manager before enabling the AMP module. Use the following command:
drush en composer_manager, amptheme, ampsubtheme_example
5. Download AMP Module Dependencies with Composer
Next, download the PHP AMP library and set dependencies before you can enable
AMP modules itself (remember that this library is required by the module). This can be
easily accomplished by using the following Composer command:
composer require drupal/amp
6. Download AMP Theme Library with Composer
You will be required to download and set dependencies for the AMP theme via
Composer:
composer require drupal/amptheme
7. Configure AMP module
Given that you’ve downloaded and set the dependencies for the AMP module and
AMP theme, you can now go ahead and enable the module via this command:
drush en amp
Now navigate to admin/config/content/amp. Here you can see all the content types
on your Drupal site. It would look something like this:
8. It’s up to you to select the types of content for which you wish to enable AMP. Generally, blog posts and articles
benefit the most from AMP, since they are the fastest and thus help your website in SERP rankings.
You can click the ‘Enable AMP in Custom Display Settings’ to enable AMP for the type of content you desire.
Doing so will bring you to the following screen:
Here, you can set which fields will be formatted to AMP. It’s usually best to change the format of all the field
types on this screen to AMP.
9. Setting AMP Theme
Setting the AMP theme is very simple because an example sub theme is already
provided (which I enabled earlier). You can set this theme in
admin/config/content/amp:
If you want to further style your theme, keep in mind that AMP only accepts styling via
CSS and not via JS. Also, make sure that the CSS file size doesn’t exceed 50K.
10. Conclusion
And that’s it, you have successfully enabled AMP on your Drupal site. Hope you found
this tutorial useful if you are looking to make your Drupal website lightning fast here
are 10 Tips To Speed Up Your Drupal Website. For any help in setting up AMP for your
Drupal site, do leave a comment and I will get back to you.
