限制侧边栏中的小部件数量

时间:2011-06-13 作者:Jukov

如果我使用一个自定义widgetized区域(例如页脚),其中widget的位置数量有限(按设计),那么我是否可以限制用户可能包含在该特定widgetized区域中的widget数量?解决方案是在后端还是在前端并不重要。非常感谢。

4 个回复
SO网友:Jan Fabry

我用Javascript解决了这个问题。如果你想完全阻止它,你也应该在服务器端这样做,因为你可以在禁用Javascript的情况下编辑小部件(试试!)。

当您将小部件拖放到或远离它们时,会检查不同的侧栏。如果它们已满,则背景颜色会改变,您不能再将项目拖放到它们上。如果在启动时,侧边栏已满(因为您收紧了限制),则背景颜色将变为红色。您仍然可以将小部件从完整的小部件中拖出,使其再次变为空。

One full and one more than full sidebar

请测试这段代码,以找到添加或删除我错过的小部件的方法。jQuery代码中的“魔力”来自Aman, 谁answered a Stack Overflow question I posted about it.

Javascript:

jQuery( function( $ ) {
    var sidebarLimits = {
        \'sidebar-1\': 2,
        \'sidebar-2\': 2,
    };
    var realSidebars = $( \'#widgets-right div.widgets-sortables\' );
    var availableWidgets = $( \'#widget-list\' ).children( \'.widget\' );

    var checkLength = function( sidebar, delta ) {
        var sidebarId = sidebar.id;
        if ( undefined === sidebarLimits[sidebarId] ) {
            return;
        }

        // This is a limited sidebar
        // Find out how many widgets it already has
        var widgets = $( sidebar ).sortable( \'toArray\' );
        $( sidebar ).toggleClass( \'sidebar-full\', sidebarLimits[sidebarId] <= widgets.length + (delta || 0) );
        $( sidebar ).toggleClass( \'sidebar-morethanfull\', sidebarLimits[sidebarId] < widgets.length + (delta || 0) );

        var notFullSidebars = $( \'div.widgets-sortables\' ).not( \'.sidebar-full\' );
        availableWidgets.draggable( \'option\', \'connectToSortable\', notFullSidebars );
        realSidebars.sortable( \'option\', \'connectWith\', notFullSidebars );
    }

    // Check existing sidebars on startup
    realSidebars.map( function() {
        checkLength( this );
    } );

    // Update when dragging to this (sort-receive)
    // and away to another sortable (sort-remove)
    realSidebars.bind( \'sortreceive sortremove\', function( event, ui ) {
        checkLength( this );
    } );

    // Update when dragging back to the "Available widgets" stack
    realSidebars.bind( \'sortstop\', function( event, ui ) {
        if ( ui.item.hasClass( \'deleting\' ) ) {
            checkLength( this, -1 );
        }
    } );

    // Update when the "Delete" link is clicked
    $( \'a.widget-control-remove\' ).live( \'click\', function() {
        checkLength( $( this ).closest( \'div.widgets-sortables\' )[0], -1 );
    } );
} );
CSS:

.sidebar-full
{
    background-color: #cfe1ef !important;
}

.sidebar-morethanfull
{
    background-color: #c43 !important;
}
PHP加载它们:

$wpse19907_file = $plugin;
add_action( \'admin_enqueue_scripts\', \'wpse19907_admin_enqueue_scripts\' );
function wpse19907_admin_enqueue_scripts( $hook_suffix )
{
    if ( \'widgets.php\' == $hook_suffix ) {
        wp_enqueue_script( \'wpse-19907\', plugins_url( \'wpse-19907.js\', $GLOBALS[\'wpse19907_file\'] ), array(), false, true );
        wp_enqueue_style( \'wpse-19907\', plugins_url( \'wpse-19907.css\', $GLOBALS[\'wpse19907_file\'] ) );
    }
}
尝试服务器端检查(可能尚未完成):

$wpse19907_sidebars_max_widgets = array(
    \'sidebar-1\' => 2,
);

add_action( \'sidebar_admin_setup\', \'wpse19907_sidebar_admin_setup\' );
function wpse19907_sidebar_admin_setup()
{
    if ( ! isset( $_POST[\'action\'] ) || \'save-widget\' != $_POST[\'action\'] || empty( $_POST[\'add_new\'] ) ) {
        return;
    }

    // We\'re adding a new widget to a sidebar
    global $wpse19907_sidebars_max_widgets;
    $sidebar_id = $_POST[\'sidebar\'];

    if ( ! array_key_exists( $sidebar_id, $wpse19907_sidebars_max_widgets ) ) {
        return;
    }

    $sidebar = wp_get_sidebars_widgets();
    $sidebar = isset( $sidebars[$sidebar_id] ) ? $sidebars[$sidebar_id] : array();

    if ( count( $sidebar ) <= $wpse19907_sidebars_max_widgets[$sidebar_id] ) {
        die( \'mx\' ); // Length must be shorter than 2, and unique
    }
}

SO网友:Hans Zimermann

为了帮助你回答你的问题,我有一个建议。让我们使用first-footer-widget-area 显示在默认的十二五模板中sidebar-footer.php 像示例一样归档。

作为一种良好的做法和安全性,首先备份它以避免麻烦。

最初用于显示第一个页脚小部件的210个模板代码是:

<?php if ( is_active_sidebar( \'first-footer-widget-area\' ) ) : ?>
       <div id="first" class="widget-area">
        <ul class="xoxo">
            <?php dynamic_sidebar( \'first-footer-widget-area\' ); ?>
        </ul>
       </div><!-- #first .widget-area -->
<?php endif; ?>
让我们改变一下,添加一些带有条件的代码来限制该区域中允许的小部件的数量。

<?php if ( is_active_sidebar( \'first-footer-widget-area\' ) ) : ?>
    <div id="first" class="widget-area">
    <?php
           $mysidebars = wp_get_sidebars_widgets();
           $total_widgets = count( $mysidebars[\'first-footer-widget-area\'] );
           $limit_allowed=2;
    ?>
        <ul class="xoxo">
            <?php  if ($total_widgets > $limit_allowed) {
                echo \'Your \'.$total_widgets.\' added widgets goes over the allowed limit: <strong>\'.$limit_allowed.\'</trong>\';
                } else { ?>
            <?php dynamic_sidebar( \'first-footer-widget-area\' ); ?>
          <?php }; ?>
        </ul>

        </div><!-- #first .widget-area -->
<?php endif; ?>
此修改代码的作用:

$mysidebars = wp_get_sidebars_widgets();
$total_widgets = count( $mysidebars[\'first-footer-widget-area\'] );
$limit_allowed=2;
计算侧栏中小部件的数量,并建立一些允许的限制(由您设置)。

...
<?php  if ($total_widgets > $limit_allowed) {
            echo \'Your \'.$total_widgets.\' added widgets goes over the allowed limit: <strong>\'.$limit_allowed.\'</trong>\';
       } else { ?>
            <?php dynamic_sidebar( \'first-footer-widget-area\' ); ?>
<?php }; ?>
...
如果达到该区域中小部件允许的限制,则将显示一条消息警告限制,否则将显示小部件。

所以我希望我能帮助你回答这个问题。

SO网友:kaiser

有趣的Q.看了一眼没发现什么,但这里有一个猜测:print_r( $GLOBALS[\'wp_registered_sidebars\'] );print_r( $GLOBALS[\'sidebars\'] );print_r( $GLOBALS[\'sidebars_widgets\'] ); ...

SO网友:Todd

为了确定小部件的数量,您可以执行以下操作。

Function:

$mysidebars = wp_get_sidebars_widgets() - 将为您提供侧栏和侧栏上使用的小部件的列表。

$total_widgets = count( $mysidebars[\'my-sidebar-id\'] ); - 将为您提供我的侧边栏id中的小部件总数

我希望这能解决你的疑虑。

结束

相关推荐

Problem with widgets

我使用的主题是3灰色。它已启用小部件。主题中很少有硬编码的小部件。这些小部件不会出现在小部件页面的侧栏中。如果我尝试添加新的小部件,旧的小部件会被删除。这是正常情况吗。或者这里有什么问题吗。