Joomla уроки Валидация XHTML в CMS Joomla

Валидация XHTML в CMS Joomla

21

В этой статье будет обсуждаться вопрос валидации языка разметки гипертекста 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).

Перевод:

Элемент, описанный выше, был найден в контексте, где он недопустим. Это может означать, что вы неправильно наследовали элементы – такие как элемент "style" в секции "body" вместо внутри заголовка "head" – или два элемента, которые частично совпадают (что не разрешено).

Еще одна причина данной ошибки – использование синтаксиса XHTML в HTML документах. Согласно правилам HTML полностью закрытых элементов, эта ошибка может создаваться при каскадных таблицах стилей. Например, используя XHTML самозакрывающие тэги для "meta" и "link" в секции "head" HTML документа, парсер может принять за конец секции "head" и начало секции "body" (где "link" и "meta" не разрешены; таким образом появляется ошибка). Как нам исправить данную ошибку? Находим файл index.php в каталоге с шаблоном, который вы используете в CMS Joomla. Далее создаем новую позицию для модуля под названием "cool". Делается это следующим образом: Открываем файл index.php через текстовый редактор и находим строчки в секции 

 <head> тут ваш код шаблона или какой-то текст </head>

Далее вводим следующие строки в эту секцию (между <head> и </head>): 

 <jdoc:include type="modules" name="cool" />

Т.е. у нас получился код:

 <head> <link href="//fonts.googleapis.com/css?family=Ubuntu:regular,italic,bold,bolditalic" rel="stylesheet" type="text/css" /> <jdoc:include type="modules" name="cool" /> </head>

Сохраняем изменения и идем в Расширения-Менеджер модулей. Затем находим модуль HD-Background Selector и в графе позиция пишем "cool" (только что созданную позицию для модуля). Проверяем наш сайт на наличие ошибок: Валидатор

P.S. Данный способ подходит только для тех модулей, позиции которых визуально не важны, например, позиция фона страницы, т.е. позиция модуля не играет никакой роли для его отображения на странице.

2. Валидация Java Script и тега <style>:

Чтобы пройти валидацию при применении на сайте java скриптов, нужно сделать следующие вещи: Вместо <script>код скрипта</script> нужно написать:

 <script type="text/javascript"> код скрипта </script>

Тоже самое касается тега <style>: То есть <style>ваш стиль</style> необходимо заменить на: 

 <style type="text/css"> ваш стиль </style>

Чтобы скрипт окончательно прошел валидацию, необходимо использовать следующие специальные комментарии: для java: 

 <script type="text/javascript"> <!--//<![CDATA[ код скрипта //]]>--> </script>

для css:

 <style type="text/css"> /* <![CDATA[ */ .style {margin: 0; padding: 0] /* ]]> */ </style>

3. Валидация Flash кода:

Вместо огромного кода: 

 <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>

пишем:

 <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>

4. Валидация тэга <noindex>:

Оформить этот тег необходимо следующим образом: 

 <del class="hide"><![CDATA[<noindex>]]></del> то, что необходимо запретить индексировать Яндексу <del class="hide"><![CDATA[</noindex>]]></del>

А в файл стилей добавить:

 .hide {display: none]

5. Общая валидация тэгов:

1. Все парные или одиночные теги, не зависимо от того, как вы их привыкли писать в HTML, должны закрываться, например: <p></p>  <img><img/> <br><br/> Прошу заметить, что теги закрываются именно так, а не иначе – вместо </img> пишем <img/>.  2. Все теги и атрибуты пишутся строчными буквами: вместо <HTML></HTML> пишем <html></html>