README

描述

响应式网页设计今天真的很流行（而且是强制性的）。但在某些情况下，它可能不是最佳解决方案。

大多数响应式网站向桌面、平板或移动用户提供相同数量的数据。如果加载时间过长，许多移动用户会离开您的网站。或者，有时您的设计需要不同的标记来支持您的设计决策。

如果您对此主题感兴趣，可以阅读以下文章

本软件包包含哪些内容？

本软件包包含MobileDetect库，并扩展了Action Request类，新增两个新方法

ActionRequest::isMobile()
ActionRequest::isTablet()

您可以在自己的控制器、Fusion原型中使用这些方法...

没有魔法，一切都可以配置

调整Fusion原型以根据设备类型更改渲染

prototype(Your.Package.CustomElement) < prototype(Neos.Fusion:Case) {
    default {
        condition = ${request.mobile}
        itemRenderer = Your.Package.CustomElementDefault
    }
    default {
        condition = true
        itemRenderer = Your.Package.CustomElementDefault
    }
    
    @cache {
        mode = 'dynamic'
        entryIdentifier {
          node = ${node}
        }
        entryDiscriminator = ${request.mobile : 'mobile' ? 'default'}
        context {
                1 = 'node'
                2 = 'documentNode'
        }
        entryTags {
                1 = ${'Node_' + node.identifier}
        }
    }
}

使用dynamic缓存模式，您不需要配置上级缓存段。

为移动、平板和桌面提供完全不同的标记

您可以覆盖您的root Fusion条件以选择不同客户端的不同渲染

root {
    mobile {
        @position = 'before default'
        condition = ${request.mobile && Configuration.setting('Ttree.Ress.enable.mobile') == true}
        type = 'Your.Package:MobilePage'
    }
    tablet {
        @position = 'before default'
        condition = ${request.tablet && Configuration.setting('Ttree.Ress.enable.tablet') == true}
        type = 'Your.Package:TabletPage'
    }
    @cache {
        entryIdentifier {
            mobile = ${request.mobile && Configuration.setting('Ttree.Ress.enable.mobile') == true ? 'mobile' : ''}
            tablet = ${request.tablet && Configuration.setting('Ttree.Ress.enable.tablet') == true ? 'tablet' : ''}
        }
    }
}

在此示例中，正确配置了移动和桌面缓存条目的根缓存标识符。请确保正确配置您的其他缓存段。

赞助商和贡献者

此软件包的开发由ttree（https://ttree.ch）和techniconcept（https://techniconcept.ch）赞助。

ttree / ress

维护者

详细信息