jAjax를 통해 Wordpress 페이지 로드 쿼리

jAjax를 통해 Wordpress 페이지 로드 쿼리

AJAX에서 (투고가 아닌) 페이지를 로드하는 Wordpress 테마를 설정하려고 합니다.이 가이드를 따르고 있었지만 올바른 페이지를 로드할 수 없었습니다.

포스트 슬러그로 포스트 링크가 생성되고 있습니다.

http://local.example.com/slug/

그래서 적응을 했어요.

 jQuery(document).ready(function($){
        $.ajaxSetup({cache:false});
        $("a.bar").click(function(e){
            $('page-loader').show();
            var that = $(this).parent();

            $('.column').not($(this).parent()).animate({width: 'toggle',opacity:'0.75'}, 700, function() {

            });

            var post_id = $(this).attr("href");
            $("#page-container").load("http://<?php echo $_SERVER[HTTP_HOST]; ?>" + post_id,{id:post_id});

            return false;
        });
    });

URL은 맞는데 아무것도 로드되지 않습니다.

---

<?php
/*
Template Name: Triqui Ajax Post
*/
?>
<?php
$post = get_post($_POST['id']);
?>
<?php if ($post) : ?>
    <?php setup_postdata($post); ?>
    <div <?php post_class() ?> id="post-<?php the_ID(); ?>">
        <h2><?php the_title(); ?></h2>
        <small><?php the_time('F jS, Y') ?> <!-- by <?php the_author() ?> --></small>

        <div class="entry">
            <?php the_content('Read the rest of this entry &raquo;'); ?>
        </div>

    </div>
<?php endif; ?>

그래서 저는 앞서 말씀드린 튜토리얼에 따라 작업을 할 수 있었습니다만, 튜토리얼이 조금 불명확하게 쓰여져 있는 것 같습니다.

순서 1

다음과 같은 코멘트 헤더를 가진 PHP 파일을 루트 디렉터리에 생성하여 수행하는 커스텀 페이지 템플릿을 만듭니다.

<?php
/*
Template Name: Ajax
*/
?>

의미론을 위해 Ajax라는 제목을 붙였지만, 이 튜토리얼에서는 원저자가 'Triqui Ajax'라는 제목을 붙였습니다.작성한 PHP 파일의 이름은 나중에 4단계에서 다시 사용할 수 있으므로 기록해 두십시오.

순서 2

이 작업이 완료되면 아래에 주석이 달린 행을 추가하는 것을 제외하고 커스텀 페이지 템플릿을 계속 코딩할 수 있습니다(2~5행).

<?php
    $post = get_post($_POST['id']); // this line is used to define the {id:post_id} which you will see in another snippet further down

    if ($post) { // this is necessary and is a replacement of the typical `if (have_posts())`
        setup_postdata($post); // needed to format custom query results for template tags ?>
        <!-- everything below this line is your typical page template coding -->
        <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

            <h2><?php the_title(); ?></h2>
            <small><?php the_time('F jS, Y') ?></small>
            <span><?php the_author() ?></span>

            <div class="entry">
                <?php the_content(); ?>
            </div>

        </div>

<?php }

순서 3

커스텀 페이지 템플릿을 작성하면 wp-admin에 로그인하고 먼저 다음 페이지로 이동합니다.Settings -> Permalinks로 설정합니다.Day and Name또는Custom Structure구조는 다음과 같습니다.

/%year%/%monthnum%/%day%/%postname%/

에서 수동으로 쓸지 여부Custom Structure또는 선택Day Name위의 토막과 같아야 합니다.

순서 4

이제 새 페이지를 만듭니다. Pages ->새로 추가' 및 새 페이지를 만듭니다.원하는 이름을 붙이되, 1단계에서 작성한 페이지 템플릿의 이름과 동일한 이름을 붙이는 것이 좋습니다.

빈 페이지로 저장합니다.이것이 중요한 부분입니다.페이지의 permalink가 순서 1에서 작성한 파일과 같은 이름을 가지는 것을 확인할 필요가 있습니다.유일한 차이점은 모두 소문자로 표시되어야 한다는 것입니다.

