Question

我试图使它工作灯箱式图像弹出窗口，但没有 - 所有扩展都不起作用。似乎typo3配置或whatelse有问题。 E.E. ＆＃34;完美灯箱＆＃34; - 安装，模板添加，在相关图像复选框＆＃34;点击放大＆＃34;和＆＃34;灯箱＆＃34;检查。但没有任何反应。在浏览器控制台中没有JS错误，装载了Perfect Lightbox的JS文件。在页面源代码中，图像周围的代码如下所示：

<a href="http://.../index.php?eID=tx_cms_showpic&amp;file=17&amp;md5=14b002d6aa25f9dd945e2a4e6c21ea4347298d11&amp;parameters%5B0%5D=YTo0OntzOjU6IndpZHRoIjtzOjQ6IjgwMG0iO3M6NjoiaGVpZ2h0IjtzOjQ6IjYw&amp;parameters%5B1%5D=MG0iO3M6NzoiYm9keVRhZyI7czo0MToiPGJvZHkgc3R5bGU9Im1hcmdpbjowOyBi&amp;parameters%5B2%5D=YWNrZ3JvdW5kOiNmZmY7Ij4iO3M6NDoid3JhcCI7czozNzoiPGEgaHJlZj0iamF2&amp;parameters%5B3%5D=YXNjcmlwdDpjbG9zZSgpOyI%2BIHwgPC9hPiI7fQ%3D%3D" onclick="openPic('http:\/\/...\/index.php?eID=tx_cms_showpic\u0026file=17\u0026md5=14b002d6aa25f9dd945e2a4e6c21ea4347298d11\u0026parameters%5B0%5D=YTo0OntzOjU6IndpZHRoIjtzOjQ6IjgwMG0iO3M6NjoiaGVpZ2h0IjtzOjQ6IjYw\u0026parameters%5B1%5D=MG0iO3M6NzoiYm9keVRhZyI7czo0MToiPGJvZHkgc3R5bGU9Im1hcmdpbjowOyBi\u0026parameters%5B2%5D=YWNrZ3JvdW5kOiNmZmY7Ij4iO3M6NDoid3JhcCI7czozNzoiPGEgaHJlZj0iamF2\u0026parameters%5B3%5D=YXNjcmlwdDpjbG9zZSgpOyI%2BIHwgPC9hPiI7fQ%3D%3D','thePicture','width=800,height=600,status=0,menubar=0'); return false;" target="thePicture">
  <img src="http://.../fileadmin/_processed_/csm_room_05_3bd2eeb267.jpg" width="150" height="112" alt="" />
</a>

没有生成任何类型的灯箱（应该在那里吗？）

Answer 1

今天也偶然发现了这个问题！

这将在你的ts-setup中起作用：

# deactivate fsc popup, lightbox wrap
lib.fluidContent.settings.media.popup {
    directImageLink = 1
    JSwindow = 0
    linkParams.ATagParams.dataWrap = class="lightbox" data-fancybox-group="lb{field:uid}"
}

你必须根据你的lightbox-plugin更改“dataWrap”-Attributes，给定的例子适用于fancybox。

（最初在这里找到：https://forum.typo3.org/index.php/t/213375/）

Answer 2

从TYPO3 7开始，您可以使用CSC（css_styled_content）或FSC（fluid_styled_content）来呈现您的页面内容。两种扩展都使用不同的方法来呈现内容元素。你用什么？

你看过的扩展可能只增强/修改了其他渲染扩展吗？您尝试了哪些扩展？
你有他们的静态模板吗？

如果您对所有这些都不满意，您还可以使用任何javascript-gallery / -picture-viewer，并且几乎不需要插入特殊标记和小JS来初始化查看器：

在http://lokeshdhakar.com/projects/lightbox2/上找到的一个示例灯箱库除了包含jquery和JS库之外，您还需要在基于HTML标记的初始化中包含一些JS。该库似乎适用于具有相同数据属性data-lightbox的所有图像：

设置选项：

lightbox.option({
  'resizeDuration': 200,
  'wrapAround': true
})

对于您的图片，请务必使用以下数据属性增强渲染：

<a href="images/image-2.jpg" data-lightbox="my_lightbox">Image #2</a>
<a href="images/image-3.jpg" data-lightbox="my_lightbox">Image #3</a>
<a href="images/image-4.jpg" data-lightbox="my_lightbox">Image #4</a>

如果在一个页面上提供多个灯箱或仅包含选定的图像

，可能会使其变得更加复杂

Answer 3

链接在您的代码段中仍然使用默认渲染来打开弹出窗口。

正如Bernd所提到的，您可能忘记添加静态模板。

也许您可以尝试添加以下内容

# turn of the popup window
tt_content.image.20.1.imageLinkWrap.JSwindow = 0

# create a link to a bigger verion of the image
tt_content.image.20.1.imageLinkWrap.directImageLink = 1

如果js和css到位，它可能会工作。

<小时/> 编辑：由于您使用 fluid_styled_content ：

styles {
    content {
        textmedia {
            linkWrap.lightboxEnabled = 1
            linkWrap.lightboxCssClass = fluidbox
            linkWrap.lightboxRelAttribute >
        }
    }
}

根据您的需要修改lightboxCssClass和lightboxRelAttribute。使用JS和CSS，您不需要任何扩展。

TYPO3 7.6无灯箱扩展工作

3 个答案: