Многие создатели сайтов на Joomla используют собственные классы для различных объектов CSS. Это могут быть классы, например, для таблиц или изображений.

Как добавить свой CSS-класс в редактор TinyMCE

Начиная с Joomla версии 2.5 эта популярная CMS использует поддержку технологии "Lightbox", и теперь для получения этого эффекта не нужно устанавливать сторонние расширения, все уже реализовано в самом движке Joomla, достаточно только в редакторе TinyMCE (нужно использовать расширенный режим редактора) при редактировании изображения прописать необходимый класс.




Для того, чтобы к картинкам на сайте был применим эффект "Lightbox" нужно в окне Добавления/Редактирования изображений на вкладке "Appearance" прописать свой класс в поле "Class":

Как добавить свой CSS-класс в редактор TinyMCE

По умолчанию его там нет, доступны только стандартные классы, которые не нужны:

Как добавить свой CSS-класс в редактор TinyMCE

Но фактически-то класс был создан, и он есть!

 

Как вариант, его можно прописать вручную:

Для этого необходимо в выпадающем списке окна "Class" выбрать строку "(value)" - значение. И вручную прописать это значение.

Для применения эффекта "Lightbox" для изображений нужно написать значение класса следующего вида:

sim-lightbox

где, "sim" - это CSS-префикс вашего сайта. У каждого сайта CSS-префикс может быть как уникальным, так может и совпадать с другим сайтом. Например, у всех шаблонов, сделанных с помощью программы Artisteer, по умолчанию стоит CSS-префикс "art".

 

Использование ручного добавления класса имеет ряд недостатков:

1. Нужно помнить CSS-префикс каждого сайта.

2. Необходимо гораздо больше времени на ручной ввод текста по сравнению с быстрым выбором нужного класса из выпадающего списка.

3. Можно ошибиться при вводе класса, и тогда эффект "Lightbox" не будет работать.




 

Как добавить свой CSS-класс для изображений в редактор TinyMCE

1. Открыть в текстовом редакторе (например, в Notepad++) файл template.css вашего использующегося шаблона сайта (расположен в директории .../templates/[папка вашего шаблона]).

2. Найти в нем текстовый блок с описанием стилей для эффекта "Lightbox". Обычно это текст примерно следующего содержания:

img.sim-lightbox
{
cursor: pointer;
}

Внимание! Вместо "sim" должен CSS-префикс ВАШЕГО САЙТА!

3. Скопировать этот текст в буфер обмена.

4. Открыть в текстовом редакторе (например, в Notepad++) файл editor.css вашего использующегося шаблона сайта (расположен в директории .../templates/[папка вашего шаблона]).

5. Вставить текст из буфера обмена в любое место, которое понравится :) - Для удобства лучше вставить в самый конец, визуально отделив пустыми строками или комментариями от имеющегося текста.

6. Теперь в окне Добавления/Редактирования изображений на вкладке "Appearance" в поле "Class" появилась дополнительная строка - наш класс для эффекта Lightbox:

Как добавить свой CSS-класс в редактор TinyMCE




 

Дополнение:

Режим редактора TinyMCE должен быть выбран - расширенный

Как добавить свой CSS-класс в редактор TinyMCE

Комментарии (2)

This comment was minimized by the moderator on the site

На Joomla 3.3 также можно это реализовать.
Жаль, для Joomla 1.5 этот метод не подходит - слишком устаревшая система.

This comment was minimized by the moderator on the site

Вариант написания в файле template.css может быть и таким:

.sim-lightbox, .sim-lightbox-wrapper .sim-lightbox-image
{
cursor: pointer;
}

Здесь не опубликовано еще ни одного комментария

Оставьте свой комментарий

  1. Опубликовать комментарий как Гость.
0 Значки
Вложения (0 / 3)
Поделитесь своим местоположением

      Идеальный тестер
      Идеальный тестер

      Любой сотрудник некрупной IT-компании подтвердит, что четверг – самый скучный день недели. В самом деле - в понедельник все разгребают пришедшую за выходные почту, ругаются с поставщиками кофе и воды для кулера, и курят на лестнице, рассказывая друг другу анекдоты для борьбы со сном и похмельем. Во вторник задачи розданы, силы свежи, и код пишется на одном дыхании. В среду количество полезной...




      Использование системы координат WGS-84 в мире
      Использование системы координат WGS-84 в мире

      Международная организация гражданской авиации (ИКАО) предписывает использовать Всемирную геодезическую систему 1984 (WGS-84) или эквивалентную ей в качестве стандарта для указания координат широты и долготы аэронавигациионных данных. В настоящее время далеко не все страны используют геодезическую систему WGS-84 для определения, хранения и публикации аэронавигациионных данных. Не смотря на...




      Восхождение на восточную вершину горы Эльбрус с флагом авиакомпании Волга-Днепр
      Восхождение на восточную вершину горы Эльбрус с флагом авиакомпании Волга-Днепр

      Сейчас я уже не помню точно, да это и не важно - с чего все началось…, но в итоге образовалась инициативная группа из 7 человек с твердым намерением совершить восхождение на гору Эльбрус. В целях получения финансовой поддержки было подготовлено письмо и передано руководству нашей организации, в которой мы осуществляем свою трудовую деятельность с предложением в очередной раз прославить (в...




      Канадский авиационный доллар
      Канадский авиационный доллар

      Что подарить знакомому нумизмату на день рожденья? - Конечно же редкую монету, которой у него еще нет в коллекции! А если этот нумизмат близок к авиации, или просто любит самолеты и все, что с ними связано, то самый лучший подарок для него - канадский юбилейный авиационный доллар!




      Как показать GPS-трек на Яндекс-картах
      Как показать GPS-трек на Яндекс-картах

      Если вы проложили маршрут до некой точки, записав для этого GPS-трек, и вам необходимо публично поделиться этой информацией - как проехать до этого места назначения (охотничий домик, турбаза в лесу далеко за городом или просто домик в маленькой деревне в глухой провинции, и др...), то вы обязательно захотите показать этот трек на карте. Вариантов тут может быть несколько, а основных только два: используя...




      Программа для пересчета координат СК-42 - WGS-84
      Программа для пересчета координат СК-42 - WGS-84

      Как гласит библейская легенда (не смотря на то, что в ней множество нестыковок, как и во всей библии - по мнению французского писателя Лео Таксиля), что при строительстве Вавилонской башни произошло нечто, и все люди стали говорить на разных языках - и из-за этого башню не удалось построить. Так и в авиации до сих пор существуют атавизмы - различные геодезические модели земного шара,...




      Наставление на путь праведный господ авиаторов (НПП ГА)
      Наставление на путь праведный господ авиаторов (НПП ГА)

      Эта книга не претендует на роль настоящего НПП и тем более ФАП, но эти советы - основа безопасности полетов. Все ситуации - знакомыМог дать совет, мог умолчать,Но вот проблема пред тобоюИ надо срочно отвечать.Быть может, автор что-то скажет,И путь решения укажет.



Яндекс.Метрика