web-dev-qa-db-ja.com

Twitterのようにもっと多くの投稿を作成するにはどうすればいいですか?

こんにちは、最後の日私はその方法を見つけようとしていました。読んだ通り http://net.tutsplus.com/tutorials/javascript-ajax/create-a-Twitter-like-load-more-widget/ しかし、ワードプレスの中。そして、私はようやく解決策を思いついたのですが、最善の解決策ではないかもしれませんが、皆さんが私のコードを改良して、ここに投稿できることを願います。あなたが望むところならどこでもそれを自由に使ってください。 (私のコーディングスキルはとても悪い

最初にあなたのヘッダにjqueryを含める必要があります。

投稿を表示したいページにこのコードを挿入します。

<?php
session_start();
$number_of_posts = 3;
if (!$_SESSION['posts_start']) { $_SESSION['posts_start'] = 0; }
$_SESSION['posts_start'] = $_SESSION['posts_start'] ? $_SESSION['posts_start'] : $number_of_posts;
$total_posts = wp_count_posts('post');
$total_posts = $total_posts->publish;
?>
<script type="text/javascript">
    jQuery(document).ready(function(){
        var initialPosts = <?php echo my_get_posts(0, 5); ?>;
        var postHandler = function(postsJSON) {     
            jQuery.each(postsJSON,function(i,post) {
                // Salva as variáveis de cada post
                var postURL = post.permalink;
                var postCOMMENTS = post.comments;
                var postTITLE = post.title;
                var postDATE = post.date;
                var postAUTHOR = post.author;

                // Coloca as variáveis na lista                 
                jQuery(".lista-artigos")
                .append("<li><span class=\"comentarios-artigo\">" + postCOMMENTS + "</span><h2><a href=\"" + postURL +"\">" + postTITLE + "</a></h2><span class=\"data-artigo\">Postado em " + postDATE +  " por " + postAUTHOR + "</span></li>")
            }); 
        };

        postHandler(initialPosts);
        var totalposts = <?php echo $total_posts; ?>;
        var start = <?php echo $_SESSION['posts_start']; ?>;
        var desiredPosts = <?php echo $number_of_posts; ?>;
        jQuery('#load-more').click(function(){
            jQuery('#load-more').removeClass('carregar').addClass('ativado').text('Loading...');
            jQuery.ajax({
                url: 'http://yoursite/wp-content/themes/yourtheme/mais-posts.php',
                data: {
                    'start': start,
                    'desiredPosts': desiredPosts
                },
                type: 'get',
                dataType: 'json',
                cache: false,
                success: function(responseJSON) {
                    jQuery('#load-more').text('Load More');
                    start += desiredPosts;
                    postHandler(responseJSON);
                },
                error: function() {
                    jQuery('#load-more').text('Ops! Try Again.');
                },
                complete: function() {
                    jQuery('#load-more').removeClass('ativado').addClass('carregar');
                    if (totalposts <= start) { jQuery('#load-more').hide(); }
                }
            });
        });
    });
</script>

次のコードを使用して、テーマフォルダ(私の名前はmais-posts.php)内にphpファイルを作成します。

<?php
    require( '../../../wp-load.php' );

    if(isset($_GET['start'])) {
        echo my_get_posts($_GET['start'], $_GET['desiredPosts']);
        $_SESSION['posts_start'] += $_GET['desiredPosts'];
        exit();
    }
?>

このようなことを探している人に役立つことを願っています。

あなたはこのコードに何か提案があるのであれば、以下に投稿してください。

1
Vitor Argos

まず第一に、プラグインの中の AJAX を見てください。 WordPressにはAjaxリクエストを処理するための独自のメカニズムがあり、wp-load.phpを含めてそれを使用する必要があります。

3
Rarst