我有一个使用Bootstrap的网站.从技术上讲,我现在正在使用Bootstrap 4.我想在页面的公开部分利用加速移动页面(AMP).但是,我有几个错误,我似乎无法动摇.这让我很疑惑,我甚至可以使用Bootstrap加速移动页面吗?
我甚至被允许在加速移动页面中使用JavaScript吗?Bootstrap在手机上有汉堡包菜单的JavaScript.然而,当我运行验证器时,我看到如下错误:
The attribute 'href' in tag 'link rel=stylesheet for fonts' is set to the invalid value 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css'.
The attribute 'rel' in tag 'link rel=' is set to the invalid value
The tag 'script' is disallowed except in specific forms.
Run Code Online (Sandbox Code Playgroud)
所以,回到我的问题.是否可以拥有使用加速移动页面的Bootstrap 4站点?
谢谢!
是否有任何Django开发人员正在构建AMP-HTML页面?
(供参考:Google AMP项目)
如果我理解正确,AMP-HTML的工作方式是,您为每个页面创建2个单独的文件.普通的HTML结果,以及新的AMP-HTML文件.AMP-HTML文件是普通HTML页面的精简版本,Google使用它来返回加速移动页面(因此称为"加速移动页面").然后,这些文件中的每一个都在头部的标签中相互引用,这告诉Google将AMP文件用于移动结果.
在Django框架中,我想知道如何基于同一组内容创建2个单独的文件.
怎么可能使用可以传递给两个HTML结果的单个上下文?一个结果是普通的HTML页面,另一个是AMP-HTML页面.
在Django中,必须为要返回的每个页面创建一个URL.如何为每个现有URL自动生成第二个URL?此外,如何为每个URL调用单个上下文?
是否可以在视图中完成?例如,返回一个.html扩展名,即AMP页面,然后还为URL呈现模板?
关于如何解决这个问题,我还没有任何答案.寻找反馈和建议.看来这是第一个在Django和AMP-HTML上发布到stackoverflow的问题.它可能不是最后一个.
美好的一天.我使用WordPress的网站"AMP"发生器,这个插件的行动之一就是之前刚刚添加biolerplate标签</head>和<noscript>具有降效标签.谷歌搜索控制台不断警告我一个特定的错误:"样板的强制标签'noscript外壳'缺失或不正确."
所以我开始调查.我发现,"东西"是</head><body>在<noscript>开始标记之前注入,如果我改变了放置noscript标签的位置,其他两个也被移动了.
这是呈现的代码:
<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>
</head><body><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
Run Code Online (Sandbox Code Playgroud)
我做了很多测试,似乎<noscript>标签是这个错误的重点.我还读了一些其他的答案,说文档不应该是严格的xhtml 1.1,事实并非如此,事实上这些是在页面上呈现的第一件事:
<!DOCTYPE html>
<html amp lang="it-IT"><head><meta charset="utf-8"><link rel="dns-prefetch" href="https://cdn.ampproject.org">
Run Code Online (Sandbox Code Playgroud)
我试图弄清楚我可以做些什么来解决许多网站上存在的错误,包括不同的插件和主题(以及wordpress版本).
更新:
我试图<noscript>在代码中手动添加一个标签,每次我在<head>部分中添加它,部分都会关闭,<body>部分打开,没有任何类(所以它看起来像一个bug).如果你想看到这个bug,只需到这里查找代码:
https://www.assistenzamalasanita.com/2015/07/errori-medici-durante-il-parto-come-si-valutano/amp/
更新2 禁用所有插件并切换到默认主题对此没有影响.此外,我已经将整个站点复制到另一台服务器上,其中问题不存在,WP站点是相同的,并且serer配置也应该是,但是在工作的站点上我可以看到HTTP请求有一个关于php版本(7.0.2)的属性,其他网站没有.
这可能会影响页面的渲染吗?看到有效的网站:https: //www.doors.it/iride/2017/10/risarcimento-malasanita/amp
更新3 这是插件的一部分,实际上是编写样板的代码(头部和身体错误的标签).
add_action( 'amp_post_template_head', 'amp_post_template_add_boilerplate_css' ); …Run Code Online (Sandbox Code Playgroud) 我正在使用加速移动页面(AMP)构建静态网站.许多网页都包含使用"amp-iframe"标签的iframe.子页面不符合AMP标准.
我需要一种方法让子页面确定父页面何时完成加载.parent.window.onload这里不能使用法线,因为父页面通常位于不同的域(主要是Google的缓存)而不是子页面.
AMP实现了postMessage方法的某些部分作为帧之间的通信方式(https://www.ampproject.org/docs/reference/components/amp-iframe),但它的文档很少,我无法弄清楚如何可靠地传递超出该页面所示的一个示例的消息.
任何帮助将不胜感激.
有3种方式,以AMP与PWA(如上所述结合在这里):
在第一种和第三种方法中,我们都是使用Service Worker从服务器中获取AMP内容,并根据需要对其进行修改并进行渲染。有人可以解释一下这些方法之间的区别吗?“ Shadow AMP” API的确切用途是什么?
是否有一些解决方案如何动态隐藏 div 容器?
这是我目前的实现:
<button class="button" on="tap:player.hide">hide me</button>
<button class=button" on="tap:player.show">show me</button>
<div id="player" class="show" [class]="show||hide">some content</div>
.hide {
display: none;
}
.show {
display: block;
}
Run Code Online (Sandbox Code Playgroud)
只要 div 类在初始调用中具有值“show”,它就可以工作。但我想要的是禁用容器视图,只要没有点击按钮......
我是 AMP 的新手,想知道它是为谁准备的。例如。
我可以或应该将我的主页创建为 AMP 页面。
我听说这仅适用于新闻出版商,但首字母缩略词并未说明这一点,只是 Accelerated Mobile Pages,对我来说非常普遍。
欢迎任何帮助。
最近,我正在开发一个带有 Accelerated Mobile Pages (AMP) 的渐进式 Web 应用程序。我必须添加锚链接,target="_blank"以便用户单击该链接将被重定向到具有锚位置的新窗口。
<a href="External_Url" rel="external" target="_blank">Click</a>
Run Code Online (Sandbox Code Playgroud)
它在 Android 浏览器上运行良好,但target="_blank"在 iOS Safari 浏览器上完全不起作用。我知道这可以用 Javascript 解决,但在 AMP 中,由于惯例,我们不能使用任何 Javascript。
是否有任何建议可以让新窗口在 AMP html 锚点点击的 iOS Safari 浏览器上工作target="_blank"?
注意:我也在 iPhone Safari 设置上配置了“在新标签中”。
我正在使用 AMP 表单,无法弄清楚如何在使用一些附加元素提交表单后显示相同的 html。
一般来说,我的标记比较复杂,但这里有简单的示例来说明我需要做什么:
<form method="post" action-xhr="https://example.com/subscribe" target="_top" id="form1">
<ul>
<li>
<h2>Title 1</h2>
<input type="radio" value="1" name="answer" id="1" on="change:form1.submit">
<!-- Show this only on submit-success and there are used
some variables from amp-mustache -->
<div>Some Html {{Votes}}</div>
</li>
<li>
<h2>Title 2</h2>
<input type="radio" value="2" name="answer" id="2" on="change:form1.submit">
<!-- Show this only on submit-success and there are used
some variables from amp-mustache -->
<div>Some Html {{Votes}}</div>
</li>
...
</ul>
</form>
Run Code Online (Sandbox Code Playgroud)
我知道我可以使用这样的东西,但不想重复标记(正如我提到的,它比提供的示例更复杂):
<form method="post" action-xhr="https://example.com/subscribe" target="_top" id="form1">
<ul>
<li>
<h2>Title 1</h2> …Run Code Online (Sandbox Code Playgroud) 在很多AMP页面上,我看到访问者通过明显不同版本的AMP-html进行定向 - https://amp-html-url/?amp_lite
我很好奇,这个amp_lite参数有什么意义.普通的amp-html和?amp_liteamp-html版本有什么区别?