web-dev-qa-db-fra.com

Ajout de cours à la barre latérale dynamique

Hé, j'essaie donc de créer cette condition qui crée automatiquement une disposition de grille lorsque des widgets/barres latérales sont ajoutés et supprimés. L'objectif est de permettre à l'utilisateur de mettre le plus de widgets possible sans se soucier de la mise en page. Ceci est mon code, laissez-moi savoir si vous voulez que je m'explique davantage:

if (function_exists('create_widget') && dynamic_sidebar('sidebar-1') && dynamic_sidebar('sidebar-2') && dynamic_sidebar('sidebar-3') ) {
            $layout_classes = "col-md-4";
    }       elseif ( is_active_sidebar( 'sidebar-1' ) && is_active_sidebar( 'sidebar-2' ) ) {
                $layout_classes = "col-md-6";
    } else {
            $layout_classes = "col-md-2";
    }

<div class="row"
    <div class="container">
        <div class="col-md-12">
        <div class="<?php echo $layout_classes ?>">

                                <?php dynamic_sidebar( 'sidebar-1'); ?>

                                    <?php dynamic_sidebar( 'sidebar-2'); ?>

                                        <?php dynamic_sidebar( 'sidebar-3'); ?>

</div>
</div>
</div>
</div><!--End Layout Class-->

P.S. Utilisation de Bootstrap 3.

2
Carl Sergile

Vous n'avez pas réellement dit quel était le problème. Mais je peux en voir un pour commencer - dynamic_sidebar dans vos conditions if fera immédiatement écho aux widgets. Si vous voulez cocher une barre latérale a des widgets, utilisez is_active_sidebar :

is_active_sidebar( 'sidebar-1' ); // True/false
1
TheDeadMedic

Il y a une réponse ici , mais elle repose sur wp_get_sidebars_widgets , qui est déprécié aussi bien que privé.

Ce code ressemble à une solution meilleure et plus robuste:

C'est en fait assez simple. Je l'ai utilisé pour ajouter des classes à mon widget pour PureCSS framework.

Dans ce cas, nous voulons que le conteneur externe ait la classe pure-g pour la "grille". Et les éléments internes doivent avoir la classe pure-u-1-*, où l'astérisque est le nombre total de colonnes, dans ce cas, le nombre de widgets.

Alors enregistrez la barre latérale:

register_sidebar([
    'name'          => __('Footer Widget Area', 'pure-demo'),
    'id'            => 'sidebar-footer',
    'class'            => 'pure-g',
    // Next line has our callback
    'before_widget'  => '<section class="widget %2$s '. slbd_count_widgets( 'sidebar-footer' ) .'">',
    'after_widget'  => '</section>',
    'before_title'  => '<h3>',
    'after_title'   => '</h3>'
]);

Et voici notre fonction de rappel:

 function slbd_count_widgets( $sidebar_id ) {
  // If loading from front page, consult $_wp_sidebars_widgets rather than options
  // to see if wp_convert_widget_settings() has made manipulations in memory.
  global $_wp_sidebars_widgets;
  if ( empty( $_wp_sidebars_widgets ) ) :
    $_wp_sidebars_widgets = get_option( 'sidebars_widgets', array() );
  endif;

  $sidebars_widgets_count = $_wp_sidebars_widgets;

  if ( isset( $sidebars_widgets_count[ $sidebar_id ] ) ) :
    $widget_count = count( $sidebars_widgets_count[ $sidebar_id ] );
    $widget_classes = '';
    $widget_classes .= 'pure-u-1 pure-u-sm-1-1';
    $widget_classes .= ' pure-u-md-1-' . ceil($widget_count / 2);
    $widget_classes .= ' pure-u-lg-1-' . $widget_count;
    return $widget_classes;
  endif;
}

Ensuite, je l'affiche comme ceci:

<footer class="content-info pure-g">
  <?php if ( is_active_sidebar( 'sidebar-footer' ) ) : ?>
      <?php dynamic_sidebar( 'sidebar-footer' ); ?>
  <?php endif; ?>
  <div id="colophon" class="site-footer" role="contentinfo">
  <?php
    if ( has_nav_menu( 'footer_links' ) ) :
       wp_nav_menu(['theme_location' => 'footer_links', 'container_class' => 'pure-menu', 'menu_class' => 'pure-menu-list']);
    endif;
  ?>
  </div>
</footer>
0
MikeiLL