Как получить контент с одной * страницы * поста? - PullRequest
2 голосов
/ 01 января 2012

Я пытаюсь сделать что-то вроде галереи, разделить пост на несколько страниц и разбить их на страницы с помощью jQuery. Кто-нибудь пробовал что-то подобное, не могли бы вы помочь с некоторыми рекомендациями по настройке?

Примерно так же и подобные галереи на сайтах: http://hitfix.com/galleries/most-anticipated-tv-premieres-and-returns-of-2012

Мне удалось сделать что-то похожее, но без jQuery, и я знаю, что пользователи раздражаются, когда сайт должен каждый раз перезагружаться для каждой страницы.

редактирование: Я добавлю следующий вопрос:

Какую функцию я могу использовать для извлечения содержимого одной страницы в сообщении? Допустим, я хочу разделить свой пост на 5 страниц - как я могу получить содержимое, скажем, страницы 3?

Ответы [ 2 ]

0 голосов
/ 31 марта 2012

Во вселенной WordPress у вас есть доступ ко всем WordPress ... но это вопрос того, что вы делаете, чтобы получить эту видимость. Ниже приведен фрагмент кода, который я использовал на домашней странице, чтобы получить 3 последних сообщения и отобразить их фрагменты. Если вы выходите за рамки WordPress, вам нужно найти способ включить некоторые файлы WordPress.

Я верю в то, что я предоставил, и некоторые поиски в Google могут помочь вам разобраться ... если $myposts имеет 3 почтовых массива в качестве участников, вы можете выбирать и выбирать.

<!-- language: php -->
<?  $myposts = get_posts('numberposts=3');
        foreach($myposts as $post) :
        setup_postdata($post);  ?>
<h2 id="page_title"><a class="noblock" href="<?php the_permalink() ?>" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
<p class="ccw_light location"><small><?php the_time('l, F jS, Y') ?></small></p>
                        <br style="line-height:5px">
                        <div class="content_text" id="noblock">
                                <?php the_content('... continues','','') ?>
                                        <span class="right"><small>Posted in <?php the_category(', ') ?> <strong>|</strong> <?php edit_post_link('Edit','','<strong> |</strong>'); ?></small>
                                        </span>
                                </div>
                        </div>
<br> <!-- <?php trackback_rdf(); ?> -->
<?php endforeach; ?>
0 голосов
/ 01 января 2012

Существуют всевозможные плагины slider / slideshow, которые вы можете использовать для этого, но если вы хотите сделать это самостоятельно, вы можете настроить панель навигации, например, сайт, на который вы ссылались, и при нажатии на одно из чисел. Вы можете сделать AJAX-вызов PHP-скрипта, который выводит нужную информацию:

HTML -

<ul id="navigation">
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li><a href="#">6</a></li>
</ul>
<div id="page"></div>

CSS -

#navigation li {
    display : inline-block;

    /*Fix display:inline-block in IE7*/
    *display : inline;
    zoom     : 1;
}

JQuery -

$(function () {

    //cache the `#page` element as it will be needed later
    var $page = $('#page');

    //bind a `click` event handler to all the `<li>` elements that are children of the `#navigation` ul element
    $('#navigation').children().on('click', function (event) {
        event.preventDefault();

        //you could display a loading animation/message here while the new content is being returned from the server

        //when making the AJAX call you need to send some data to identify the "page" to output, I used the `id` key and set it's value to the index of the `<li>` element clicked in respect to all the other `<li>`s
        $.get('path/to/server-side.php', { id : $(this).index() }, function (serverResponse) {

            //now set the `#page` element's HTML to the response from the server
            $page.html(serverResponse);

            //if you played a loading animation/message you can hide it now
        }
    });
});

Вот демонстрационная версия: http://jsfiddle.net/jGujw/ (обратите внимание, что я не смог проверить с помощью функции AJAX, поэтому я сохранил некоторые ответы сервера в массиве)

Также возможно разбить на страницы, захватывая одну и ту же страницу снова и снова в запросе AJAX и анализируя serverReponse, чтобы добавить только нужные элементы в DOM.

Обратите внимание, что .on() является новым в jQuery 1.7 и совпадает с .bind(), если вы используете более старую версию.

...