Блоґ про WordPress

Використання Query Loader у WordPress + хаки

Ви, мабуть, стикалися із проблемою "неестетичного" завантаження сторінок вашого сайту/блоґу, на якому велика кількість графіки - контент підзавантажується частинами, стрибає, і потрібно перечекати певний час, щоб було комфортно читати інформацію. Особливо це актуально для сторінок з великою кількістю фотографій за умов повільного з'єднання з інтернетом.

Вирішити цю проблему стильно можна за допомогою Query Loader'а. Це скрипт, який завантажує контент з анімацією. Прев'ю: Query Loader. Дещо нагадує анімований стиль завантаження сторінок на флеш-сайтах. Є варіанти із анімованою смужкою, або з процентним значенням завантаженого контенту.

Як встановити?

В англомовній статті автора все акуратно розписано:

Завантажуємо на хостинг в папку з вашою темою файли скрипту, які можна скачати тут, зі сторінки автора:

Варіант із анімованою смужкою.

Варіант із процентним значенням.

Далі, завантаживши файли скриптів, потрібно прописати у двох файлах вашої теми наступний код:

У хедері в <body>, перед теґом </head>

<script type=’text/javascript’ src=’http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js’></script>
<link rel=”stylesheet” href=”css/queryLoader.css” type=”text/css” />
<script type=’text/javascript’ src=’js/queryLoader.js’></script>

У футері, перед </body>

<script type=’text/javascript’>
    QueryLoader.init();
</script>

Це все, користуйтеся на здоров'я.

Які можуть виникнути проблеми?

На моєму сайті «Не Кіт» виникла наступна проблема - при повторному завантаженні сторінки або при переході на іншу сторінку спочатку відображався фон і контент, а вже після цього з'являвся Loader. Вирішити цю проблему пробував мій колега Юрко Червоний, використовуючи власний скрипт і хаками у файлі functions.php. На перший погляд це дало результат, але при багаторазовому перезавантаженню сторінки проблема з'являлась знову.

Методом спроб і невдач я усунув цю проблему. WordPress використовує у хедері та футері код <?php wp_head() ?> та <?php wp_footer(); ?>. Якщо на вашому сайті виникає ця проблема, переконайтеся, що код Query Loader скрипту стоїть безпосередньо перед <?php wp_head() ?> та <?php wp_footer(); ?> На сторінці автора цього скрипту про це не згадується, хоча у коментарях хтось поділився, що при використанні із WordPress з'являється схожа проблема.

© «Не Кіт»

Зверніть увагу: ця публікація побачила світ більше року тому, з того часу багато чого могло змінитися ;)
Дмитро Кондрюк
Дмитро Кондрюк
В веб-індустрії з 2003 року. В 2009р. заснував проект Український WordPress (що у подальшому став офіційним сайтом команди локалізації WordPress в Україні). З 2010 року засновник і технічний директор проекту Український хостинг для WordPress (WPHost.me) - повноцінного хостинг-сервісу, максимально оптимізованого на використання CMS WordPress.

Коментарів 2

Поділіться з друзями.

Ми впевнені, що це може бути корисним для інших і для нашого сайту також )