wordpress小部件布局

Question

我创建了一个页脚边栏，并且浮动了第一个li元素，所以这些小部件保持水平。但我该怎么做：

• 如果有2个部件，那么他们将有50％的宽度。
• 如果有3个小工具，那么他们将有33％的宽度。
• 最后，如果有4个小工具，那么他们将有25％的宽度。

Answer 1

可悲的是，我不认为有一种方法来检查多少部件在侧边栏。但是，您可以检查侧边栏是否有活动小部件： https://codex.wordpress.org/Function_Reference/is_dynamic_sidebar

因此，您可以为您的主题创建4个侧栏。然后，在模板文件中，通过检查每个边栏来查看它是否具有活动小部件，以检查有多少个活动。计算活动边栏的数量，并知道需要的列数。

然后，将相关CSS样式应用于每个输出。有点破解，但在很多方面都有帮助。

如果某人有5个小工具会怎么样？这样，您可以间接设置列的数量，然后根据边栏垂直放置小部件。

这是否有意义？

Answer 2

我可以想出三种方法来实现这一点。首先，使用wp_get_sidebars_widgets。检查返回数组的长度以确定有多少个小部件。

接下来我的优先顺序是三个选项。

当你输出你的列表项时，内联应用％width属性。

for each (widget in widgets) { 
    echo '<li style="width: ' + 100/widgets.length + '%">'; 
} 

将类分配给每个插件，动态输出一些CSS尺寸他们

echo '<style> .widget { width: (same calc is in 1)} </style> 
echo '<li class="widget">' ; 

通过JavaScript做它客户端。

var widgets = document.getElementsByClassName('widgets'); 
for (var i = 0; i < widgets.length; i++) { 
    widgets[i].style.width = 100/widgets.length + '%'; 
}