Скролл-загрузка в Tumblr теме
10 января 2014 Tumblr 12366 просмотров
Я использую словосочетание скролл-загрузка, хотя часто это называют “бесконечный скроллинг”. Что это такое? Это подгрузка следующей порции контента, когда скролл приближается к концу страницы (или другое условие). Главное - он нас избавляет от ненужных лишних кликов по кнопкам “Далее”. И я считаю это весомым плюсом. Хотя есть и минусы. Клиент становится более нагруженным. И в некоторых случаях придется пожертвовать футером, если скролл вертикальный, так как до него пользователь может никогда не добраться. Google использует такой подход в Картинках. Странно, почему он не сделал так в WEB-поиске. А в статье просто небольшой how-to, как это сделать в Tumblr.

На днях меня попросили сделать такую фичу в одном Tumblr-блоге. Для начала скажу, что не все темы поддерживают такой скроллинг. Лучше всего такой скролл будет работать в вертикальных схемах, где контент идет один за одним.

Нам нужно сделать всего 2 вещи. Все они делаются через изменение HTML темы во внутреннем редакторе Tumblr.

ВЕЩЬ 1. Скрипт
Добавить JS-скрипт в head:
<head>
…
<script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
...
</head>

ВЕЩЬ 2. Div
Обернуть посты в специальный div:
<div class = "autopagerize_page_element" >
{block:Posts } 
…
{/block:Posts}
</div>
Объяснять тут нечего. Вставили - работает.