【问题标题】:wordpress page title above main content主要内容上方的wordpress页面标题
【发布时间】:2018-10-01 14:16:33
【问题描述】:

我在弄清楚如何在所有主要内容(包括侧边栏)上方显示我的 wordpress 页面标题时遇到问题。换句话说,直接在标题之后。全宽页面很好,但在具有左对齐侧边栏的页面上,页面标题位于侧边栏内容的右侧和主要内容部分上方,而不是在页面的最顶部,直接在左对齐上方侧边栏内容。我正在使用 JointsWP 主题并查看了 loop-page.php 似乎页面标题在条目内容上方被调用:

<article id="post-<?php the_ID(); ?>" <?php post_class(''); ?> role="article"     itemscope itemtype="http://schema.org/WebPage">

<header class="article-header">
<h1 class="page-title"><?php the_title(); ?></h1>
</header> <!-- end article header -->

<section class="entry-content" itemprop="articleBody">
    <?php the_content(); ?>
</section> <!-- end article section -->

<footer class="article-footer">
     <?php wp_link_pages(); ?>
</footer> <!-- end article footer -->

<?php comments_template(); ?>

</article> 

如果我从 loop-page.php 中删除文章标题部分,并在 get_header() 关闭后将其直接插入 page.php;标记然后我得到所需的结果,但我认为这不是处理它的正确方法。对不起,如果这是一个非常基本的问题,但我已经在网上搜索并且无法找到答案。

【问题讨论】:

    标签: wordpress


    【解决方案1】:

    每个项目出现在页面上的位置是您的主题和应用于页面的 CSS 的产物。您在上面粘贴的代码不包括用于生成侧边栏的代码。通常侧边栏由文件“header.php”调用。例如,这里是生成侧边栏的通用主题“二十十五”的代码(就在 header.php 文件的末尾):

    </header><!-- .site-header -->
    <?php get_sidebar(); ?> </div><!-- .sidebar -->
    

    您可以纯粹使用 CSS 来解决这个问题,但我建议在标题之前添加标题 - 这样会更容易一些。在上面的例子中,尝试如下编辑 header.php:

    </header><!-- .site-header -->
    
    <div id="the_title">
         <h1 class="page-title">
            <?php the_title(); ?>
         </h1>
    </div>
    
    <?php get_sidebar(); ?> </div><!-- .sidebar -->
    

    根据您使用的格式,将标题放在共享主页内容类的 div 中可能会有所帮助,如下所示。

    </header><!-- .site-header -->
       <div id="content" class="site-content">
          <div id="the_title">
             <h1 class="page-title"><?php the_title(); ?></h1>
          </div>
       </div>
    <?php get_sidebar(); ?> </div><!-- .sidebar -->
    

    然后将 CSS 格式添加到 id="the_title" 以确保它按您希望的方式显示。对于 CSS 编辑,您可能需要在 style.css 文件中添加如下内容:

    #the_title {
       width:100%;
       margins: 40px;
    }
    

    【讨论】:

    • 非常感谢 PJ 的建议。会试试这个,看看我会怎么做。
    猜你喜欢
    • 2014-10-17
    • 1970-01-01
    • 2014-11-02
    • 2020-07-15
    • 1970-01-01
    • 2013-04-06
    • 2018-01-09
    • 1970-01-01
    • 2020-12-31
    相关资源
    最近更新 更多