ALite CMS 43.11
О системе > Разработка > Статьи
Язык: 
ALite CMS

Статьи

Загрузка дополнительных стилей и скриптов в плагинах

15.05.2009 18:44, рейтинг: 3691, автор: ALite CMS

Подключаемые модули (плагины) могут использовать дополнительные файлы стилей и скриптов. В ALite CMS есть несколько способов загрузки таких файлов.

  • Перечислить эти файлы в настройках системы поле "Дополнительные стили" или "Дополнительные метатэги".
    Пример:
    < link rel="stylesheet" type="text/css" href=" /_themes/имя_темы/plugins/css/my_style.css" / >
    < !--[if IE 6] >< link rel="stylesheet" type="text/css" href="=" /_themes/имя_темы/css/my_style_ie6.css" / >< ![endif]-- >
    < script type="text/javascript" src="=" /_themes/имя_темы/plugins/js/my_file.js" >< / script >
    < script type="text/javascript" src="=" /_js/my_file1.js" >< / script >
    Указанные таким способом файлы автоматически вставляются внутрь тэга < head >, загружаются при открытии страницы, всегда доступны и не требуют каких-то специальных вызовов и обработок.
  • Загрузка дополнительных файлов внутри подключаемых модулей. В этом случае дополнительные файлы загружаются только при обработке подключаемого модуля. Если предполагается использовать дополнительные файлы только в конкретном подключаемом модуле или в зависящих от него модулях предпочтительнее использовать именно этот способ. Это может значительно уменьшить объем данных, передаваемых клиенту, и соответственно ускорит загрузку страницы. Именно этот случай будет рассмотрен ниже.


Непосредственная вставка кода в текст плагинов с использованием тэгов < link... или < style type="text/css" >... хотя и обрабатывается правильно большинством браузеров, все же является некорректной. Стили должны загружаться внутри тэга < head >. Также правильнее загружать в тэг < head > и файлы скриптов, а не вставлять куски кода в текст плагина.

В ALite CMS для загрузки файлов стилей и скриптов существует JavaScript-функция alcLoadExternalCssFile(fileName, charset, media)  и alcLoadExternalJsFile(fileName, charset). Эти функции не только загружают указанные файлы, но и предотвращают их многократную загрузку.

Пример:
alcLoadExternalCssFile('/_themes/имя_темы/plugins/css/my_style.css', 'UTF-8');
alcLoadExternalJsFile('/_themes/имя_темы/plugins/js/my_script.js', 'UTF-8');

Использование этой функции имеет одну особенность. Она не позволяет загрузить файлы в построителе страниц. Для устранения этого существует php-функции alc_common_load_module_css_js_files($module, $css_filename, $js_filename), alc_common_load_external_css_file($file_name, $charset = 'utf8', $media = ''), alc_common_load_external_js_file($file_name, $charset = 'utf8'), которые корректирует загрузку файлов стилей и скриптов с учетом особенностей работы в построителе страниц.
Всегда предпочтительнее использовать php-функции для загрузки файлов, а не прямой вызов JavaScript-фунций.

Пример:
echo alc_common_load_module_css_js_files('news', 'unews.css', 'unews.js');
echo alc_common_load_external_css_file('/локальный_путь/unews.css');
echo alc_common_load_module_css_js_files('/локальный_путь/unews.js');

Примечание:
Работа javascript в построителе страниц ограничена и большинство функций скриптов работать не будет.

RSS  RSS