Ви, мабуть, стикалися із проблемою “неестетичного” завантаження сторінок вашого сайту/блоґу, на якому велика кількість графіки – контент підзавантажується частинами, стрибає, і потрібно перечекати певний час, щоб було комфортно читати інформацію. Особливо це актуально для сторінок з великою кількістю фотографій за умов повільного з’єднання з інтернетом.
Вирішити цю проблему стильно можна за допомогою Query Loader’а. Це скрипт, який завантажує контент з анімацією. Прев’ю: Query Loader дещо нагадує анімований стиль завантаження сторінок на флеш-сайтах. Є варіанти із анімованою смужкою, або з процентним значенням завантаженого контенту.
Як встановити?
В англомовній статті автора все акуратно розписано:
Завантажуємо на хостинг в папку з вашою темою файли скрипту, які можна скачати тут, зі сторінки автора:
Варіант із анімованою смужкою.
Варіант із процентним значенням.
Далі, завантаживши файли скриптів, потрібно прописати у двох файлах вашої теми наступний код:
У хедері в <body>, перед теґом </head>
<script type="’text/javascript’" src="’http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js’"></script> <script type="’text/javascript’" src="’js/queryLoader.js’"></script>
Code language: HTML, XML (xml)
У футері, перед </body>
<script type="text/javascript">
QueryLoader.init();
</script>
Code language: HTML, XML (xml)
Це все, користуйтеся на здоров’я.
Які можуть виникнути проблеми?
На моєму сайті «Не Кіт» виникла наступна проблема – при повторному завантаженні сторінки або при переході на іншу сторінку спочатку відображався фон і контент, а вже після цього з’являвся Loader. Вирішити цю проблему пробував мій колега Юрко Червоний, використовуючи власний скрипт і хаками у файлі functions.php. На перший погляд це дало результат, але при багаторазовому перезавантаженню сторінки проблема з’являлась знову.
Методом спроб і невдач я усунув цю проблему. WordPress використовує у хедері та футері код
<!?php wp_head() ?>
Code language: HTML, XML (xml)
та
<?php wp_footer(); ?>
Code language: HTML, XML (xml)
Якщо на вашому сайті виникає ця проблема, переконайтеся, що код Query Loader скрипту стоїть безпосередньо перед wp_head()
та wp_footer();
На сторінці автора цього скрипту про це не згадується, хоча у коментарях хтось поділився, що при використанні із WordPress з’являється схожа проблема.
© «Не Кіт»
коментарі 2
Ви, мабуть, СТИКАЛИСЯ із проблемою…
Дякую за підказки!