Question

我正在尝试为我女朋友的烹饪和烘焙博客制作一个自定义主题。我想这样做，以便在点击博客帖子缩略图链接时没有页面刷新。相反，我希望将博客文章内容动态加载ajax到home.php中id =“main-content”的文章中，我还想为各个帖子启用深层链接。以下是该网站的外观（尚未完成）：http://natalija.co.nf/ 每个类别都有一个滑块，其中将显示3个指向帖子的缩略图链接，并且包含帖子应加载的文章的部分将显示在页面底部，就在页脚之前。这是我的home.php和single.php页面的代码：

home.php

<?php get_header(); ?>
<?php
$args = array(
    'orderby' => 'id',
    'order' => 'ASC',
    'hide_empty' => '0',
    'exclude' => '1'
);
$categories = get_categories($args);
foreach($categories as $category) {
    ?>

    <section id="<?php echo $category->slug; ?>" data-stellar-background-ratio="0.5">
        <article class="<?php echo $category->slug; ?>" data-stellar-ratio="1.5">
            <h1><?php echo $category->name; ?></h1>
            <div class="wrapper">
                <ul class="slider">

                <?php
                    $args = array (
                        'post_status' => 'publish',
                        'category_name' => $category->slug,
                        'nopaging' => true,
                    );
                    $custom_query = new WP_Query( $args );

                    if ( $custom_query->have_posts() ) {
                        while ( $custom_query->have_posts() ) {
                            $custom_query->the_post();

                                // begin your slider loops in here
                                ?>

                                    <li class="slide">
                                        <a href="<?php echo get_permalink(); ?>">
                                            <?php the_post_thumbnail(); ?>
                                            <div class="bubble">
                                                <h5><?php echo get_the_title(); ?></h5>
                                            </div>
                                        </a>
                                    </li>

                    <?php } // end $custom_query loop

                    } else {
                        // no posts found
                    }

                    // reset the postdata
                    wp_reset_postdata();
                ?>

                </ul>
                <img class="previous" src="wp-content/themes/Natalija/images/arrow-transparent.png" alt="random" data-stellar-ratio="1.7">
                <img class="next" src="wp-content/themes/Natalija/images/arrow-transparent.png" alt="random" data-stellar-ratio="1.7">
            </div>
        </article>
    </section>
<?php
} // end $categories loop
?>
<section>
            <article id="main-content">

            </article>
        </section>
<?php get_footer(); ?>

single.php中

    <div class="post-wrap">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

        <h1><?php the_title(); ?></h1>

        <?php include (TEMPLATEPATH . '/inc/meta.php' ); ?>

        <div class="entry">

            <?php the_content(); ?>

            <?php wp_link_pages(array('before' => 'Pages: ', 'next_or_number' => 'number')); ?>

            <?php the_tags( 'Tags: ', ', ', ''); ?>

        </div>

        <?php edit_post_link('Edit this entry','','.'); ?>

    </div>

<?php comments_template(); ?>

<?php endwhile; endif; ?>
</div>

我尝试了一些关于ajax的在线教程，但我无法将其拉下来。任何人都可以帮我解决这个问题吗？

AJAXing一个WordPress自定义主题

0 个答案: