Качественное решение ваших задач по сниженной цене. 1200 руб./час, подробнее
закрыть

Google AMP плагин для MODx 

01 feb 2021
381
Image Google AMP плагин для MODx

Ускорение мобильных страниц стало одной из ключевы задач продвижения сайта. Фактор скорости определяет до 70% успеха в SEO. 

Мы собрали свой плагин, который позволяет автоматически формировать AMP-страницы для сайтов на MODx. AMP (Accelerated Mobile Pages) — это гугловский аналог турбо-страниц Яндекса для мобильной выдачи.

Плагин работает на базе библиотеки Amp-library: https://github.com/Lullabot/amp-library

Инструкция для специалистов:

1) Устанавливаем пакет через Установщик — Загрузить пакет с компьютера;

2) Создаем шаблон AMP Страницы:

<!DOCTYPE html>
<html amp lang="ru">
<head>
    <meta charset="utf-8">
    <title>[[*pagetitle]]</title>
	<link rel="canonical" href="/">
	<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
	<style amp-boilerplate> 
		body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{ visibility:hidden}to{ visibility:visible}}@-moz-keyframes -amp-start{ from{ visibility:hidden}to{ visibility:visible}}@-ms-keyframes -amp-start{from{ visibility:hidden}to{ visibility:visible}}@-o-keyframes -amp-start{ from{ visibility:hidden}to{ visibility:visible}}@keyframes -amp-start{ from{visibility:hidden}to{visibility:visible}}
	</style>
	<noscript><style amp-boilerplate>body{ -webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
	<script async src="https://cdn.ampproject.org/v0.js"></script>
    <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script>
    <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
    <script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>
</head>
<body>
	<amp-sidebar id="sidebar" layout="nodisplay">
		<div role="button" on="tap:sidebar.close" tabindex="5" class="close">&times;</div>
		<ul>
			<li role="navigation" tabindex="1"><a href="/" title="Главная страница">Главная страница</a></li>
		</ul>
	</amp-sidebar>	
	<div id="header" class="clearfix">
		<a href="[[++site_url]]" title="[[*pagetitle:escape]]">
			<amp-img src="[[++site_url]]logo.svg" alt="[[*pagetitle:escape]]" width="200" height="40" style="float:right"></amp-img>
		</a>
		<div role="button" on="tap:sidebar.toggle" tabindex="0" id="ham">&#9776;</div>
	</div>
	<div style="margin: 10px;">
		<h1>[[*pagetitle]]</h1>
		[[*content]]
	</div>
	<div id="footer">
		
	</div>
</body>
</html>

3) Если у вас один шаблон, то к ссылке дописываем запрос ?amp и в Системные настройки — googleAmpModx выбираем шаблон по умолчанию:

<link rel="amphtml" href="https://test.ru/test.html?amp">
<link rel="canonical" href="https://test.ru/test.html" />

Или к ссылке дописываем запрос ?amp=14 (14 - id шаблон), для нескольких AMP шаблонов:

<link rel="amphtml" href="https://test.ru/test.html?amp=14">
<link rel="canonical" href="https://test.ru/test.html" />

4) В файле robots.txt разрешаем индексацию AMP-страниц:

Allow: *?amp
googleampmodx-1.0.8-pl.transport.zip
2.81 мб
Загрузок: 11
Share this post

Comment (0)

Comments are missing

Leave your comment



Want to get new knowledge and knowledge?Sign up for a useful newsletter!