![](/img/trans.png)
[英]MediaWiki with BlueSpice is not showing content after sidebar adjustment
[英]Sidebar showing below content
我仍在制作我的第一个自适应WordPress主题。 使用index.php时遇到了更多麻烦。 由于某种原因,侧栏显示在博客文章的下方。 在单个帖子页面上,它可以正确显示,但我似乎无法查明是什么导致侧边栏被压低。
这是index.php页面http://mockup.artxwpn.com/lifestyle和我拥有的代码:
<?php get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="row">
<div class="eight columns" id="content">
<div class="post-title"><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(''); ?></a></div>
<div class="meta">
<div style="float: left;">Written by: <?php the_author() ?> •
<?php the_time(get_option('date_format')); ?></div>
<div style="float: right;">
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>" title="Share this on Facebook!"><img src="<?php bloginfo('template_directory'); ?>/images/facebook.png" alt="Share this on Facebook!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="http://twitter.com/home/?status=<?php the_title(); ?> - <?php the_permalink(); ?>" title="Tweet this!"><img src="<?php bloginfo('template_directory'); ?>/images/twitter.png" alt="Tweet this!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="http://pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>&media=<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); echo $url; ?>"><img src="<?php bloginfo('template_directory'); ?>/images/pinterest.png" alt="Pin this!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" onclick="javascript:window.open(this.href,
'', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><img src="<?php bloginfo('template_directory'); ?>/images/google_plus.png" alt="Share this on Google Plus!" style="width: 16px; height: 16px;" /></div></a>
</div>
<?php if ( has_post_thumbnail()) : ?>
<center><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
<?php the_post_thumbnail(); ?>
</a></center>
<?php endif; ?>
<br />
<?php the_excerpt(); ?>
</div>
<?php endwhile; ?>
<div class="eight columns" id="content">
<center>
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
else { ?>
<div class="right"><?php next_posts_link('Next Page »') ?></div>
<div class="left"><?php previous_posts_link('« Previous Page') ?></div>
<?php } ?>
</center>
</div>
<?php else : ?>
<div class="post-title">Not Found</div>
This page doesn't exist.
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
问题出在您的HTML:
正确的代码应如下所示:
<?php get_header(); ?> <div class="row"> <main class="eight columns" id="content"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> //* code of your posts <?php endwhile; ?> <div> <center> <?php if(function_exists( 'wp_pagenavi')) { wp_pagenavi(); } else { ?> <div class="right"> <?php next_posts_link( 'Next Page »') ?> </div> <div class="left"> <?php previous_posts_link( '« Previous Page') ?> </div> <?php } ?> </center> </div> <?php else : ?> <div class="post-title">Not Found</div> This page doesn't exist. <?php endif; ?> </main> <?php get_sidebar(); ?> </div> <?php get_footer(); ?>
您有未关闭的div。 尝试这个:
<?php get_header(); ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="row">
<div class="eight columns" id="content">
<div class="post-title"><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(''); ?></a></div>
<div class="meta">
<div style="float: left;">Written by: <?php the_author() ?> • <?php the_time(get_option('date_format')); ?></div>
<div style="float: right;">
<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink();?>&t=<?php the_title(); ?>" title="Share this on Facebook!"><img src="<?php bloginfo('template_directory'); ?>/images/facebook.png" alt="Share this on Facebook!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="http://twitter.com/home/?status=<?php the_title(); ?> - <?php the_permalink(); ?>" title="Tweet this!"><img src="<?php bloginfo('template_directory'); ?>/images/twitter.png" alt="Tweet this!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="http://pinterest.com/pin/create/button/?url=<?php the_permalink(); ?>&media=<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); echo $url; ?>"><img src="<?php bloginfo('template_directory'); ?>/images/pinterest.png" alt="Pin this!" style="padding-right: 20px; width: 16px; height: 16px;" /></a>
<a href="https://plus.google.com/share?url=<?php the_permalink(); ?>" onclick="javascript:window.open(this.href,'','menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><img src="<?php bloginfo('template_directory'); ?>/images/google_plus.png" alt="Share this on Google Plus!" style="width: 16px; height: 16px;" /></a>
</div>
</div>
<?php if ( has_post_thumbnail()) : ?>
<center><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail(); ?>
</a></center>
<?php endif; ?>
<br />
<?php the_excerpt(); ?>
</div>
<?php endwhile; ?>
<div class="eight columns" id="content">
<center>
<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
else { ?>
<div class="right"><?php next_posts_link('Next Page »') ?></div>
<div class="left"><?php previous_posts_link('« Previous Page') ?></div>
<?php } ?>
</center>
</div>
<?php else : ?>
<div class="post-title">Not Found</div>
This page doesn't exist.
</div>
<?php endif; ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
并尝试更好地构造代码。
他们可能没有在while循环中关闭<div class="row">
的事实,从而产生了问题。 也许这是解决方案。 并提供信息:不要对更多HTML标记使用相同的id属性(您使用多个id="content"
)-这是非法的,因为id属性必须仅用于页面上的一个标记,对于多个元素则使用class属性
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.