我在AMP网站中使用了以下SVG代码,但它无法正常工作:
<image style="overflow:visible;" width="324" height="180"
xlink:href="data:image/jpeg;base64, /9j/4AAQSkZ....">
--html</image>
Run Code Online (Sandbox Code Playgroud)
我需要AMP在我正在处理的更大项目中使用SVG文件:
目前,我必须在AMP-HTML文档中使用SVG文件作为SVG图像,如下例所示:http://www.flexedd.com/#amp
文档说明AMP HTML文档必须
<script async src="https://cdn.ampproject.org/v0.js"></script>标记作为其头部的最后一个元素(这包括并加载AMP JS库).这是否意味着我无法提供此文件的内部副本(例如,在没有Internet访问的受限网络环境中使用)?
有没有办法为动态网页创建谷歌放大器?我的网站包含表格元素,如主要表单,页面评论等.我对AMP印象深刻,并希望通过我的网站实现它.
我们可以在Google AMP的CSS背景中使用图片吗?
<pre>
<div style="background-image: url(assets/img/business1.jpg);></div>
</pre>
Run Code Online (Sandbox Code Playgroud) 我正在尝试将底部有Disqus评论的文章转换为AMP.要做到这一点,我使用的是<amp-iframe/>:
<div id="disqus_thread">
<amp-iframe
src="https://disqus.com/embed/comments/?https&base=default&version=11a9d09102788744769550f3928faf15&f=<<DISQUS ID GOES HERE>>&t_u=<<DISQUS SITE URL GOES HERE>>&s_o=default"
sandbox="allow-same-origin allow-forms allow-modals allow-scripts allow-popups"
layout="responsive"
frameborder="0"
width="600" height="500">
</amp-iframe>
</div>
Run Code Online (Sandbox Code Playgroud)
iframe加载,似乎加载了所有脚本依赖项,但没有显示任何内容.如果您检查iframe的内容,Disqus会打印一条消息,指出Disqus无法加载.我不知道如何从这里调试它.有什么我想念的,或者我应该以不同的方式接近它?
此外,像Disqus这样的评论提供方式是由插件确定的任意高度.所以我可能无法在iframe上设置固定的高度.我需要做些什么才能使其正常工作?
我很高兴我的 AMP 页面终于得到验证,但当调用https://fonts.googleapis.com/css?family=Georgia|Times+New+Roman时,我总是收到 403 Forbidden 。我已按照文章页面的 AMP 示例进行操作。还有其他人遇到过这个吗?
我有一个网站多年,有一些表格可以登录等.最近我做了所有谷歌的AMP证明,但表格停止工作.我现在正在寻找几天,但我找不到合适的答案.
首先,我包含了所有必要的脚本和代码,就像在此页面上一样.之后,出现了第一个错误:"表单提交失败::响应必须包含AMP-Access-Control-Allow-Source-Origin标头".
然后我在页面中添加了标题.之后,第一个错误消失,但出现第二个错误:"表单提交失败::意外令牌<在位置0的JSON中".我在这里读过这个,但它对我来说没有真正的解决方案.
在这个阶段,我陷入了困境,我认为我走错了道路就像这样一个简单的形式.我只想回应一下输入......你能帮我吗?
亲切的问候,
帕特里克
<?php
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: *.ampproject.org");
header("AMP-Access-Control-Allow-Source-Origin: https://www.domain.com");
header("Access-Control-Expose-Headers: AMP-Access-Control-Allow-Source-Origin");
?>
<!doctype html>
<html amp>
<head>
<meta charset="utf-8">
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
<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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="canonical" href="https://www.domain.com/test.php"/>
<title>AMP form</title>
</head> …Run Code Online (Sandbox Code Playgroud) 有什么方法可以配置我manifest.json禁用浏览器弹出窗口,要求“安装”站点?我正在使用以下 JavaScript 代码来防止它:
window.addEventListener('beforeinstallprompt', function(e) {
e.preventDefault();
return false;
});
Run Code Online (Sandbox Code Playgroud)
但是我也需要在 AMP 版本上阻止它,而且我无法在那里运行 JavaScript 代码。
javascript service-worker amp-html progressive-web-apps manifest.json
我正在尝试使用 Accelerated Mobile Pages (AMP) 构建表单,我需要根据用户选择隐藏或显示输入。
我有一个<select>用户可以选择国家的地方:
<select name="country" id="country" required>
<option value="UK">United Kingdom</option>
<option value="ES">Spain</option>
</select>
Run Code Online (Sandbox Code Playgroud)
如果用户选择英国,我想隐藏此输入:
<input type="text" id="idcard" name="idcard">
<input type="text" id="mobile" name="mobile">
Run Code Online (Sandbox Code Playgroud)
我已经尝试在标签内使用“on”属性<option>:
<option value="UK" on="tap:idcard.hide,mobile.hide">United Kingdom</option>
Run Code Online (Sandbox Code Playgroud)
但它不起作用,它只在<select>标签上有效,即使文档说“所有元素”。
我需要使用<select>和<option>标记,因为有很多国家,而不仅仅是 2 个,否则使用收音机输入“on”属性会起作用。
是否有任何类型的触发器或事件可用于根据用户选择隐藏或显示输入?
希望任何人都可以提供帮助!谢谢!
AMP 文档提到将 jQuery 与 amp-script 组件一起使用:https : //amp.dev/documentation/guides-and-tutorials/develop/custom-javascript/
但是,我没有看到任何示例,也没有说明如何执行此操作。
我已经尝试在下面的示例 AMP 页面中包含 jQuery(分别为 3.4.1 和 2.2.4),并运行这个简单的 jQuery 脚本:
$('button').click(function() {
$('body').append('hello world');
})
Run Code Online (Sandbox Code Playgroud)
AMP 页面示例:
https://apps.yourstorewizards.com/sandbox/amp/amp-script/jquery3.html https://apps.yourstorewizards.com/sandbox/amp/amp-script/jquery2.html
两者都不按预期工作。两者都会产生 javascript 错误。在 AMP 中可以使用哪些 jQuery 函数是否有限制?
任何帮助,将不胜感激。谢谢。