순서 5

페이지를 저장하기 전에 선택 메뉴에서 페이지 템플릿을 선택해야 합니다.이 메뉴가 표시되지 않는 경우는 템플릿파일을 올바르게 작성하지 않았거나 루트 디렉토리에 작성하지 않았거나 코멘트헤더를 올바르게 작성하지 않았을 가능성이 있습니다.기본적으로 사용자 정의 페이지 템플릿이 작성되지 않은 경우 메뉴는 표시되지 않으며 테마의 루트 디렉토리에 저장된 사용자 정의 페이지 템플릿이 적절한지 여부만 표시됩니다.

검토

이제 PHP 파일이 있어야 합니다.그리고 WP-admin의 페이지.페이지에는 PHP 파일의 파일 이름(모두 소문자)과 일치하는 permalink URL이 있어야 하며 페이지에는 해당 파일의 페이지 템플릿이 할당되어야 합니다.

이 페이지는 비워 두어야 하며 절대 사용하지 않아야 합니다.

순서 6

»header.php 바로 에 있습니다.<?php wp_head() ?>하다

<script>

    jQuery(document).ready(function($){
        $.ajaxSetup({cache:false});
        $("THELINK").click(function(e){ // line 5
            pageurl = $(this).attr('href');
            if(pageurl!=window.location) {
                window.history.pushState({path: pageurl}, '', pageurl);
            }

            var post_id = $(this).attr("rel")
            $("#TARGET").load("http://<?php echo $_SERVER[HTTP_HOST]; ?>/ajax/",{id:post_id}); // line 12
            return false;
        });
    });
</script>

를 THELINK'THELINK'를 .<?php the_permalink ?>

변경할 필요가 있는 회선은 5행과 12행뿐입니다. 있는 에 주의해 .ajax5.1에서 입니다.

그 에서도, 12행으로 갈아타야 .TARGET콘텐츠를 로드해야 하는 요소로 이동합니다.

이 스크립트 전에 jQuery를 올바르게 로드했는지 확인하십시오.

순서 7

으로 '하다'로 넘어가겠습니다.index.php파일 또는 루프가 있는 파일 중 하나를 선택합니다.를 있는 .the_permalink Attribute를 사용하여 Attribute를 추가해야 .the_ID()은 which which에 which which which which which which which which which which which which 。{id:post_id}: 6의 12행:

<a href="<?php the_permalink(); ?>" class="bar" rel="<?php the_ID(); ?>" title="<?php the_title(); ?>">

다 했어요.

바로 그겁니다.이제 작동해야 합니다.페이지에는 AJAX가 로드되어 브라우저의 URL도 일치하도록 변경됩니다.

이제 원하는 만큼의 페이지를 만들고, 다른 커스텀 페이지 템플릿을 만들고, 원하는 대로 할당할 수 있습니다.스텝 5에서 작성한 파일을 빈 페이지로 계속 유지합니다.

그래도 효과가 없다면, 당신은 아마 절망적으로 길을 잃고 무엇을 하고 있는지 모를 것이다.jQuery 충돌이 발생했거나 jQuery를 제대로 로드하지 않았을 수 있습니다.

load posts to div using ajax 및 jQuery를 선택하거나 이 플러그인 Advanced AJAX Page Loader를 사용할 수 있습니다.

라고 하는 에러가 발생했습니다.

주의: 정의되지 않은 상수 HTTP_HOST 사용 - 'HTTP_' 가정/var/www/***/public_html/wp-content/temes/****/header의 HOST'입니다.php는 XX 행에 있습니다.

은은 around around quotes around around around around around around around에 작은 HTTP_HOST 개요:

$("#TARGET").load("http://<?php echo $_SERVER[HTTP_HOST]; ?>/ajax/",{id:post_id});

언급URL : https://stackoverflow.com/questions/26941256/jquery-load-wordpress-pages-via-ajax