:: Главная :: Новости :: Ссылки :: Видео :: Карта сайта ::
На стартовую DREVAL.COM
Файловый архив Файловый архив
 
Добро пожаловать в
Виртуальный мир JOOMLA !


Навигация
Выбери шаблон Joomla
Авторизация





Забыли пароль?
Главное меню
Главная
Что такое Joomla?
Новости
Статьи
Блог всех разделов
Файловый архив
Демонстрация шаблонов Joomla
Ленты новостей
Полезное в сети
Поиск
Онлайн сервисы
Карта сайта
Календарь статей
«June 2016»
MoTuWeThFrSaSu
  12345
6789101112
13141516171819
20212223242526
27282930     
Популярное
Последнее
Кто на сайте?
Сейчас на сайте:
Гостей - 1
Скорость вашего интернета
Нажмите на часики и определите скорость интернет соединения вашего компьютера:
 
Главная arrow Статьи arrow Советы по Joomla arrow CSS - что за что в ответе
 
CSS - что за что в ответе Версия для печати Отправить на e-mail
Написал Administrator   

ImageВ этой статье описано, как научиться применять на практике стили Mambo за самое короткое время. Для Joomla эта информация также подходит, так как назначение всех стилей одинаковое. Все CSS стили, применяемые в Mambo CMS, иллюстрированы рисунками.

Все стили подходят для самой последней на текущий момент версии Mambo CMS - 4.5.2.3 и, скорее всего, будут работать в следующих версиях 4.5.X.

За пример взят стандартный шаблон - rhuk_solarflare_ii.


1. Изображения со стилями CSS.


Все изображения ниже представляют самые последние стили, реализованные в Mambo CMS 4.5.2.3 на примере шаблона по умолчанию - rhuk_solarflare_ii.



2. Где находиться файл CSS-стилей сайта на Mambo CMS?

Каждый шаблон имеет в своей папке файл, названный template_css.css. Этот файл должен находиться в папке ваш_сайт/templates/ваш_шаблон/css/.

Структура же шаблона должна быть такой:

ваш_сайт/templates/
  |
  +- ваш_шаблон/
       |
       +- index.php
       |
       +- template_thumbnail.png 
       |
       +- templateDetails.xml
       |
       +- css/
       |    |
       |    +- template_css.css
       |
       +- images/

3. Идем дальше.

Прочитав первые две части этой статьи, Вы лишь кратко познакомились со стилями Mambo CMS. Здесь же, я представляю все стили с описанием, чтобы Вам было понятно, что к чему. Вы даже можете использовать этот материал со стилями для своего сайта, просто скопировав нужный Вам стиль. Потому что многие шаблоны не включает в себя некоторые стили, даже которые поставлены в Mambo CMS по умолчанию.

/* СТАНДАРТНЫЙ ФАЙЛ CSS ДЛЯ MAMBO 4.5.X ШАБЛОНОВ */
/* By Dinh Viet Hung (C) http://www.mambotheme.com: free templates and Professional Templates Club */
 
 
 
/* СТАНДАРТНЫЕ НАСТРОЙКИ */
/* Представленные ниже настройки, это настройки по умолчанию, используются, когда нет другого стиля. */

body {} /* Стиль для тэга body вашего сайта, задает фон, шрифты и т.д. */
p {} /* Форматирует все <div>, для которых нет своего класса. */
td {} /* Форматирует все <td> элементы. Используется, когда для определенной <td> нет своего класса. */
tr {} /* Форматирует все <tr> элементы. Используется, когда для определенной <tr> нет своего класса. */
ul {} /* Форматирует все <ul> элементы (список). Используется, когда нет своего класса. */
a:link {} /* Главный стиль ссылок */
a:visited {}
a:hover {}
hr {} /* горизонтальная линия в вашем шаблоне (разделитель) */
hr.separator {}
 
