Вставить скрипт в новость DLE
Вставить рабочий ява-скрипт или css-стиль прямо в новость CMS DLE невозможно. Код, заключённый в теги <script>, <onclick> или <style> удаляется редактором движка, вместе с тегами.
- Ява-скрипт и css-стиль в новости CMS DLE
- Движок DLE «рубает» ява-скрипты
- Добавление скриптов в новость DLE
- Запись скриптов непосредственно в Базу Данных
- Вставляем скрипт в дополнительное поле новости
(встроенные сценарии и стили) - Подключение к новости DLE сторонних скриптов и стилей
(внешние сценарии и стили) - Подключение внешнего (стороннего) скрипта в новость DLE
Ява-скрипт и css-стиль в новости CMS DLE
Ява-скрипты и css-стили расширяют функционал страницы с новостью сайта. Например, онлайн-калькуляторы, висящие на тематических технических страницах – мегакалории, теплотворность. Калькуляторы сделаны на ява-скрипт. Псевдоклассы css, :after и :before – используются для исключения из поисковой индексации «мусорных» фраз и стоп-слов. Скрипты калькуляторов и css-стили с мусорными фразами-словами не задействованы нигде. Возникает потребность – добавить в новость DLE jаvascript и css-стиль, уникальные в пределах сайта.
Движок DLE «рубает» ява-скрипты
Увы, такова политика безопасности скрипта. CMS DLE – многопользовательская новостная операционная сайтовая система. Журналисты DLE немедля напихают яваскриптов и css-стилей на сайт. Бесконтрольное добавление скриптов и стилей в тело новости чревато последствиями – от банального перекоса веб-страницы в браузере, до внедрения вражеских функций в структуру сайта. Система защиты движка DLE фильтрует скрипты и коды на вводе данных – от греха подальше. Сдаётся мне, разработчики CMS DLE никогда не реализуют добавление ява-скриптов в новость DLE, даже на уровне администратора сайта – слишком это опасно и вредно.
Добавление скриптов в новость DLE
Добавление скриптов в новость DLE, в обход защитной системы движка – нарушение его политики безопасности. Путь любителей экстрима – вырубить или обойти фильтрацию ввода данных, разрешая пользователям сайта DLE добавление скриптов в новость. Такое, исключительно сумасшедшее рукоприкладство – повод для сэпукки или харакири, в ожидании падения сайта.
Запись скриптов непосредственно в Базу Данных
Дописать «вручную» код скрипта в базу данных (БД) сайта – простой и действенный способ вставить скрипт в новость DLE. Скрипт дописывается в БД, в тело новости, после её публикации на сайте. Система безопасности движка бессильна. При просмотре в браузере модифицированных новостей – дописанные «от руки» коды скриптов и стилей отправляются посетителю на компьютер.
Пересохранение новости в текстовом редакторе сайта – полностью стирает дописанные «вручную» скрипты и стили. «Навсегда» закрепляет код скрипта в новости CMS DLE использование дополнительных полей
Вставляем скрипты в дополнительные поля новости
(встроенные сценарии и стили)
Встроенные сценарии и стили –
программные коды в html-документе,
обёрнутые в теги <script> или <style>
Установить (встроить) скрипт прямо на веб-страницу с новостью позволяет её дополнительное поле – [xfvalue_имя]. При просмотре страницы, содержание доп.поля выводится движком из новости – непосредственно в html-разметку шаблона сайта, где и оборачивается тегами <script> или <style>. Этот способ позволяет частично обойти фильтрацию ввода данных CMS DLE.
- В админпанели движка – создать дополнительные поля с именами «css» (для CSS) и «java» (для jаvascript). Тип поля – несколько строк. «Использовать поле по желанию» – да. Текстовый редактор – не подключать.
- В низ шаблона полной новости (fullstory.tpl) вставить конструкции
<style type="text/css">[xfvalue_css]</style> (для CSS)
<script type="text/jаvascript">[xfvalue_java]</script> (для jаvascript) - При добавлении новости – в созданные доп.поля записываются требуемые коды скриптов и стилей
Недостатком использования доп.полей в CMS DLE является их общедоступность. Журналисты смогут добавлять скрипты и стили в новости сайта DLE. Запись и загрузка скриптов и стилей в доп.поля новости приемлема владельцам блогов да небольших сайтов, где нет орды журналистов.
Частично, общедоступность доп.полей в CMS DLE ограничивается оборачиванием тегами [group=1] строки {xfields} в шаблоне addnews.tpl и запретом входа журналистов в админпанель движка.
Встроить css в новость DLE
Запишем в новости CMS DLE,
в доп.поле для CSS – код стиля css
и добавим соответствующий класс в html-код новости:
Код css
.proba { color: #ff0000; font-weight: bold; }
.proba:after { content:" Получилось !!! ..." }
Код html
<span class="proba">Пробуем –</span>
Результат в браузере:
Пробуем –
Текст, выведенный через псевдоклассы css, :after и :before – сгенерирован браузером прямо на экран из стиля css. Такой текст – не копируется, не выделяется курсором, не выводится на печать и не индексируется поисковыми системами – его вообще не существует в html-коде веб-документа. На html-странице висит только <span class="proba">, на который поисковые роботы не обращают никакого внимания.
Встроенные css-стили в доп.поле новости CMS DLE работают прекрасно. Недостаток – неоправданное увеличение веса страницы и неприязнь поисковых систем ко всем встроенным стилям. Внешние файлы стилей – решают эту проблему.
Встроить jаvascript в новость DLE
Встроим выпадающее меню на яваскрипт
в новость сайта на CMS DLE.
Запишем в новости CMS DLE,
в доп.поле для CSS – код стиля css,
в доп.поле для jаvascript – код jаvascript
и добавим соответствующие классы в html-код новости:
Код css
#vipad {background-color:#ccc;cursor:pointer;padding:10px 20px;}
#vipad_list {display:none;}
#vipad_list.open1 {display:block;}
Код jаvascript
$(function() {
$('#vipad').click(function() {
$('#vipad_list').toggleClass("open1");
return false;
});
});
Код html
<div id="vipad">Выпадающий список на ява-скрипт в новости CMS DLE</div>
<ol id="vipad_list">
<li>Вставить</li>
<li>ява-скрипт</li>
<li>в новость</li>
<li>CMS DLE</li>
</ol>
Результат в браузере:
- Вставить
- ява-скрипт
- в новость
- CMS DLE
Встроенные ява-скрипты в доп.поле новости CMS DLE ограничены функционально – совершенно невозможно использовать события, вида «onclick», вырезаемые движком из текста новости во время её сохранения. Единственный выход – подключение к новости DLE скриптов и стилей из внешних файлов – работает всё.
Подключение к новости DLE сторонних скриптов и стилей
(внешние сценарии и стили)
Внешние скрипты и стили –
программные коды, записанные в отдельных файлах
и загружаемые в браузер отдельно от остальной информации
Наличие доп.полей в CMS DLE позволяет «подтянуть со стороны» скрипты и стили при просмотре полной новости на сайте. Для загрузки файлов внешних скриптов и стилей в новость DLE используется конструкция, вида <script type="тип" src="URL"></script> где, URL – дополнительное поле новости CMS DLE, вида [xfvalue_имя].
- В админпанели движка – создать дополнительные поля с именами «css_download» (для CSS) и «java_download» (для jаvascript). Тип поля – одна строка. Установить чебокс (галочку) в положение «Использовать поле по желанию»
- В низ шаблона полной новости (fullstory.tpl) вставить конструкции
<link rel="stylesheet" type="text/css" href="[xfvalue_css_download]"> (для CSS)
<script type="text/jаvascript" src="[xfvalue_java_download]"></script> (для jаvascript) - При добавлении новости – в созданные доп.поля записываются полные url-адреса требуемых кодов скриптов и стилей, загруженных на сервер
- Создать файлы скриптов с расширениями .css и .js и загрузить их «вручную» (по ftp) на сервер. После загрузки – выписать полный (абсолютный) путь к загруженному файлу и проверить доступ к нему. Путь должен иметь вид http://tehnopost.info/uploads/tehnopost/имя скрипта.js (или css)
- Для проверки доступа к загруженному файлу – вставить полный путь в адресную строку браузера – текст файла должен высвечивать на экран. Для проверки правильности подключения файла – сохранить страницу с новостью сайта на домашний компьютер – подключённый файл должен сохраниться вместе с остальными файлами веб-страницы.
Краткая теория Создаётся доп.поле с именем «java_download». В шаблон fullstory.tpl вставляется конструкция <script type="text/jаvascript" src="[xfvalue_java_download]"></script>. Файл ява-скрипта грузится «вручную» на сервер, а ссылка на скачивание вставляется в доп.поле новости. Дальше, при просмотре полной новости на сайте – скрипт «подхватывается» и загружается браузером, как только он (браузер) увидит запись на странице, вида: <script type="text/jаvascript" src="uploads/имя скрипта.js"></script>. При необходимости, интерактивные элементы со свойствами «onclick» – динамически создаются самим ява-скриптом на странице новости CMS DLE. В результате описанных фантазий – к новости DLE подключится, и ява-скрипт, и его onclick-и.
Подключение внешнего (стороннего) скрипта в новость DLE
Возьмём сценарий, совершенно невстраиваемый в новость CMS DLE из-за присутствия в сценарии события «onclick». Описание сценария: нажатие интерактивной ссылки «Считать кролей!» (событие «onclick») – вызывает модальное окно с надписью «Из шляпы достали "N" кролика!». Где, N – изменяется от 1 до 3, после нажатия клавиши «Enter» или кнопки «OK».
Код jаvascript
function count_rabbits(){
for( var i=1; i<=3; i++; ){ alert("Из шляпы достали "+i+" кролика!" )}}
Код html
<a href='# onclick="count_rabbits(); return false;" title="Считать кролей!">Считать кролей</a>
Вышеописанный ява-код в новости CMS DLE не будет работать никогда – из html-кода новости DLE событие onclick вырезается движком во время сохранения новости. Видоизменяем код, создавая интерактивность (onclick) силами ява-скрипта при его загрузке. Адаптированный к условиям CMS DLE код яваскрипт:
Код jаvascript
document.getElementById('my_proba').onclick=
function count_rabbits(){
for(var i=1;i<=3;i++){alert("Из шляпы достали "+i+" кролика!")}
return false;}
Код html
<a href="#" id="my_proba">Считать кролей</a>
Результат в браузере:
Считать кролей
Несмотря на перенос onclick из html-кода в тело яваскрипта, встроить его в доп.поле новости всё равно не выйдет – само слово onclick вырезается и коверкается движком, хоть ты ему тресни. Такой яваскрипт можно вставить в новость DLE только в виде внешнего сценария – отдельно загружаемого файла.
– Пишем код яваскрипт в отдельный файл с расширением .js, заливаем его «вручную» на сервер и вставляем прямую ссылку на скачивание в доп.поле новости – [java_download]. Точно так – поступаем с файлом CSS. С той только разницей, что расширение файла будет .css, а ссылку на его скачивание – вставляем в доп.поле новости для css – [css_download]. Разница заметна во вставленных в шаблон полной новости (fullstory.tpl) конструкциях – <style type="text/css" src="[css_download]"></style> (для CSS) и <script type="text/jаvascript" src="[java_download]"></script> (для jаvascript)
К недостаткам использования внешних файлов в новостях CMS DLE относятся: ручная (ftp) загрузка файлов скриптов и стилей на сервер, и – проблемы с кодировкой текста. Последняя – самая труднорешаемая для сайтов с кодировкой windows 1251.
Напоминание. Использование скриптов и стилей в доп.полях новостей CMS DLE – небезопасное дело из-за общедоступности дополнительных полей. Скрипты на сайте – всегда источники проблем, хотя-бы из-за своей несовместимости.