我想在移动设备的放大器轮播中显示导航箭头,但默认情况下它不显示箭头。我已经尝试过.amp-carousel-button { display:""; },但似乎没有任何效果。
我有一个有效的 angular 通用应用程序,我有一个特定页面的 amp 版本。为了使 amp 页面可访问,我必须添加到页面的<head>this 标签中
<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">
Run Code Online (Sandbox Code Playgroud)
所以我需要类似于MetaService 的东西。
我的问题是如何在 angular 5 应用程序的特定组件中执行此操作?
如何在 amp-bind 中包含多个动态类?
例如:
<div [class]="condition1 ? 'classA' : 'classB'" [class]="condition2 ? 'classA' : 'classD'"></div>
Run Code Online (Sandbox Code Playgroud) 我想为我们的 AMP 网站重新创建我们的移动页面导航。问题是它有多个级别 - 所以列表中有列表。像这样:
<ul>
<li><a href="<link to a section>">section</a></li>
<li>
<a href="<link to another section>">section</a>
<span>some button that open a sub navigation via javascript</span>
<ul>
<li><a href="<link to a subsection>">subsection</a></li>
...
</ul>
</li>
...
</ul>
Run Code Online (Sandbox Code Playgroud)
然而,即使它在 AMP 中非常简单,这似乎也很棘手。我找不到任何例子。根据https://www.ampproject.org/docs/reference/components/amp-sidebar 在anamp-sidebar内amp-sidebar是不可能的,因为amp-sidebar必须是body. 在列表中使用列表不能像在移动页面上那样容易使用,因为: Javascript 切换子导航的魔法受到限制。:hover也无法显示子导航,因为它适用于移动设备。
这个问题是否有有效的解决方案,如果是,它是如何完成的?
我在客户的网站上有很多<amp-img>元素,最近注意到一个功能,您可以单击图像并弹出一个右上角带有 X 的灯箱。我在他们的官方文档中找不到任何关于启用/禁用此功能的提及。我将此元素用于某些背景/风格元素,因此我希望用户无法单击它。任何帮助深表感谢。
这是我正在使用的代码,删除了类和 URL:
<amp-img
width="2000"
height="515"
layout="responsive"
src="https://image.url">
<amp-img placeholder
src="https://placeholder.url"
layout="fill">
</amp-img>
</amp-img>
Run Code Online (Sandbox Code Playgroud) 我网站上的大多数图像都占据了整个屏幕宽度,因此在我当前的网站版本(不是AMP)中,我将CSS中的所有图像设置为通过这样做来填充整个屏幕宽度:
body img {
width:100%
}
Run Code Online (Sandbox Code Playgroud)
在AMP有什么相同的东西吗?
我正在按照https://developers.google.com/analytics/devguides/collection/amp-analytics/进行简单指南
尝试添加Pageview GA代码,但在控制台中遇到这两个错误:
amp-analytics-0.1.max.js:243 AmpAnalytics analytics1 Analytics config could not be parsed. Is it in a valid JSON format? SyntaxError: Unexpected token /
AmpAnalytics analytics1 No triggers were found in the config. No analytics data will be sent.
Run Code Online (Sandbox Code Playgroud)
任何人都面临这些错误并知道修复,我按照指示遵循他们的文档,但仍面临两个问题.
快速提问:是否可以动态加载内容等
<amp-twitter
data-tweetid="611193269532295168"
layout="responsive">
Run Code Online (Sandbox Code Playgroud)
通过AJAX成AMP文章?
我正在将我的HTML页面转换为AMP页面.我见过测试网址https://validator.ampproject.org/#.此页面由AMP验证.
但是当我使用外部Css时.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">
Run Code Online (Sandbox Code Playgroud)
然后它会失败.
那我怎么能访问materialize css文件.因为我在我的网站上使用Materialise Ui框架.
但我也读过
<style amp-custom> </style>
Run Code Online (Sandbox Code Playgroud)
SO AMP验证页面建议包括amp-custom中的内联css.但实现css是如此之久.它会破坏一些移动浏览器.因为https://github.com/ampproject/amphtml/issues/4555
如果有人有一些想法,请分享.
关于放大器形式的CORS标题的文档可能更容易,我仍然有点不知道我是否已经做好了一切.
现在,我的表单似乎可以在我自己的网站以及Google的AMP结果中使用.但是,它不适用于我的开发网站; 我也不确定它是否真的非常安全.这是我目前使用的代码,一个生活在https://podnews.net上的脚本
这是大量试验和错误的结果,我不禁想到文档可以更清楚地解决这个问题.
header('Cache-Control: private, no-cache');
header('Access-Control-Allow-Origin: '.$_SERVER['HTTP_ORIGIN']);
header('Access-Control-Allow-Credentials: true');
header('access-control-expose-headers: AMP-Access-Control-Allow-Source-Origin');
header('AMP-Access-Control-Allow-Source-Origin: https://podnews.net');
header('Content-Type: application/json');
Run Code Online (Sandbox Code Playgroud)
特别是:$_SERVER['HTTP_ORIGIN']根据我的理解,可以包括AMP缓存.
这里有什么正确的有效值?如何添加多个值(假设至少有两个AMP缓存)?为什么它不在开发站点上运行,这类似于http://dev.podnews.net(它启动的错误是CORS,而不是关于在HTTP而不是HTTPS).如何编写本文以便所有AMP开发人员都能轻松参考?