/* НАСТРОЙКИ ФОРМ */
.button {}
.inputbox {}
.search {} /* форматирует <div>, которые отвечают за элементы поиска: inputbox, search button... */
 
 
/* НАСТРОЙКИ НАВИГАЦИИ/МЕНЮ */
 
a.mainlevel{} /* стили для ГЛАВНЫХ элементов меню */
a.mainlevel:link {}
a.mainlevel:visited {}
a.mainlevel:hover {}
 
#active_menu {} /* этот стиль применяется для элемента меню, когда он активный */
 
ul#mainlevel-nav {}
ul#mainlevel-nav li{}
#mainlevel-nav a:link {}
#mainlevel-nav a:visited{}
#mainlevel-nav a:hover {}
 
a.sublevel{} /* стили для элементов меню, которые являются подменю */
a.sublevel:link {}
a.sublevel:visited {}
a.sublevel:hover {}
 
.pagenavbar {} /* Устанавливает стиль для нижней навигации ("<< Start < Prev Next > End >>"), когда они не работают как гиперссылки (если размещено всего несколько статей). */
.pagenavbar:link {} /* Стиль для нижней навигации ("<< Start < Prev Next > End >>"), когда они работают как ссылки* /
.pagenavbar:visited {}
 
.pagenav {} /* форматирование в нижней навигации отображения страниц "<< Start < Previous 1 Next > End >>" */
a.pagenav:visited {}
a.pagenav:hover {}
 
a.readon:link {} /* Стиль для кнопки "Подробнее" в статье/новости */
a.readon:hover {}
a.readon:visited {}
 
.back_button {} /* Стиль для кнопки "Вернуться" */
.pagenav_prev {} /* Стиль для кнопки "Предыдущий" */
.pagenav_next {} /* Стиль для кнопки "Следующий" */
 
.latestnews ul {} /* Стиль для списка последних новостей - по умолчанию, "Последние новости" стоят в позиции user1 */
.latestnews li {}
 
.mostread ul{} /* SСтиль для списка популярных новостей - по умолчанию, "Популярные новости" стоят в позиции user2 */
.mostread li{}
 
/* НАСТРОЙКИ СТРАНИЦЫ КОНТЕНТА */
a.category:link {}
a.category:hover {}
a.category:visited {}
 
.blogsection {} /* Форматирование ссылок в блоге */
.blog_more {} /* "Подробнее" в секции блога */
a.blogsection:link {} /* формат ссылок блога */
a.blogsection:visited {}
a.blogsection:hover {}
 
.componentheading {}/* Название компонента .*/
.contentheading {} /* Название стаьи, новости и т.д. */
.contentpane {} /* Таблица, в которой находяться компоненты, контакты, но не элементы контента. */
.contentpaneopen {} /* Таблица для контента. */
.contentpagetitle {} /* Название статьи */
 
a.contentpagetitle:hover {} /* Название статей, новостей и т.д. */
a.contentpagetitle:link {}
a.contentpagetitle:visited {}
 
.contentdescription {} /* Форматирование "ОПИСАНИЯ" секций, категорий (Новости/Ссылки/Последние новости...) */
table.contenttoc {} /* Форматирование таблицы для статей или контента, которые содержат не одну страницу */
table.contenttoc td {} /* тоже самое, что и выше, только форматирует ячейки <td> */
table.contenttoc th {} /* тоже самое, что и выше, только форматирует название каждой страницы* /
table.contenttoc td.toclink {} /* тоже самое, что и выше, только форматирует таблицу, в которой находяться другие страницы */
a.toclink:link {} /* тоже самое, что и выше, только форматирует в этой таблицы ссылки */
a.toclink:visited {}
a.toclink:hover {}
 
 
/* ПОКАЗ СЕКЦИЙ MAMBO */
.sectiontableheader {} /* Это стиль для отображения заголовка секции
 Например: заголовок таблицr "Дата", "Название", "Автор" и "Просмотров" */
