{xtypo_quote}Валидация XHTML в CMS Joomla{/xtypo_quote} {xtypo_dropcap}В{/xtypo_dropcap} этой статье будет обсуждаться вопрос валидации языка разметки гипертекста XHTML в системе Joomla. По поводу того, что такое расширяемый язык гипертекста и для чего он нужен, можно прочитать в википедии.
Итак, начнем!
Первое, что я захотел исправить, после установки и настройки компонентов, модулей и плагинов в CMS Joomla, это корректировка ошибок в системе. Данный пункт необходим для того, чтобы браузеры правильно отображали мой контент (содержание), и документы отвечали техническим спецификациям веб-стандартов . Да и просто приятно видеть, когда у тебя нет ошибок, правда? ;)
1. Валидация модуля HD-Background Selector: После установки и настройки данного модуля происходит ошибка: document type does not allow element "style" here …efer"></script> <style type="text/css">body{background-image:url("http://photo…
?
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed). One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
?
The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements -- such as a "style" element in the "body" section instead of inside "head" -- or two elements that overlap (which is not allowed). One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML's rules of implicitly closed elements, this error can create cascading effects. For instance, using XHTML's "self-closing" tags for "meta" and "link" in the "head" section of a HTML document may cause the parser to infer the end of the "head" section and the beginning of the "body" section (where "link" and "meta" are not allowed; hence the reported error).
перевод:
Элемент, описанный выше, был найден в контексте, где он недопустим. Это может означать, что вы неправильно наследовали элементы - такие как элемент "style" в секции "body" вместо внутри заголовка "head" - или два элемента, которые частично совпадают (что не разрешено).
Еще одна причина данной ошибки - использование синтекса XHTML в HTML документах. Согласно правилам HTML полностью закрытых элементов, эта ошибка может создаваться при каскадных таблицах стилей. Например, используя XHTML самозакрывающие тэги для "meta" и "link" в секции "head" HTML документа, парсер может принять за конец секции "head" и начало секции "body" (где "link" и "meta" не разрешены; таким образом появляется ошибка). Как нам исправить данную ошибку? Находим файл index.php в каталоге с шаблоном, который вы используете в CMS Joomla. Далее создаем новую позицию для модуля под названием "cool". Делается это следующим образом: Открываем файл index.php через текстовый редактор и находим строчки в секции {code class="brush: xml;"}<head>
тут ваш код шаблона или какой-то текст
</head>{/code} Далее вводим следующие строки в эту секцию (между <head> и </head>): {code class="brush: xml;"}<jdoc:include type="modules" name="cool" />{/code} Т.е. у нас получился код: {code class="brush: xml;"}<head>
<link href="http://photolessons.org/fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold,bolditalic" rel="stylesheet" type="text/css" />
<jdoc:include type="modules" name="cool" />
</head>{/code} Сохраняем изменения и идем в Расширения-Менеджер модулей. Затем находим модуль HD-Background Selector и в графе позиция пишем "cool" (только что созданную позицию для модуля). Проверяем наш сайт на наличие ошибок: http://validator.w3.org/ P.S. Данный способ подходит только для тех модулей, позиции которых визуально не важны, например, позиция фона страницы, т.е. позиция модуля не играет никакой роли для его отображения на странице.
тут ваш код шаблона или какой-то текст
</head>{/code} Далее вводим следующие строки в эту секцию (между <head> и </head>): {code class="brush: xml;"}<jdoc:include type="modules" name="cool" />{/code} Т.е. у нас получился код: {code class="brush: xml;"}<head>
<link href="http://photolessons.org/fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold,bolditalic" rel="stylesheet" type="text/css" />
<jdoc:include type="modules" name="cool" />
</head>{/code} Сохраняем изменения и идем в Расширения-Менеджер модулей. Затем находим модуль HD-Background Selector и в графе позиция пишем "cool" (только что созданную позицию для модуля). Проверяем наш сайт на наличие ошибок: http://validator.w3.org/ P.S. Данный способ подходит только для тех модулей, позиции которых визуально не важны, например, позиция фона страницы, т.е. позиция модуля не играет никакой роли для его отображения на странице.
2. Валидация Java Script и тега <style>: Чтобы пройти валидацию при применении на сайте java скриптов, нужно сделать следующие вещи: Вместо <script>код скрипта</script> нужно написать: {code class="brush: xml;"}<script type="text/javascript">
код скрипта
</script>{/code} Тоже самое касается тега <style>: То есть <style>ваш стиль</style> необходимо заменить на: {code class="brush: xml;"}<style type="text/css">
ваш стиль
</style>{/code} Чтобы скрипт окончательно прошел валидацию, необходимо использовать следующие специальные комментарии: для java: {code class="brush: xml;"}<script type="text/javascript"> <!--//<![CDATA[
код скрипта
//]]>-->
</script>{/code} для css: {code class="brush: xml;"}<style type="text/css">
/* <![CDATA[ */
.style {margin: 0; padding: 0}
/* ]]> */
</style>{/code}
код скрипта
</script>{/code} Тоже самое касается тега <style>: То есть <style>ваш стиль</style> необходимо заменить на: {code class="brush: xml;"}<style type="text/css">
ваш стиль
</style>{/code} Чтобы скрипт окончательно прошел валидацию, необходимо использовать следующие специальные комментарии: для java: {code class="brush: xml;"}<script type="text/javascript"> <!--//<![CDATA[
код скрипта
//]]>-->
</script>{/code} для css: {code class="brush: xml;"}<style type="text/css">
/* <![CDATA[ */
.style {margin: 0; padding: 0}
/* ]]> */
</style>{/code}
3. Валидация Flash кода: Вместо огромного кода: {code class="brush: xml;"}<object classid="clsid:d27cdb6e-ae6d-11cf-[...]"
codebase="http://fpdownload.macromedia.com/
pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="180" height="80">
<param name="movie" value="logo.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="logo.swf" quality="high" bgcolor="#ffffff"
type="application/x-shockwave-flash" width="180" height="80"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>{/code} пишем: {code class="brush: xml;"}<object type="application/x-shockwave-flash" data="logo.swf"
width="180" height="80">
<param name="movie" value="logo.swf" />
<param name="quality" value="high" />
</object>{/code}
codebase="http://fpdownload.macromedia.com/
pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="180" height="80">
<param name="movie" value="logo.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="logo.swf" quality="high" bgcolor="#ffffff"
type="application/x-shockwave-flash" width="180" height="80"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>{/code} пишем: {code class="brush: xml;"}<object type="application/x-shockwave-flash" data="logo.swf"
width="180" height="80">
<param name="movie" value="logo.swf" />
<param name="quality" value="high" />
</object>{/code}
4. Валидация тэга <noindex>: Оформить этот тег необходимо следующим образом: {code class="brush: xml;"}<del class="hide"><![CDATA[<noindex>]]></del> то, что необходимо запретить индексировать Яндексу
<del class="hide"><![CDATA[</noindex>]]></del>{/code} А в файл стилей добавить: {code class="brush: xml;"}.hide {display: none}{/code}
<del class="hide"><![CDATA[</noindex>]]></del>{/code} А в файл стилей добавить: {code class="brush: xml;"}.hide {display: none}{/code}
5. Общая валидация тэгов: 1. Все парные или одиночные теги, не зависимо от того, как вы их привыкли писать в HTML, должны закрываться, например: <p></p> <img><img/> <br><br/> Прошу заметить, что теги закрываются именно так, а не иначе - вместо </img> пишем <img/>. 2. Все теги и атрибуты пишутся строчными буквами: вместо <HTML></HTML> пишем <html></html>.
{tab=Форум}{xtypo_button2}обсудить{/xtypo_button2}{/tabs}
Комментариев нет:
Отправить комментарий