?? WordPress Tutorial ????? WordPress ??? CSS ??? ???? ??? ???????. ??? ??? ????? ??? ?? ????!

????? ??? ???? ????, ??? ?? ???? ???? ??? ????? ??? ?? ???? ?? ??? ??? ????? ???, ?? ??? ?? ?? ID? ? ? ????. ?? ?? ??? ?? ??? ?????.

<section id="search-2" class="widget widget_search">

??? search-2? ? ??? ID???. #search-2? ???? ???? ??? ? ????. ??? ??? ? ???? ???. ???? ?? ??????.

?? ??? ???? ?? ??? CSS ??? ???? ??? ? ????. ?? ?? ?? ???? function.php? ??? ???? ???. ??? ??? ????.

Code 1

CSS? ?????. ??? ??

function zm_widget_form_extend( $instance, $widget ) {
  if ( !isset($instance['classes']) )
$instance['classes'] = null;
$row = "<p>\n";
$row .= "\t<label for=&#39;widget-{$widget->id_base}-{$widget->number}-classes&#39;>CSS類</label>\n";
$row .= "\t<input type=&#39;text&#39; name=&#39;widget-{$widget->id_base}[{$widget->number}][classes]&#39; id=&#39;widget-{$widget->id_base}-{$widget->number}-classes&#39; class=&#39;widefat&#39; value=&#39;{$instance[&#39;classes&#39;]}&#39;/>\n";
$row .= "</p>\n";
echo $row;
return $instance;
}
add_filter(&#39;widget_form_callback&#39;, &#39;zm_widget_form_extend&#39;, 10, 2);
 
function zm_widget_update( $instance, $new_instance ) {
$instance[&#39;classes&#39;] = $new_instance[&#39;classes&#39;];
return $instance;
}
add_filter( &#39;widget_update_callback&#39;, &#39;zm_widget_update&#39;, 10, 2 );
 
function zm_dynamic_sidebar_params( $params ) {
global $wp_registered_widgets;
$widget_id    = $params[0][&#39;widget_id&#39;];
$widget_obj    = $wp_registered_widgets[$widget_id];
$widget_opt    = get_option($widget_obj[&#39;callback&#39;][0]->option_name);
$widget_num    = $widget_obj[&#39;params&#39;][0][&#39;number&#39;];
 
if ( isset($widget_opt[$widget_num][&#39;classes&#39;]) && !empty($widget_opt[$widget_num][&#39;classes&#39;]) )
$params[0][&#39;before_widget&#39;] = preg_replace( &#39;/class="/&#39;, "class=\"{$widget_opt[$widget_num][&#39;classes&#39;]} ", $params[0][&#39;before_widget&#39;], 1 );
return $params;
}
add_filter( &#39;dynamic_sidebar_params&#39;, &#39;zm_dynamic_sidebar_params&#39; );

?? 2

ID ?? ? CSS ??? ???? ??

function zm_widget_form_extend( $instance, $widget ) {
if ( !isset( $instance['classes'] ) )
$instance['classes'] = null;
 
if ( !isset( $instance['custom_id'] ) )
$instance['custom_id'] = null;
 
$class_prefix = 'widget-'; 
$myclass = array(
'default'  => '默認(rèn)',
'blue'     => '藍(lán)色',
'yellow'   => '黃色',
'black'    => '黑色',
);
 
$row = "<p>\n";
$row .= "\t<label for=&#39;widget-{$widget->id_base}-{$widget->number}-custom_id&#39;>添加ID</label>\n";
$row .= "\t<input type=&#39;text&#39; name=&#39;widget-{$widget->id_base}[{$widget->number}][custom_id]&#39; id=&#39;widget-{$widget->id_base}-{$widget->number}-custom_id&#39; class=&#39;widefat&#39; value=&#39;{$instance[&#39;custom_id&#39;]}&#39; />\n";
$row .= "\t<label for=&#39;widget-{$widget->id_base}-{$widget->number}-classes&#39;>CSS類</label>\n";
$row .= "\t<select name=&#39;widget-{$widget->id_base}[{$widget->number}][classes]&#39; id=&#39;widget-{$widget->id_base}-{$widget->number}-classes&#39; class=&#39;widefat&#39;>";
foreach( $myclass as $key => $class ) {
$selected = null;
if( $class_prefix.$key == $instance[&#39;classes&#39;] ) $selected = &#39;selected = "selected"&#39;;
$row .= "\t<option value=&#39;$class_prefix$key&#39; $selected>$class</value>\n";
}
$row .= "</select>\n";
echo $row;
return $instance;
}
add_filter(&#39;widget_form_callback&#39;, &#39;zm_widget_form_extend&#39;, 10, 2);
 
function zm_widget_update( $instance, $new_instance ) {
$instance[&#39;classes&#39;] = $new_instance[&#39;classes&#39;];
$instance[&#39;custom_id&#39;] = $new_instance[&#39;custom_id&#39;];
return $instance;
}
add_filter( &#39;widget_update_callback&#39;, &#39;zm_widget_update&#39;, 10, 2 );
 
function zm_dynamic_sidebar_params( $params ) {
global $wp_registered_widgets;
$widget_id  = $params[0][&#39;widget_id&#39;];
$widget_obj = $wp_registered_widgets[$widget_id];
$widget_opt = get_option($widget_obj[&#39;callback&#39;][0]->option_name);
$widget_num = $widget_obj[&#39;params&#39;][0][&#39;number&#39;];
 
if ( isset( $widget_opt[$widget_num][&#39;classes&#39;] ) && !empty( $widget_opt[$widget_num][&#39;classes&#39;] ) )
$params[0][&#39;before_widget&#39;] = preg_replace( &#39;/class="/&#39;, "class=\"{$widget_opt[$widget_num][&#39;classes&#39;]} ", $params[0][&#39;before_widget&#39;], 1 );
if ( isset($widget_opt[$widget_num][&#39;custom_id&#39;]) && !empty($widget_opt[$widget_num][&#39;custom_id&#39;]) )
$params[0][&#39;before_widget&#39;] = preg_replace( &#39;/id=".*?"/&#39;, "id=\"{$widget_opt[$widget_num][&#39;custom_id&#39;]}\"", $params[0][&#39;before_widget&#39;], 1 );
return $params;
}
add_filter( &#39;dynamic_sidebar_params&#39;, &#39;zm_dynamic_sidebar_params&#39; );

CSS ??? ??? ??? ?? ???? ?? ???? ? ??? ? ????.

??: ??? ??? ?? ?? ?? ?? ????? ??? ?????.

? ??? WordPress ??? CSS ??? ??? ???? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!