Adaugă clasa la before_widget dintr-un widget personalizat

1 iun. 2011, 15:00:10
Vizualizări: 19.7K
Voturi: 10

Am un widget personalizat simplu care solicită lățimea sa (care este folosită ulterior în frontend). Câmpul pentru lățime este un dropdown select, astfel încât utilizatorul are opțiuni predefinite.

Voi avea multe instanțe ale widget-ului meu, fiecare având propria setare pentru lățime.

Acum, în codul widget-ului meu am următorul cod:

echo $before_widget;

care rezultă în:

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

Ceea ce aș dori să fac este să mă conectez cumva la $before_widget și să adaug propria mea clasă (lățimea specificată din dropdown-ul select). Deci, vreau următorul markup:

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

Iar dacă nu există nicio clasă specificată, atunci vreau să adaug class="col480".

Cum pot realiza acest lucru?

Mulțumesc pentru ajutor! Dasha

0
Toate răspunsurile la întrebare 5
1
15

Aha, deci variabila $before_widget este un șir de caractere care reprezintă un element div: <div class="widget my" id="my-widget-1">. Așa că am verificat $before_widget pentru subșirul "class" și am adăugat valoarea mea $widget_width la acesta.

Codul este din fișierul meu de widget personalizat:

function widget( $args, $instance ) {
  extract( $args );
  ... //alt cod

  $widget_width = !empty($instance['widget_width']) ? $instance['widget_width'] : "col300";
  /* Adaugă lățimea din $widget_width la clasa din $before_widget */
  // nu există atribut 'class' - adaugă unul cu valoarea lățimii
  if( strpos($before_widget, 'class') === false ) {
    // include tag-ul de închidere în șirul de înlocuire
    $before_widget = str_replace('>', 'class="'. $widget_width . '">', $before_widget);
  }
  // există atribut 'class' - adaugă valoarea lățimii la acesta
  else {
    $before_widget = str_replace('class="', 'class="'. $widget_width . ' ', $before_widget);
  }
  /* Before widget */
  echo $before_widget;

  ... //alt cod
}

Am vrut să adaug variabila mea $widget_width la elementul div al widget-ului în cadrul codului meu de widget (când aveam acces ușor la variabila $widget_width).

Sper că are sens și că va ajuta pe cineva.

Mulțumesc, Dasha

2 iun. 2011 18:30:00
Comentarii

muncă excelentă - m-a ajutat cu o problemă legată de widget - mulțumesc :)

Q Studio Q Studio
21 oct. 2012 22:52:14
5
11

poți folosi cârligul de filtrare dynamic_sidebar_params pentru a găsi widget-ul tău și pentru a-i adăuga clasele tale:

add_filter('dynamic_sidebar_params', 'add_classes_to__widget'); 
function add_classes_to__widget($params){
    if ($params[0]['widget_id'] == "my-widget-1"){ //asigură-te că este ID-ul widget-ului tău aici
        // este widget-ul tău, așa că adaugi clasele tale
        $classe_to_add = 'col480 whatever bla bla '; // asigură-te că lași un spațiu la sfârșit
        $classe_to_add = 'class=" '.$classe_to_add;
        $params[0]['before_widget'] = str_replace('class="',$classe_to_add,$params[0]['before_widget']);
    }
    return $params;
} 
1 iun. 2011 16:03:38
Comentarii

mulțumesc pentru răspuns. Voi avea multe instanțe ale widget-ului meu personalizat, fiecare cu lățimea ei specifică. De aceea am vrut să adaug o clasă suplimentară direct în codul widget-ului, nu prin filtru. Sper că are sens?

dashaluna dashaluna
1 iun. 2011 16:37:15

opțiunile instanței sunt salvate în tabelul de opțiuni, deci le poți obține de acolo odată ce știi ID-ul widget-ului folosind get_option('widget-name')

Bainternet Bainternet
1 iun. 2011 19:14:42

mulțumesc mult pentru ajutor! Îmi pare rău, dar nu înțeleg prea bine soluția ta :( Și am vrut ca tot codul să fie în fișierul widget-ului meu personalizat, în timp ce pot accesa cu ușurință variabila de lățime. Am ajuns să modific șirul $before_widget. Răspunsul tău m-a pus pe drumul cel bun descoperind că $before_widget este un șir. Mulțumesc din nou :)

dashaluna dashaluna
2 iun. 2011 18:32:29

Aceasta ar fi o opțiune preferată, deoarece utilizează filtre WordPress în loc să editeze fișierele temei.

rhysclay rhysclay
15 mar. 2017 06:51:53

