Bootstrap 的全屏轮播在 TYPO3 中不显示为全屏答案

【问题标题】：Bootstrap's fullscreen carousel does not show up as full-screen in TYPO3Bootstrap 的全屏轮播在 TYPO3 中不显示为全屏
【发布时间】：2019-08-24 14:42:44
【问题描述】：

我已将 Bootstrap 的轮播作为内容元素添加到我的 TYPO3 网站。我使用的轮播类型是 carousel_fullscreen。但是，轮播并没有覆盖全屏。见图片：

当我查看源代码时，我认为这可能是因为轮播被包装在一个以“容器”为类的 div 中。如何确保轮播确实覆盖整个屏幕？

【问题讨论】：

标签： typo3 typo3-9.x typo3-extensions

【解决方案1】：

从Bootstrap documentation 可以看出，container 类有一个固定的max-width（对于每个断点）。我想你可以使用container-fluid 类来覆盖视口的整个宽度。

在大多数情况下（但这取决于个人设置，没有通用规则） <div class="container"> 包含页面的所有内容元素，它是页面模板的一部分；

如果您使用著名的bootstrap_package extension，它使用FLUIDTEMPLATE 对象提供所有页面模板，并且您要查找的文件位于该文件夹中

EXT:bootstrap_package/Resouces/Private/Templates/Page

您必须找到您的页面当前使用的是哪一个。

我强烈建议不要自己修改这些文件，而是创建自己的扩展（通常称为“前端提供者”或“站点包 em>") 并通过将它们存储在那里并覆盖它们的路径来覆盖这些文件；如果你还不知道怎么做，你可以使用这个网站https://www.sitepackagebuilder.com/new/ 来构建一个新的扩展。

EXT:boostrap_package 带有一个 TypoScript 常量

page.fluidtemplate.templateRootPath

您可以使用它；所以在你的扩展中会有一个 Typoscript 常量，比如：

page.fluidtemplate.templateRootPath = EXT:yourextensionname/Resources/Private/Templates/Page/

只需将要修改的 EXT:bootstrap_package 中的模板文件复制到这个新路径即可。

如果您的页面模板不是由 EXT:bootstrap_package 本身提供的，那么您很可能已经在使用“sitepackage”扩展名并且您可以修改其文件；找出它的方法可能是：

1) 以管理员身份进入TYPO3后台，点击“模板”模块 2）点击有TypoScript模板的页面（通常是首页） 3) 在上方的下拉列表中选择“TypoScript 对象浏览器” 4）确保您正在浏览“设置”树（还有另一个下拉菜单） 5）在那棵树上，您可以展开节点并搜索“页面”节点；展开其中的所有内容并搜索以“= FLUIDTEMPLATE”结尾的节点；可能是这样的：

在本例中，“bhsiteconf”是我的站点包的名称； EXT:bhsiteconf 是 /typo3conf/extensions/bhsiteconf 的缩写形式，因此您必须在该路径上查找您正在搜索的模板文件（扩展名当然会有所不同）

【讨论】：

有道理，谢谢！我怎么知道在引导扩展中将容器更改为容器流体的位置？还是我应该在其他地方这样做？
你在使用 EXT:bootstrap_package 吗？
是的，虽然我只包括 Bootstrap 包：内容元素
如果您使用的是 EXT:bootstrap_package - 这是这个：extensions.typo3.org/extension/bootstrap_package 我看到它还添加了一个“轮播全屏”内容元素。还是我们在谈论不同的扩展？说是建议大家先发现<div class="container"是页面模板添加还是内容元素本身添加的
我正在使用链接扩展，我也已经在使用“轮播全屏”内容元素。 “容器” div 是由我相信的页面模板添加的，这似乎是由于造成的，我认为它插入了引导程序的主要部分之一？