Есть несколько способов, как добавить стили CSS на сайт Joomla. В зависимости от выбранного способа, можно изменить внешний вид как всего сайта, так и отдельных статей, добавить туда особые элементы оформления. Иногда бывает необходимо править/добавлять стили при размещении рекламного кода на сайте.

[Способ 1: прямая правка стилей шаблона сайта]

Можно добавить стили напрямую в файл стиля шаблона. Это самый простой, но не самый лучший способ, поскольку разрастание общего файла стилей снижает быстродействие сайта. Кроме того, стилями пользоваться не очень удобно, и их неудобно редактировать, а также нужно следить за тем, чтобы не повторялись/не конфликтовали имена стилей. Имейте в виду, этот способ может повлиять на внешний вид всего сайта!

В Joomla 1.0.12 файл стиля шаблона обычно называется template_css.css, и находится он в папке public_html\templates\название_шаблона\css\ (каждый шаблон имеет такой индивидуальный файл template_css.css). Это файл можно отредактировать текстовым редактором, и просто скопипастить туда нужные стили. Файл CSS шаблона можно также редактировать в админке (Сайт -> Шаблоны -> Шаблоны сайта -> поставьте радиокнопку на нужный шаблон, и нажмите кнопку Правка CSS), или перезаписать его по ftp. Кроме того, можно отредактировать код шаблона в админке сайта (Сайт -> Шаблоны -> Шаблоны сайта -> поставьте радиокнопку на нужный шаблон, и нажмите кнопку Правка HTML. Подключение CSS настраивается в начале кода шаблона, внутри тега head) и подключить в коде шаблона нужные файлы CSS.

В Joomla 1.5 код CSS шаблона и его код можно поправить похожим образом. Через админку войдите в меню Расширения -> Шаблоны -> Сайт -> поставьте радиокнопку на нужный шаблон, нажмите кнопку Изменить. Чтобы отредактировать CSS, нажмите кнопку Изменить CSS, а чтобы отредактировать код шаблона нажмите Изменить HTML.

[Способ 2: вставка стилей с помощью расширения Jumi]

Добавление в статью кода с помощью расширения Jumi [1], оно доступно для Joomla 1.0.12 и Joomla 1.5. Это очень гибкий метод, таким способом можно вставлять стили не только в шаблон, но и в любой модуль, и даже в отдельную статью. С помощью расширения Jumi код CSS можно вставить в статью через тег jumi. Процесс по шагам (на примере добавления стиля в статью).

1. Установите Jumi. Установка для Joomla 1.0.12 и Joomla 1.5 описана в [1].

2. Создайте файл стиля для статьи, например mystyle.css, и сохраните его в какой-нибудь папке сайта (запомните в какой, так как путь понадобится для загрузки стиля). Можно взять целиком файл уже готовый css, только добавьте в начало и конец файла маркеры тега style. Пример такого специально подготовленного файла стилей:

<style>
body {
  background: #f2f1f0;
  font-family: verdana,sans-serif;
}
 
h1 {
  margin-top: 1.5em;
}
 
h2, h3 {
  margin-top: 2em;
}
 
h1, h2, h3 {
  font-family: georgia,serif;
  font-weight: normal;
  margin-bottom: 0.5em;
}
 
...
 
pre.screen {
  background-image: url(images/stories/shell.png);
}
 
pre.programlisting {
  background-image: url(figs/source.png);
}
 
pre.programlisting, pre.screen, p.remark {
  border-style: solid;
  border-width: 1px;
  font-size: medium;
  padding: 1em;
  background-repeat: no-repeat;
  background-position: 10px 10px;
  padding-left: 70px;
}
 
...
 
</style>

3. Вставьте в начало статьи текст типа такого:

Joomla 1.0.12:
{jumi [mystylesfolder/mystyle.css]}

Joomla 1.5:
{jumi [/mystylesfolder/mystyle.css]}

Как Вы уже заметили, для Joomla 1.5 в начале пути нужно добавить почему-то слеш, соответствующий корневой директории. Теперь к контенту статьи будет подключаться стиль из файла mystyle.css, и код статьи может использовать стили оттуда.

[Способ 3: плагин Unique Css Article]

Установите плагин Unique Css Article [2]. Он доступен для версии Joomla 1.5. Чтобы использовать этот плагин, Вам нужно создать и сохранить индивидуальный файл CSS для статьи под именем типа article_1.css в директории /css активного шаблона. Для того, чтобы определить, какая статья будет использована для этого файла CSS, подсмотрите ID статьи в Менеджере Статей (Article Manager) и подставьте номер ID в названии файла CSS.

[Ссылки]

1. Joomla: вставка произвольного кода на сайт с помощью Jumi.
2. Плагин Unique Css Article.
3. Joomla: CSS для начинающих.