.sectiontableentry1 {}
.sectiontableentry2 {}
 
 
/* ФОРМАТИРОВАНИЕ МОДУЛЕЙ MAMBO */
table.moduletable {} /* Форматирование таблицы модуля */
table.moduletable th {} /* Форматирование заголовка модуля и названия модуля */
table.moduletable td {} /* Форматирование таблицы самого модуля с содержимым */
 
 
/* ДРУГОЕ */
 
/* Даты , Авторы */
.createdate {} /* Стиль для отображения даты создания статьи/новости */
.modifydate {} /* Стиль для отображения даты последнего обновления статьи/новости */
.small {} /* Форматирование "Автор:...." текста */
.smalldark {}/* Стиль для результатов опроса, строка "Число голосовавших".. */
 
/* ОПРОСЫ */
.poll {} /* Формат таблицы опроса */
.pollstableborder {} /* Задает рамку для опроса */
 
 
/* ССЫЛКИ */
.weblinks{} /* ну.. форматирует названия объектов */
a.weblinks:hover {} /* тоже самое, что и выше, только форматирует ссылки на эти названия */
 
/* Лента новостей */
.newsfeedheading {} /* Заголовок ленты новостей. ВНИМАНИЕ: это не будет затрагивать сами новости */
.newsfeeddate {} /* да.. дата ленты новостей */
.fase4rdf {} /* Это - основной текст ленты новостей */
 
/* ПОИСК */
table.searchintro {} /* Форматирование поля "Ключевок слово для поиска", а также форматирование результатов поиска */
 
 
/* ТАБЛИЦЫ АДМИНИСТРИРОВАНИЯ MAMBO В ВИДИМОЙ ЧАСТИ САЙТА ( FrontEnd) */
/* Эти CSS стили работают только тогда, когда администратор авторизируется */
 
.ontab {}/* Форматирование кнопок "Tab" при редактировании содержания в фронт-энде. Когда это активно или нажато */
.offtab {} /* Тоже самое, что и выше. Только когда, это неактивно или не нажато */
.tabpadding {} /* Стиль устанавливает позиции для вышеупомянутых стилей */
.tabheading {} /* Не уверен для чего это используется. Немогу пока найти ничего, что с этим связано */
.pagetext {} /* Этот стиль используется для редактирования контента во время использования редакторов во фронт-энде */

4. Mambo шаблон CSS: Настройка
Обычно, Вы настраиваете template_css.css для того, чтобы полностью доделать свой шаблон ( задать ему соответствующие настройки и дополнить цветовую гамму ), или же просто для того, чтобы Ваш шаблон отличался от других шаблонов. Поэтому, всевозможное редактирование css стилей шаблона Мамbo, наиболее популярно среди пользователей этой системы. Если же Вы не хотите писать свой css стиль заново, то Вы можете открыть любой другой стиль и править его под себя.

5. Все ли это?
template_css.css это только часть создания шаблона под Mambo CMS. CSS довольно сильно может изменить Ваш сайт. Но расположение модулей также очень важно. И в скором на нашем сайте Вы сможете прочитать новый урок по поводу расположения модулей, он также будет с картинками. 

 


Спасибо www.mambotheme.com за прообраз этой статьи и http://www.mamboteam.ru/

В избранное (27) | Ссылка на статью | Просмотров: 64517 | Версия для печати | Отправить на e-mail

Добавить комментарий
RSS комментарии

Только зарегистрированные пользователи могут оставлять комментарии.
Авторизуйтесь или зарегистрируйтесь.

 
< Пред.
 
Статистика


Избранное
Новые файлы
Файл CMS "Joomla 1.0.15 Lavra Edition 2008" - патч обновления
Файл CMS Joomla 1015 Lavra Edition 2008
Файл Шаблон funkymonkey
Файл Шаблон fv_newsportal
Файл Шаблон fv_business_green
Популярные Файлы
Название. (скачиваний)
Портал Вокруг Света



 

Вверх
Вверх