Özel bir widget içinden before_widget öğesine sınıf ekleyin


10

Genişliğini (daha sonra ön uçta kullanılır) soran basit bir özel widget var. Genişlik alanı bir seçim açılır listesidir, bu nedenle kullanıcının önceden tanımlanmış seçenekleri vardır.

Widget'ımın birçok örneğine sahip olacağım, her birinin kendi genişlik ayarı olacak.

Şimdi, widget kodumda şu kod var:

echo $before_widget;

sonuç:

<div class="widget my" id="my-widget-1"></div>

Ne yapmak istiyorum bir şekilde kanca $before_widgetve kendi sınıf eklemek (seçin açılan açılır genişliği). Yani, aşağıdaki işaretlemeyi istiyorum:

<div class="widget my col480" id="my-widget-3"></div>

Ve belirtilmiş bir sınıf yoksa eklemek istiyorum class="col480".

Bunu nasıl başarabilirim?

Yardım için teşekkürler! Dasha

Yanıtlar:


14

Aha, böylece $before_widgetdeğişken div öğesi temsil eden bir dizedir: <div class="widget my" id="my-widget-1">. Bu yüzden $before_widget"class" alt dizesini kontrol ettim ve $widget_widthbuna değerimi ekledim .

Kod benim özel widget dosyamdan:

function widget( $args, $instance ) {
  extract( $args );
  ... //other code

  $widget_width = !empty($instance['widget_width']) ? $instance['widget_width'] : "col300";
  /* Add the width from $widget_width to the class from the $before widget */
  // no 'class' attribute - add one with the value of width
  if( strpos($before_widget, 'class') === false ) {
    // include closing tag in replace string
    $before_widget = str_replace('>', 'class="'. $widget_width . '">', $before_widget);
  }
  // there is 'class' attribute - append width value to it
  else {
    $before_widget = str_replace('class="', 'class="'. $widget_width . ' ', $before_widget);
  }
  /* Before widget */
  echo $before_widget;

  ... //other code
}

$widget_widthDeğişkeni kolay bir erişimim varken, $widget_widthdeğişkenimi kendi widget kodumdaki widget div öğesine eklemek istedim .

Umarım mantıklıdır ve birine yardım eder.

Teşekkürler Dasha


iyi iş - bana bir widget sorunu ile yardımcı oldu - teşekkürler :)
Q Studio

10

dynamic_sidebar_paramswidget'ınızı bulmak ve sınıflarınızı buna eklemek için filtre kancasını kullanabilirsiniz :

add_filter('dynamic_sidebar_params', 'add_classes_to__widget'); 
function add_classes_to__widget($params){
    if ($params[0]['widget_id'] == "my-widget-1"){ //make sure its your widget id here
        // its your widget so you add  your classes
        $classe_to_add = 'col480 whatever bla bla '; // make sure you leave a space at the end
        $classe_to_add = 'class=" '.$classe_to_add;
        $params[0]['before_widget'] = str_replace('class="',$classe_to_add,$params[0]['before_widget']);
    }
    return $params;
} 

Yanıtınız için teşekkürler. Her biri kendi genişliğine sahip özel widget'ımın birçok örneğine sahip olacağım. Bu yüzden filtre yerine widget kodunun içine ekstra sınıf eklemek istedim. Bu mantıklı mı?
dashaluna

iyi örnek seçenekleri seçenek tablosuna kaydedilir, böylece widget id kullanarak bir kez oradan alabilirsinizget_option('widget-name')
Bainternet

1
yardımın için çok teşekkürler! Üzgünüm, çözümünüzü gerçekten anlamıyorum :( Ve tüm kodun özel widget dosyamda olmasını istedim, genişlik değişkenine kolayca erişebilirim. Dizeyi hackledim $before_widget. doğru parça bu $before_widgetbir dize olduğunu keşfetmek . Tekrar teşekkürler :)
dashaluna

Tema dosyalarını düzenlemek yerine wordpress filtreleri kullandığından tercih edilen bir seçenek olurdu
rhysclay 15:17

6

Özel bir widget için bir sınıf eklemek için buldum başka bir yolu, gibi yapı işlevinizin ' classname ' anahtarını kullanmaktır :

