कस्टम विजेट के भीतर से class_widget में क्लास जोड़ें

Question

मेरे पास एक सरल कस्टम विजेट है जो इसकी चौड़ाई के लिए पूछता है (जिसका उपयोग आगे के अंत में किया जाता है)। चौड़ाई क्षेत्र एक चुनिंदा ड्रॉपडाउन है, इसलिए उपयोगकर्ता के पास पूर्वनिर्धारित विकल्प हैं।

मेरे पास मेरे विजेट के कई उदाहरण होंगे, प्रत्येक की अपनी चौड़ाई सेटअप होगी।

अब, मेरे विजेट कोड में मेरे पास निम्नलिखित कोड हैं:

echo $before_widget;

जिसके परिणामस्वरूप:

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

जो मैं करना चाहता हूं, वह किसी भी तरह से हुक है $before_widgetऔर अपनी खुद की कक्षा (चयन ड्रॉपडाउन से निर्दिष्ट चौड़ाई) जोड़ें। इसलिए, मुझे निम्नलिखित मार्कअप चाहिए:

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

और अगर कोई वर्ग निर्दिष्ट नहीं है तो मैं जोड़ना चाहता हूं class="col480"।

मुझे यह कैसे हासिल होगा?

सहायता के लिए धन्यवाद! दशा

Answer 1

अहा, इसलिए $before_widgetचर एक दिव्य तत्व का प्रतिनिधित्व करने वाला एक स्ट्रिंग है <div class="widget my" id="my-widget-1">:। इसलिए मैंने $before_widget"वर्ग" उप-स्ट्रिंग के लिए जाँच की और इसमें अपना $widget_widthमूल्य जोड़ा ।

कोड मेरी कस्टम विजेट फ़ाइल से है:

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_widthवैरिएबल कोड में अपने वैरिएबल डिव एलिमेंट को अपने वैरिएबल कोड में जोड़ना चाहता था (जबकि मेरी $widget_widthवैरिएबल तक आसान पहुँच थी )।

आशा है कि समझ में आता है और किसी की मदद करेगा।

धन्यवाद, दशा

Comments

अच्छा काम - एक विजेट मुद्दे के साथ मेरी मदद की - धन्यवाद :)

— क्यू स्टूडियो

Answer 2

आप dynamic_sidebar_paramsअपने विजेट को ढूंढने के लिए फ़िल्टर हुक का उपयोग कर सकते हैं और अपनी कक्षाएं इसमें जोड़ सकते हैं:

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;
} 

Comments

उत्तर के लिए धन्यवाद। मेरे पास अपने कस्टम विजेट के बहुत सारे उदाहरण होंगे, जिनमें से प्रत्येक की अपनी विशिष्ट चौड़ाई होगी। इसलिए मैं फ़िल्टर के बजाय विजेट कोड के भीतर अतिरिक्त कक्षा जोड़ना चाहता था। आशा है कि समझ में आता है?

— dashaluna

अच्छी तरह से उदाहरण के विकल्प विकल्प तालिका में सहेजे जाते हैं ताकि आप इसे वहां से प्राप्त कर सकें एक बार जब आप विजेट आईडी का उपयोग करके get_option('widget-name')

— जान लें

आपकी सहायता के लिए धन्यवाद! मुझे खेद है कि मैं वास्तव में आपके समाधान को नहीं समझता :( और मैं चाहता था कि सभी कोड मेरे कस्टम विजेट फ़ाइल के भीतर हों, जबकि मैं चौड़ाई चर को आसानी से कर सकता हूं। मैंने $before_widgetस्ट्रिंग हैक करना समाप्त कर दिया है । आपका जवाब मुझे मिल गया। सही $before_widget

— रास्ता

यह एक पसंदीदा विकल्प होगा क्योंकि यह थीम फ़ाइलों को संपादित करने के बजाय वर्डप्रेस फिल्टर का उपयोग करता है

— rhysclay

Answer 3

एक अन्य तरीका जो मैंने कस्टम विजेट के लिए एक वर्ग को जोड़ने के लिए पाया है, वह आपके निर्माण कार्य की ' क्लासनाम ' कुंजी का उपयोग करना है जैसे:

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);
        }
}

और करने के लिए उपयोग डिफ़ॉल्ट 'सुनिश्चित हो before_widget या यदि आप का उपयोग अपने विषय में' register_sidebar()function.php में, तो वह ऐसा कार्य करें:

//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>',
        ));

फिर आपके विजेट के हर उदाहरण पर, आपके पास इस तरह से 'विजेट मेरा वर्ग-नाम' होगा:

<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>

आप पहले पैरेंट कंस्ट्रक्टर को भी बुला सकते हैं और फिर जो चाहें क्लास का नाम जोड़ सकते हैं:

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';
    }
}

Answer 4

पहले कंस्ट्रक्टर में एक कस्टम प्लेसहोल्डर क्लास जोड़ें

<?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 );
}
?>

फिर इसे विजेट विकल्पों के आधार पर अपनी पसंद के वर्ग / तों से बदलें

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

आप उदाहरण के साथ http://satishgandham.com/2017/03/adding-dynamic-classes-custom-wordpress-widgets/ पर विवरण प्राप्त कर सकते हैं

Answer 5

आप इस फ़िल्टर को आज़मा सकते हैं:

/**
 * 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;
}