问题标签 [amp-story]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
68 浏览

amp-html - amp-story-page 最后一个孩子

似乎 amp-story-cta-layer”和“amp-story-page-attachment”都必须是“amp-story-page”的最后一个子节点才能验证。这是不可能的。可以做什么?我错过了什么?

0 投票
0 回答
247 浏览

templates - 标签“amp-story”不允许有任何同级标签(“body”应该只有 1 个子标签)。UNKNOWN 第 1038 行,第 0 列

我正在尝试在 blogspot 模板中实现 amp-story。尝试在 AMP Validator 中进行验证时;它显示了唯一的错误

“标签'amp-story'不允许有任何兄弟标签('body'应该只有1个孩子)。”

在“AMP VALIDATOR”窗口中,删除代码“b:section id='fixelements' showaddelement='no',这是“body”部分中唯一的代码 [除了 amp-story 代码]显示

验证状态:通过

但是从我的 blogspot 主题模板中删除后,它显示错误:

“我们没有在您的主题中找到任何部分。主题必须至少有一个 b:section 标签。”

请帮忙。

0 投票
0 回答
158 浏览

amp-html - 如何最初激活 amp-story-player 中的任何网络故事

假设我有 3 个 Web 故事要嵌入到一个网页中,并且我希望在一个查看器中包含多个 Web 故事。我会用

但最初这会在 amp-story-player 在页面上呈现时激活 Story 1。

那么,有什么方法可以初始激活故事 2 吗?

如果想查看故事 1/故事 3,用户将向左/向右滑动

谢谢

0 投票
1 回答
249 浏览

amp-html - 加载后立即取消静音 amp-story 视频,以确保默认启用声音

通过查看这个问题的答案并看到这个 PR,我明白了为什么 amp-stories 默认是静音的。但是我想在故事加载后立即尝试取消静音。

也许通过点击右上角的声音按钮调用相同的函数来取消静音?不是在“点击”上,而是在“加载”上调用它。

amp-story-system-layer.js,这个函数initializeListeners_()初始化一切,如果我在我的页面上导入这些脚本,我猜这样的东西可以工作:

有任何想法吗?这是正确的方向吗?(我是 javascript 的初学者)

谢谢

0 投票
0 回答
128 浏览

gatsby - 如何将 AMP Story 添加到 Gatsby 应用程序

我有一个用 Gatsby 和 Contentful 编写的静态网站。我想添加到应用AMP Stories。故事内容将在构建过程中从 Contentful 中获取,我想从中生成 AMP 故事页面。

问题

AMP Stories 只需要一个文档正文的直接子代 -amp-story标签。

AMP 网页和使用 AMP 构建的网络故事之间的区别在于 amp-story 组件。它是文档的唯一直接子级,并且必须包含独立属性。所有 Web Story 页面、图层和元素都在标签中定义。

但另一方面,盖茨比需要:

在您的内部,您必须有一个 id 为 ___gatsby 的 div

想法

  1. 可以自己写amp页面,放到static文件夹里,但是想自动生​​成,和Contentful同步。
  2. 我可以使用onPostBuildfrom gatsby-nodeAPI 来调整生成的 HTML 以适应 AMP Story 的要求。

是否有人对如何在 Gatsby 中实施 AMP Stories 有任何其他想法或建议?

0 投票
1 回答
130 浏览

javascript - 放大器故事放大器视频“noaudio”属性未应用

我有一种奇怪的行为amp-video...

场景是这样的:

我有一个包含三张幻灯片的故事,每张幻灯片都有视频(amp-video),其中两个被静音(添加了“ noaudio”属性),当导出该故事并在浏览器中打开时,我可以取消静音所有故事(包括静音的)...如果我将它们全部静音,则均衡器图标将被隐藏。似乎如果我有一个unmuted(例如 10 个)静音视频,那么这种行为就被打破了。

这是生成的 HTML 代码:

0 投票
0 回答
186 浏览

amp-html - 如何在浏览器加载故事内容时在 amp-story-player 中添加加载器

我有一个带有嵌入 amp-story-player 的 html 页面的站点。在 amp-story-player 中有多个故事网址。一切正常,除了故事播放器中的每个故事都需要 5 秒才能加载,它给用户的印象是没有内容。

有没有办法在故事中加载内容时添加加载器?

0 投票
1 回答
219 浏览

amp-html - 循环播放 AMP 网络故事

有没有办法循环播放多个放大器网络故事(或视觉故事),以便在用户滚动到最后时加载新故事?

这是为了在用户滚动浏览多个故事而不返回主页时重现类似应用程序的导航(如 facebook 或 youtube 故事)。

诸如amp-next-page组件之类的东西,它似乎在 amp-story 中不起作用。

0 投票
0 回答
63 浏览

reactjs - Next.js amp-story 客户端渲染

尝试在 next.js 项目中使用 amp-story。我想获取一个 api 并使用来自 url 的路由器查询(其中包含我要获取的元素的 id)渲染从 api 获取的图像和视频。但是一切都在服务器端呈现,所以网页没有获取它。有什么方法可以让它在客户端渲染?或者可以做任何事情以便我可以使用 url 参数获取 api?

0 投票
0 回答
33 浏览

amp-html - amp-subscriptions 支持 NewsArticle 子类型

我的新闻机构使用 AMP 订阅来处理对我们报道的 AMP 版本的访问。我的 SEO 团队要求我使用“@type”:“OpinionNewsArticle”来表示意见故事,以帮助使新闻搜索结果更加准确。但是,当我们对其进行测试时,它破坏了 AMP 订阅部分。似乎 AMP 订阅仅支持 NewsArticle @type,而不支持它的子类型。

有什么方法可以让 AMP 订阅与 NewsArticle 的子类型一起使用?或者是否有另一种推荐的方式来向谷歌表明意见故事而不会导致 AMP 订阅问题?