在响应主题中管理块

15

我刚刚开始基于Omega的响应式主题，首先关注移动布局。

有些块可能会被认为太“笨重”，无法包含在移动布局中，而其他一些块则需要专门针对该布局引入（淡化菜单，淡化的用户栏等）。

我可以使用CSS轻松隐藏移动布局中不需要的块，并在默认布局中包含特定于移动设备的块，然后将其隐藏（因此仅在移动设备上显示），但这似乎是一种倒退的思考方式它。如果未显示块，那么它们所产生的额外开销确实是不可接受的（特别是考虑到隐藏块中的内容将添加的额外数据库查询的数量）。

我认为必须有一种不错的干净方法来在页面构建的早期阶段拦截块决策过程，并基于某些os-detection排除/包含块，但我对此可能是空白可能。

我还要说明一个事实，那就是Varnish正在本网站的前面运行，这应该会使事情变得更加有趣:)

是否有模块/已知策略可以对此提供帮助？

我应该补充一点，因为该站点已经完全成熟，所以使用Context模块不是一个选择，此时将其移至Context中将是一项艰巨的任务。

blocks theming

— 克莱夫
source

4

毫无疑问，我会使用面板和相关的用户代理访问插件。上下文可能会做同样的事情，但是正如您已经说过的那样，这不是一个选择。评估当然存在着可怕的可能性：提高块的可见性，但是...另一方面，在使用Varnish的情况下，这些块执行的额外的数据库查询可能不是什么大问题？

— Letharion 2012年

@Letharion是的，这是想法，让Varnish消除压力。该站点有数十万活跃用户，而Varnish仅涉及匿名流量。我们将很快开始使用ESI，但即使那样我仍然可以想到问题...从SEO的角度来看，额外的标记/菜单会很沉重，并且可能会造成混淆，更不用说页面上额外的（不必要的）权重了移动用户。这是一个艰难的！

— 克莱夫（Clive）

1

也许在最重的页面上添加一个更智能的块处理程序（面板/上下文/其他），这样您就可以从中获得一些好处，而无需重做整个站点？

— Letharion

1

我不同意这会使问题变得愚蠢，或者使游戏彻底改变。可以将Varnish配置为很好地解决该问题，即开即用的配置也不知道如何解决。

— Letharion 2012年

2

@Clive：有一句老话：“没有愚蠢的问题，只有愚蠢的答案！” ;-)

— AjitS 2012年

4

在页面构建的早期阶段拦截块决策过程，并基于某些os-detection排除/包含块

Varnish正在此站点前运行

正如在评论中指出不已，这需要你配置清漆不是只在请求URL缓存，同时也对用户代理不同而不同。清漆Wiki中有一个相关示例VCLExampleNormalizeUserAgent。

一旦请求实际上没有击中的部位，你需要确定要显示的块和不显示。我认为使用eval进行此操作将不亚于灾难，因此剩下的最常见的选择是Context和Panels。

网站已经建立。使用这两个模块重做所有页面/块的位置可能不是一个选择，但是使用事件探查器并应用80-20，仅重做特定页面就可以显着提高性能。

— 莱瑟里奥
source

真的很有趣，谢谢。有问题的站点位于万神殿，所以我不认为配置Varnish是一个选择，但是现在这变成了一个更笼统的“理论上该如何做”类型的问题，因此非常有帮助

— Clive

Pantheon允许您设置STYXKEY cookie（在helpdesk.getpantheon.com/customer/portal/articles/425726的末尾），它们允许您细分Varnish缓存/为匿名用户提供的服务。

— Jimajamma 2012年

完全按此赏金间隔，我想将其分配给两个答案，但生活却不是那样。系统选择了Chapabu来给予赏金，所以绿色的小勾号会出现在您的队友身上：)

— Clive

10

我无法详细介绍很多细节，因为我已经很久没有使用任何一个模块了（我从go一词就使用Context构建了我的所有网站，并且我没有对没有为一会儿，所以我以前没有这个问题），但是我认为您应该可以将某些东西与Mobile Tools and Spaces结合在一起。

空间

Spaces是一个API模块，旨在使配置选项通常仅在站点范围内可用，以被Drupal站点上的各个“空间”配置和覆盖。它被描述为：

一种使一个Drupal站点像多个站点一样工作的方法

提供更多可配置的全功能有机组或用户主页的方法

用于上下文配置的通用API

行动工具

移动工具模块为Drupal开发人员提供了一些工具，以帮助根据访问者的设备对您的站点进行调整。

MT的项目页面确实说它还没有准备好投入生产，这可能是一个问题-它取决于上次更新的时间，因为最后一次提交是在本月。

*编辑

我完全忘记了这些！

浏览器

Browscap提供了PHP get_browser（）函数的改进版本。

cap帽

Browscap Block添加了可见性选项以阻止配置设置，以允许您隐藏或显示移动设备中的阻止。

Browscap确实取决于服务器设置，但是如果可以使用Browscap，则第二个模块为您提供了块编辑页面上每个块的额外可见性设置。

在此处输入图片说明

— Chapabu
source

Browscap Block看上去非常有前途，谢谢，我将在接下来的几天中进行检查，并让您知道

— Clive

糟糕，这完全摆脱了我，对不起您的一半悬赏！

— 克莱夫（Clive）

0

您可以使用jQuery跨浏览器支持来获取屏幕分辨率：

var browserWidth  = $(window).width();
var browserHeight = $(window).height();

添加简单的PHP脚本以显示相关块的设置。

— 蒙尼米尔扎
source

谢谢，但这是否意味着转换整个站点以将AJAX用于块？我要做到这一点的服务器端，如果在所有可能的

— 克莱夫

0

您可以使用“ 移动检测块”，但是我目前正在寻找一种适用于窗口宽度和AdaptiveThemeBreakpoints模块媒体查询的解决方案，以免重复该代码并降低最终用户的下载量。我还遇到了混合的结果，因为移动检测无法在我测试过的一台设备上使用，如果它不能提供可靠的结果，则它像Browscap一样毫无用处。

一些讨论中有些人出于某种原因希望摆脱Browscap的束缚，因此转向Mobile Detect。

— 花店
source