Acest lucru este excelent - mulțumesc. Cu toate acestea, personal prefer să folosesc $params[0]['id'] în loc de $params[0]['widget_id'], deoarece acesta este id-ul cu care vei înregistra bara laterală/widget-ul.

Brett Brett
26 mai 2020 02:25:26
0

O altă metodă pe care am găsit-o pentru a adăuga o clasă unui widget personalizat este să utilizați cheia 'classname' din funcția de constructie, ca în exemplul următor:

class My_Widget_Class extends WP_Widget {
// Înainte de PHP5 se folosea numele clasei copil pentru constructor…
// function My_Widget_Class()
       function __construct() {
            $widget_ops = array(
                'classname' => 'my-class-name',
                'description' => __("Widget pentru binele Omenirii",'themedomain'),
            );
            $control_ops = array(
                'id_base' => 'my-widget-class-widget'
            );
   //mai mult cod după...

   // Apelăm constructorul părintelui; puteți înlocui primul argument cu $control_ops['id_base'] și elimina al 4-lea.
            parent::__construct(@func_get_arg(0),@func_get_arg(1),$widget_ops,$control_ops);
        }
}

Și asigurați-vă că utilizați 'before_widget' implicit în tema dumneavoastră sau, dacă folosiți register_sidebar() în functions.php, faceți astfel:

//Acesta este doar un exemplu.
register_sidebar(array(
          'name'=> 'Sidebar',
            'id' => 'sidebar-default',
            'class' => '',//Nu am găsit niciodată unde este folosit acest lucru...
            'description' => 'O bară laterală pentru Omenire',
            'before_widget' => '<aside id="%1$s" class="widget %2$s">',//Acesta este codul important!!
            'after_widget' => '</aside>',
            'before_title' => '<h3>',
            'after_title' => '</h3>',
        ));

Astfel, pe fiecare instanță a widget-ului dumneavoastră, veți avea clasa 'widget my-class-name', ca mai jos:

<aside class="widget my-class-name" id="my-widget-class-widget-N"><!-- unde N este un număr -->
  <h3>TITLUL WIDGET-ULUI</h3>
  <p>CONȚINUTUL WIDGET-ULUI</p>
</aside>

De asemenea, puteți apela mai întâi constructorul părintelui și apoi adăugați orice nume de clasă doriți:

class My_Widget_Class extends WP_Widget {
    // Definirea mai bună a listei de argumente părinte...
    function __construct($id_base, $name, $widget_options = array(), $control_options = array())
    {    parent::__construct($id_base, $name, $widget_options, $control_options);
         // Schimbăm numele clasei după
         $this->widget_options['classname'].= ' some-extra';
    }
}
12 feb. 2014 15:52:09
0

mai întâi adaugă o clasă personalizată de placeholder în constructor

<?php
public function __construct() {
   $widget_ops  = array(
      'classname'                   =>; 'widget_text eaa __eaa__', //__eaa__ este clasa mea CSS de placeholder
      'description'                 =>; __( 'Reclame AdSense, text arbitrar, HTML sau 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 );
}
?>

Apoi înlocuiește-o cu clasa/cele clase de alegere bazate pe opțiunile widget-ului astfel

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

Poți găsi detaliile cu exemplu la http://satishgandham.com/2017/03/adding-dynamic-classes-custom-wordpress-widgets/

12 mar. 2017 20:27:27
0

Puteți încerca acest filtru:

/**
 * Această funcție parcurge toate widget-urile din bara laterală 
 * și adaugă o valoare din formularul de administrare ca nume de clasă pentru widget  
 *  
 * @param array $params Array de widget-uri în bara laterală
 * @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;

        // funcția mea personalizată pentru a obține datele widget-ului din formularul de administrare (obiect)
        $widget_data = nen_get_widget_data($widget['widget_id']) ;

        // verifică dacă câmpul există și are valoare
        if( isset($widget_data->wm_name) && $widget_data->wm_name )
        {
            // convertește și pune valoarea în array
            $classes = array( sanitize_title( $widget_data->wm_name ) );

            // adaugă filtru, pentru a putea adăuga mai multe
            $classes = apply_filters( 'nen_lib_add_class_to_widget' , $classes , $widget['widget_id'] , $widget , $widget_data  );

            // obține elementul 'before_widget', setează ceea ce trebuie găsit și înlocuit
            $string     = $params[$key]['before_widget'];
            $find       = '"widget ';
            $replace    = '"widget '.implode( ' ' , $classes ).' ';

            // noua valoare
            $new_before = str_replace( $find , $replace , $string ) ;

            // setează noua valoare
            $params[$key]['before_widget'] = $new_before;
        }
    }
    return $params;
}
3 oct. 2018 20:56:55