单页 WP 主题

Question

所以我正在构建一个 WP One Page 主题，我希望每个页面都显示在我的静态首页上。我希望用户能够在仪表板中添加/编辑页面内容而不是标记。当我查看页面模板时，the_content() 工作正常，但是当我在静态首页上需要页面模板时，其他所有内容都正常显示，但 the_content() 为空白。有任何想法吗？？谢谢！

work.php 文件

//  Work Template Page -- the_content() works perfectly 


<!-- works -->
<section id="works">

    <!-- container -->
    <div class="container">
        <!-- row -->
        <div class="row">

            <!-- head -->
            <div class="head big wow bounceIn">
                <h3>Our
                    <span class="blue">Works</span>
                </h3>
                <div class="head-break-line">
                    <span class="head-line-blue"></span>
                </div>

                <?php if ( have_posts() ) : while( have_posts() ) : the_post(); ?>
                <h6 class="subtext"><?php the_content(); ?></h6>
                <?php endwhile; endif; ?>

            </div>

front-page.php 文件

//  Static Front-Page  --  every thing works, but the_content() is blank on this page

<?php require('work.php'); ?> 

Answer 1

您是该页面的requiring，但您已经关闭了向您提供帖子的循环。看这里->

<?php endwhile; endif; ?>

然后你执行

<?php require('work.php'); ?> 

这永远不会奏效。您需要通过执行以下操作再次执行循环：

<?php if ( have_posts() ) : while( have_posts() ) : the_post(); ?>

在您的 work.php 文件中。

Answer 2

我已经这样做了。我的解决方案使用了一个名为“Long Page”的专用页面模板。默认情况下，该页面是空的，但我有一组“内容模板”，可以附加到页面上。

所以这是条件：在“长页面”上，我循环浏览所有子页面。如果子页面使用“内容模板”，则会显示它。

那是我的长页：

<?php 
/**
 * Template Name: Long Page
 */

define("IN_LONG_PAGE", true);
$_longpage_elements = array();

get_header(); 
?>

<div class="long_page_wrapper">
    <?php
    // Build the query for child pages
    $args = array(
        'post_parent'   => get_the_ID(),
        'post_type'     => 'page',
        'orderby'       => 'menu_order',
        'order'         => 'ASC',
    );
    $query = new WP_Query( $args );
    if($query->have_posts()): while ( $query->have_posts() ) : $query->the_post();
        // Let's see, if the child pages are actually content pages


        $page_template = get_post_meta($post->ID, "_wp_page_template", true);
        if(preg_match("#(content-templates/ct-)#i", $page_template)){
            $_longpage_elements[] = $post;
        }

    endwhile; endif;

    $query->rewind_posts();

    $num = 0;
    if($query->have_posts()): while ( $query->have_posts() ) : $query->the_post();
        // We will load the custom templates now


        if(in_array($post, $_longpage_elements)){
            $page_template = get_post_meta($post->ID, "_wp_page_template", true);
            $current_index = array_search($post, $_longpage_elements);
            include(trailingslashit(WP_THEME_PATH).$page_template); 
            $num++;
        }

    endwhile; endif;
    ?>
</div>

<?php
    get_footer();
?>

这是一个简单内容模板的示例。我有几个用于各种目的（手风琴、定价表、大图、联系表格等）

<?php
/**
 * Template Name: CT Text
 */

global $post, $current_index, $_longpage_elements; 

/*
 * Make sure this file never gets called alone.
 * If so, we redirect to the post parent/home page
 */
if(!defined("IN_LONG_PAGE")) {
    if($post->post_parent){
        $url = get_permalink($post->post_parent)."#".$post->post_name;
    } else {
        $url = get_bloginfo('url');
    }
    wp_redirect($url, 302);
}

$ct_settings = get_post_meta($post->ID, "_ct_settings", true);
if(!is_array($ct_settings)){
    $ct_settings = array();
}

$ct_style = array();
$background_image = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'post-thumbnail' );
if(is_array($background_image)){
    $ct_style[] = 'background-image: url('.$background_image[0].')';
} else {
    $ct_style[] = NULL;
}

$z_index = 100 - intval($current_index);
$ct_style[] = "z-index: ".$z_index;

$ct_style_print = 'style="'.implode("; ", $ct_style).'"';

$textbox_wrapper_class = array('span6', 'position-wrapper', 'the_content');

?>

<div <? post_class("ct-wrapper ct-text clearfix"); ?> id="<?=$post->post_name?>" <?=$ct_style_print?>>
    <div class="container">
        <div class="row">
            <div class="title span12">
                <?php the_title("<h2>", "</h2>"); ?>
            </div>
            <div class="<?=implode(' ', $textbox_wrapper_class)?>" <?=$textbox_wrapper_style_html?>>
                <?php the_content(); ?>
            </div>
        </div>
    </div>
</div>

里面有很多自定义的东西，所以它不应该作为复制/粘贴解决方案。但它应该显示这样一个页面布局是如何可能的一般概念。我见过的另一个解决方案是使用大量的简码。但我喜欢让我的内容井井有条并且易于编辑。

Answer 3

请耐心等待...我想出了一个简单的方法来制作一个 wp 单页主题。不确定这是否是最佳实践，但这是我想要的，而且非常容易理解。顺便说一句，我正在将一个 html 网站转换为一个主题...之前忘了提。

所以这里...我需要在首页上单独显示每个页面，而不是循环浏览每个页面。我这样做是为了可以将每个页面放在我想要的位置，并自定义我的导航菜单：

<?php require('services.php'); ?>
<?php require('work.php'); ?>
<?php require('pricing.php'); ?>
<?php require('team.php'); ?>
<?php require('blog-page.php'); ?>
<?php require('contact.php'); ?>

然后，在每个页面（services.php、work.php 等）中，我使用了 WP_Query：

<?php $your_query = new WP_Query( 'pagename=work' ); ?>
<?php while ( $your_query->have_posts() ) : $your_query->the_post(); ?>

  <?php 
     //  I place all of my static page content below this line
     //  This allows me to use the_title() and the_content() functions  ?>

     <!-- head -->
     <div class="head big wow bounceIn">
        <h3>Our
            <span class="blue"><?php the_title(); ?></span>
        </h3>
        <div class="head-break-line">
           <span class="head-line-blue"></span>
        </div>
           <h6 class="subtext"><?php the_content(); ?></h6>
      </div>
      <!-- .head -->

<?php 
    //  more static content here
?>

然后，如果有人最终以某种方式单独查看页面，我会重置 postdata 并添加一个条件语句来显示页脚：

<?php endwhile; 
  // reset post data (important!)
  wp_reset_postdata(); ?>

<?php
    if ( is_page( 'work' )  ) {    
        // the page is "work" then, 
        get_footer();
    } else { 
        // don't get footer            
    }   
?>   

通过我使用的这种方法，我现在有了一个 wp 单页主题，用户可以从管理屏幕更新他们的页面内容，而不会破坏页面的其余部分。