Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
•Download as DOCX, PDF•
0 likes•200 views
Quick Fact: Google gives the higher ranking to the websites that meet the AMP requirement. As it provides better mobile experience to the users.
Report
Share
More Related Content
What's hot
What's hot (20)
Similar to Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
Similar to Integrating Accelerated Mobile Pages (AMP) In Drupal Websites (20)
More from Excellent Webworld
More from Excellent Webworld (20)
Recently uploaded
Recently uploaded (20)
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
- 1. Integrating Accelerated Mobile Pages (AMP) In Drupal Websites In the tech-savvyworldtoday,survival of the fittest is transformed to the survival of the fastest; because time is the most valuable assettoday.The performance of your website is directly proportional to the conversion of visitors to customers. Do youknow 40 % of yourwebsite visitor left the website if it takes more than 2 seconds to load? And around 48 % of the visitors will not return to the site if it is slow or has poor performance. Quick Fact: Google gives the higher ranking to the websites that meet the AMP requirement. As it provides better mobile experience to the users. So howto make a fast and better-performingwebsite?Orhow tomake my existingwebsite faster?The Answeris:“Google AMP”. Now, what is Google AMP? Google AMP isan open source framework;createdforthe developerstomake fastloadingpageswith staticcontent.But howdoesit work?The answeris “Diet” versionof the content,cachedbyGoogle. Wheneverthe pagesare accessedonmobile devices;tospeedupthe loadtime dietversionof the contentisused. Drupal + AMP = Complete Enterprise Website Do youknowWhitehouse hasaDrupal website?Today,all the leadingenterprises,businessesand startupsare optingDrupal for their businesswebsite.Drupal isgainingastrongpositioninthe landscape of businessCMS.AMPisboostingthe performance of Drupal websitestoanotherlevel.With the benefitslike betterGoogle rankingandfasterpage loading;Drupal acceleratedmobile pagesare generatingrevenue higherthanever.
- 2. Still not having a Drupal website?Don’t worry! We have dedicatedDrupal developers!! Advantages of google AMPpages: 1. Speedsupwebsite loadingtime 2. Increasesmobile ranking 3. Improvesserverperformance Wonderingabout developinganAMP page for your businessor AMPintegration inyour existing Drupal website?Youhave two choices: 1. Do it on yourown (althoughitmightgive youaheadache). 2. Give it to us (we will bearyourheadache) If you are going for OPTION 1; then here are the stepsto follow: First, Let’sdissectan AMP page: A regularAMP page consistsof three attributes.All the three core elementstogetherimprovethe website speed,contentdelivery,andmobileexperience. HTML: AMP HTML issimilartoHTML withsome custompropertiesandtagsresponsibleforitsfaster loading. JavaScript:AMP JStakescare of asynchronousloadingandhandlingof resources. ContentDeliveryNetwork(CDN):AMPCDN isusedto cache the AMP Pagesandmake some performance optimizations.
- 3. Requirements: System Requirements • PHP 5.5.x Modular Requirements • AMP Theme - http://drupal.org/project/amptheme • ComposerManager- http://drupal.org/project/composer_manager Library Requirements(HandledbyComposerManager) • Composer- https://github.com/composer/composer • AMP Library - https://github.com/amp-library • HTML5 Parserfor PHP- https://github.com/Masterminds/html5-php Installationof AMP and configurationwith the website: 1. Downloadthe latestAMPversionforDrupal 8, theme,andcomposermanager.Store themintheir respective directories. For AMP and ComposerManager | www| sites|all | modules|contrib|amp | composer_manager For AMP theme: | www| sites|all | themes|amptheme 2. Enable AMPtheme,composermanager,andAMP: For AMP theme:Go to “Appearance” (admin/appearance)andclickonthe "Enable"linksforAMP Base and ExAMPle Subthemethemes. For ComposerManager: Go to “Modules"(admin/modules) andenable“ComposerManager”among the list.ClickSave configurationbuttontosave the changes. Enable AMP: Go to “Modules”(admin/modules) andtick“AcceleratedMobile Pages”(AMP) amongthe list.ClickSave configurationbutton. 3. Make sure the Configuration» System» ComposerManager (admin/config/system/composer- manager) isall green.Clickonthe Rebuildcomposer.jsonfilebuttonif it’snotgreen. 4. You can configure the AMPsettings Configuration»ContentAuthoring » AMP configuration (admin/config/content/amp).
- 4. 5. Enable AMPDisplaymode foreachof the contenttype from Structure » ContentTypes (admin/structure/types) clickonthe manage Fieldandenable AMPinthe customdisplaysetting. 6. You can see a new AMPsubmenuon the page aftersavingthe above settings. 7. Clickonthe “sub menu” and rearrange thingsas peryour requirements.Finally,save all the changes and repeatitfor othercontenttypesaswell. Whoa!!Your AcceleratedMobile Pagesof aDrupal website are now readyformobile devices;nowno needtoworry aboutthe design,performance,andspeed. Stuck somewhere??Don’tworry!!! You have the second optionalways available. We are always ready to help. Mail us your query and requirementsand our Drupal specialistwill respondas quicklyas possible.