我一直在开发一个简单的WordPress插件,它显示一条关于在网站上使用cookies的简单消息。
它已部署在我公司的各种WordPress网站和HTML网站上。但是,插件的显示方式存在很大差异。
这是消息在主WordPress站点上的显示方式。这也是它在HTML网站上运行时的外观
但是,在另一个WordPress网站上,它看起来像是这样:
图像被压扁到网站上,它占据了网站的左侧。
两个WordPress网站都使用相同版本的WordPress(3.3.1),并且它们在各种浏览器(IE,Chrome,Firefox)中的显示方式没有变化。
为什么同一个插件在相同版本的WordPress中的显示方式如此不同?
的style.css
.popup-box {
position: fixed;
left:50%;
margin-right: auto;
border-radius: 3px;
padding:10px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 5);
z-index:10000;
}
.popup-box .popup-inner {
float:left;
}
Popup.php - 根据管理员选择设置属性。
<style type="text/css">
.popup-box {
width:<?php if(get_option('width') != ''){ echo get_option('width');}else{ echo '200';}?>px;
background-colour:<?php if(get_option('bgcolour') != ''){ echo get_option('bgcolour');}else{ echo '#000000';} ?>;
color:<?php if(get_option('fontcolour') != ''){ echo get_option('fontcolour');}else{ echo '#FFFFFF';} ?>;
font-size:<?php if(get_option('fontsize') != ''){ echo get_option('fontsize'); } else{ echo '13px';} ?>px;
margin-left:<?php if (get_option('width') !=''){echo 0 - (get_option('width')/2);} else {echo '-100';}?>px;
<?php if(get_option('position') != ''){ echo get_option('position');}else{ echo 'bottom';} ?>:0px;
}
.popup-box .popup-inner {
width:<?php echo get_option('width'); ?>px;
line-height:<?php echo (get_option(fontsize')+ 6); ?>px;
}
</style>
Popup.php - 显示弹出窗口
if(get_option('display') == 'yes'){
?>
<body onload="check()">
<div class="popup-box" id="x">
<div class="sticky-inner"><?php echo stripslashes(get_option('popup_message')); ?></div>
<input id="btnAgree" type="button" value ="I agree" onclick="save()"/>
<input id="btnDisagree" type="button" value ="I disagree" onclick="hide()"/>
</div>
答案 0 :(得分:1)
您可能在插件未按要求呈现的网站上存在冲突的CSS规则或JavaScript错误。使用Firebug并检查控制台/样式面板是否有错误。