在wordpress中更改窗口小部件宽度的大小

时间:2013-09-18 14:37:36

标签: css wordpress

我想在我的主页上有两个小部件彼此相邻。但是我希望第一个小部件为650像素,而另一个小部件为290像素。这是我无法做到的。有人可以帮帮我吗?

我在我的主题functions.php文件中为我的小部件注册的代码:

   register_sidebar(array(
    'name' => 'Slider 1',
    'before_widget' => '<div id="%1$s" class="widget-area1 %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3>',
    'after_title' => '</h3>',
));

register_sidebar(array(
    'name' => 'Side Column',
    'before_widget' => '<div id="%1$s" class="widget-area2 %2$s">',
    'after_widget' => '</div>',
    'before_title' => '<h3>',
    'after_title' => '</h3>',
));

然后我放入我的主页模板文件:

<?php 
/**
 * Template Name: Home Page
 */
get_header();
include('_functions/get-options.php');
?>

<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') ||!dynamic_sidebar('Homepage')); ?>
**<div class="widget-area1">
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Slider 1')); ?>
</div>
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Side Column')); ?>**

<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Homepage 1')); ?>
<?php /* Widgetised Area */ if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('Homepage 2')); ?>

<div class="clear"></div>

<?php get_footer(); ?>

我在样式表中放置了css样式:

div.widget-area1 {
clear: both;
margin: 0 auto;
width: 650px;
}

div.widget-area3 {
clear: both;
margin: 0 auto;
width: 290px;
}

你能否告诉我我做错了什么?我正在使用的主题是比较,如果这可能会有所帮助。

1 个答案:

答案 0 :(得分:1)

问题中的样式就像它们应该有效一样,但这是我在样式表中看到的

#widget-area1 {
  clear: both;
  margin: 0 auto;
  width: 650px;
}

#widget-area2 {
  clear: both;
  margin: 0 auto;
  width: 290px;
}

这些规则是指ID而不是您在问题中定义的类。

此外,如果您希望它们并排放置,您可能需要删除clear:both