class My_Widget_Class extends WP_Widget {
// Prior PHP5 use the children class name for the constructor…
// function My_Widget_Class()
       function __construct() {
            $widget_ops = array(
                'classname' => 'my-class-name',
                'description' => __("Widget for the sake of Mankind",'themedomain'),
            );
            $control_ops = array(
                'id_base' => 'my-widget-class-widget'
            );
   //some more code after...

   // Call parent constructor you may substitute the 1st argument by $control_ops['id_base'] and remove the 4th.
            parent::__construct(@func_get_arg(0),@func_get_arg(1),$widget_ops,$control_ops);
        }
}

Ve temanızda varsayılan ' before_widget ' kullandığınızdan veya function.php dosyasında kullandığınızdan emin olun register_sidebar():

//This is just an example.
register_sidebar(array(
          'name'=> 'Sidebar',
            'id' => 'sidebar-default',
            'class' => '',//I never found where this is used...
            'description' => 'A sidebar for Mankind',
            'before_widget' => '<aside id="%1$s" class="widget %2$s">',//This is the important code!!
            'after_widget' => '</aside>',
            'before_title' => '<h3>',
            'after_title' => '</h3>',
        ));

Daha sonra widget'inizin her örneğinde, "widget benim sınıfım-adı" sınıfına sahip olacaksınız:

<aside class="widget my-class-name" id="my-widget-class-widget-N"><!-- where N is a number -->
  <h3>WIDGET TITLE</h3>
  <p>WIDGET CONTENT</p>
</aside>

Ayrıca önce üst yapıcıyı çağırabilir ve ardından istediğiniz sınıf adını ekleyebilirsiniz:

class My_Widget_Class extends WP_Widget {
    // Better defining the parent argument list …
    function __construct($id_base, $name, $widget_options = array(), $control_options = array())
    {    parent::__construct($id_base, $name, $widget_options, $control_options);
         // Change the class name after
         $this->widget_options['classname'].= ' some-extra';
    }
}

1

önce yapıcıya özel bir yer tutucu sınıfı ekleyin

<?php
public function __construct() {
   $widget_ops  = array(
      'classname'                   =>; 'widget_text eaa __eaa__', //__eaa__ is my placeholder css class
      'description'                 =>; __( 'AdSense ads, arbitrary text, HTML or JS.','eaa' ),
      'customize_selective_refresh' =>; true,
   );
   $control_ops = array( 'width' =>; 400, 'height' =>; 350 );
   parent::__construct( 'eaa', __( 'Easy AdSense Ads &amp; Scripts', 'eaa' ), $widget_ops, $control_ops );
}
?>

Ardından, bunun gibi widget seçeneklerine göre istediğiniz sınıflarla değiştirin

<?php
if ( $instance['no_padding'] ) {
   $args['before_widget'] = str_replace( '__eaa__', 'eaa-clean', $args['before_widget'] );
}
?>

Ayrıntıları örnekle http://satishgandham.com/2017/03/adding-dynamic-classes-custom-wordpress-widgets/ adresinde bulabilirsiniz.


0

Bu filtreyi deneyebilirsiniz:

/**
 * This function loops through all widgets in sidebar 
 * and adds a admin form value to the widget as a class name  
 *  
 * @param array $params Array of widgets in sidebar
 * @return array
*/

add_filter( 'dynamic_sidebar_params', 'nen_lib_add_class_to_widget' );
function nen_lib_add_class_to_widget( $params )
{
    foreach( $params as $key => $widget )
    {
        if( !isset($widget['widget_id']) ) continue;

        // my custom function to get widget data from admin form (object)
        $widget_data = nen_get_widget_data($widget['widget_id']) ;

        // check if field excists and has value
        if( isset($widget_data->wm_name) && $widget_data->wm_name )
        {
            // convert and put value in array
            $classes = array( sanitize_title( $widget_data->wm_name ) );

            // add filter, to be able to add more
            $classes = apply_filters( 'nen_lib_add_class_to_widget' , $classes , $widget['widget_id'] , $widget , $widget_data  );

            // get 'before_widget' element, set find and replace
            $string     = $params[$key]['before_widget'];
            $find       = '"widget ';
            $replace    = '"widget '.implode( ' ' , $classes ).' ';

            // new value
            $new_before = str_replace( $find , $replace , $string ) ;

            // set new value
            $params[$key]['before_widget'] = $new_before;
        }
    }
    return $params;
}
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.