需要在 PHP 中添加对 twig 文件的响应

Question

我的 tile.twig 文件中有这个功能，它在轮播中显示一个 post。它在 mobile.I 的纵向模式下工作正常需要它在横向时显示 2 post。但我不知道如何在 twig/PHP 中执行此操作，代码如下：

{{ fn("do_action", "render-carousel", style|default('header-carousel'), carousel_list|default("Header Carousel"), img_size|default("mobile/feed/large"), carousel_show|default(1), extra_options) }}

在横向模式下，我需要 carousel_show|default(1) 为 carousel_show|default(2)。任何想法

Answer 1

不幸的是，要 "tell" PHP 您的设备处于纵向或横向模式并相应地呈现不同数量的 HTML 是很困难的，而且性能根本不佳。

我相信您可能有点卡住了，因为您正在使用插件来渲染轮播，因此无法控制 CSS 或 JS。

如果您自己编写轮播。您将在 CSS:

中使用媒体查询

@media (orientation: landscape) {
  .carousel-slide {
    width: 50%:
  }
}

@media (orientation: portrait) {
  .carousel-slide {
    width: 100%
  }
}

您还需要告诉轮播代码您最初显示的是一张或两张幻灯片：

if (window.matchMedia("(orientation: portrait)").matches) {
  Carousel.init({startingNumberOfSlides:1})
}

if (window.matchMedia("(orientation: landscape)").matches) {
  Carousel.init({startingNumberOfSlides:1})
}

听起来您使用的轮播插件无法实现此效果。

谢谢，

乔恩

需要在 PHP 中添加对 twig 文件的响应

Need to add responsiveness to twig file in PHP

php

wordpress

twig

responsive-design

timber