Wordpress Plugin "unendlich scroll" (jQuery) Hack Hilfe

Question

Ich versuche, meine Wordpress-Blog (entfernt) arbeiten mit dem Plugin "Infinite Scroll" in einer Weise, dass Sie auf "mehr Beiträge" klicken müssen, um mehr zu laden durch Scrollen nahe am unteren Rand der Seite (das ist der Standard des Plugins).

Es gibt Anweisungen und ein Demo auf, wie es geht hier: http://www.infinite-scroll.com/

Blättern Sie zum "Custom Trigger, nicht automatisch Twitter-Stil.".

Ich verstehe einfach nicht, wie man es mit meinem Thema (zehnundzwanzig) arbeiten lassen. Ich habe wahrscheinlich nicht die richtigen Selektoren.

Kann mir jemand eine kurze Zusammenfassung dessen geben, was ich tun muss, um das durchzuziehen?

Answer 1

Zuerst müssen Sie herausfinden, wo die <div class="entry-content"> ist. Dies ist in Ihrem Ordner wp-content/themes/[themename], in einer Datei namens index.php oder loop.php. nach dem Schließen </div> der Entry-Level-Inhalte hinzufügen:

<div class="moreposts" style="display:none" 
onclick="$('div.moreposts').slideUp();$(document).trigger('retrieve.infscr');"> 
    Show more 
</div> 

<script> 
$(document).ajaxError(function(e,xhr,opt){ 
    if (xhr.status == 404) $('div.moreposts').slideUp("normal", function() { $(this).remove(); }); 
}); 
</script> 

, nun in dem unendlichen Scroll-config (Wordpress Admin -> Einstellungen -> endlose Rolle), fügen Sie diese in die „Javascript nach dem nächsten heißen

$(window).unbind('.infscr'); 
setTimeout("$('div.moreposts').slideDown();", 1000); 

Stil schließlich den Knopf, um es hübsch aussehen (zu style.css hinzufügen): Beiträge werden als „Box geholt

.moreposts { 
    display:block; 
    border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; 
    border: 1px solid #ddd; 
    background: #efefef; 
    text-align: center; 
    font-weight: bold; 
    box-shadow: 2px 2px 2px rgba(50,50,50,0.4); color: #444; 
    text-decoration: none; 
    padding: 5px; 
    margin-bottom: 20px; 
    cursor: pointer; 
} 
.moreposts:hover { 
    background: #dfdfdf; 
    color: #222; 
} 

Beachten sie, dass dies die erste Post Last autom tun atic, und die nachfolgenden manual. Dies ist erforderlich, damit das Skript die Schaltflächen Vor/Weiter automatisch ausblenden kann.

Answer 2

Da Sie Wordpress verwenden, sollten Sie die Jetpack plugin installieren und aktivieren Sie die Infinite-Bildlaufoption. Es gibt Konfigurationsbeispiele für die Themen Twenty Ten, Eleven und Twelve. Ich denke, du wirst es leichter finden, als selbst zu versuchen, endlos zu scrollen.