Урок 9.2 Как вставить ссылки и изображения в материал Jommla 3

1 1 1 1 1 1 1 1 1 1 Рейтинг 5.00 [1 Голос]

Добавление ссылок и изображений в материалы на Джумле

Добавление ссылок и изображений в материалы на ДжумлеВ наших предыдущих уроках мы рассказали о создании материалов на CMSJoomla 3:

Урок 9. Создание материала в Joomla 3

А так же научились редактировать материалы и изменять их описание, формат вывода и т.д.:

Урок 9-1. Функции редактирования материала на Joomla 3

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

 

 

Как вставить ссылку в материал Joomla 3

            Начнем наш урок с, пожалуй, самого популярного вопроса вставки ссылок в материалы на Джумле. На самом деле выполняется это довольно просто. Давайте поэтапно рассмотрим весь процесс.

1) Переходим в раздел МАТЕРИАЛЫ – МЕНЕДЖЕР МАТЕРИАЛОВ – СОЗДАТЬ МАТЕРИАЛ

2) Здесь же выбираем на панели текстового редактора значок «ВСТАВИТЬ ССЫЛКУ»

 

Вставить ссылку в Джумла 3

 

3) В открывшемся окне заполняем нужные нам поля

 

Параметры вставки ссылки

 

Ссылка – введите сюда адрес ссылки

Текст – введите текст ссылки (анкор)

Так же тут присутствует параметр поиска ссылок и атрибуты для вставки якоря в статью.

 

Вкладка Расширенные

 

 

Нажав на вкладку «РАСШИРЕННЫЕ» Вы сможете задать для Вашей ссылки различные классы и атрибуты.

А во вкладке «ВСПЛЫВАЮЩИЕ ОКНА» Вы можете настроить эти самые окна на странице материала

4) Давайте теперь пропишем, какую либо ссылку и посмотрим, как она будет отображаться в нашем материале.

Вариант 1 – Безанкорная ссылка. Для ее создания пропишите следующее:

 

Безанкорная ссылка

 

Вариант 2 – Ссылка с анкором. Для ее создания пропишите следующее:

 

Ссылка с анкором

 

Теперь давайте посмотрим, как это будет выглядеть в нашем материале на сайте

 

Вид ссылки на сайте

 

Думаю с размещением ссылок на своем сайте все понятно.

 

 

Как вставить изображение в материал на Джумле 3

            Так же очень важно добавлять в свой текст различные картинки и фотографии. Это позволит сделать материал более красочным, а поисковые системы будут лучше индексировать Ваш сайт. Давайте поэтапно рассмотрим процесс размещения изображений на Вашем сайте.

1) Подберите необходимое изображение для размещения в статье

2) Кликните по вкладке «ДОБАВИТЬ ИЗОБРАЖЕНИЕ» в поле редактора

 

Добавить изображение

 

3) После этого перед нами раскрывается окно редактора изображений.

 

Редактор изображений

 

 

Чтобы добавить новое изображение Вам необходимо нажать на значок картинки

 

Добавляем изображение

 

4) После этого перед Вами откроется окно для загрузки нового изображения.

 

окно для загрузки нового изображения

 

 

- Кликните по вкладке «ОБЗОР»

- Выберете изображение на своем компьютере

- Нажмите клавишу загрузить

 

После этого изображение появится в корневой папке Вашего сайта, где расположены все рисунки. Выберете его и нажмите ВСТАВИТЬ, и изображения появится в тексте материала Вашего сайта.

Кстати, для удобства Вы можете создавать новые папки для хранения изображений. Например, если хотите, чтобы картинки располагались по категориям, Вам достаточно создать несколько папок, присвоив им имена категорий. Для создания папки необходимо нажать на значок папки.

 

Для создания папки необходимо нажать на значок папки

 

Теперь давайте разберемся с остальными функциями, которые нам доступны при добавлении картинок на свой сайт. Как Вы уже успели заметить, в верхней части расположены еще 3 вкладки: изображение, альтернатива и расширенные. Давайте разберемся, какие функции доступны в каждой из этих вкладок.

Вкладка «ИЗОБРАЖЕНИЕ»

 

Вкладка «ИЗОБРАЖЕНИЕ»

 

Ссылка – здесь автоматически прописывается адрес к Вашему изображению

Текст – название Вашего изображения, под которым оно сохранено на сайте

Размер – размер Вашего изображения в пикселях

Выравнивание – Вы можете выровнять ваше изображения (по центру, по верху и т.д.)

Отступ – отступ изображения от правого, левого, верхнего и нижнего края

Границы – здесь Вы можете указать стиль, цвет и размер границ изображения

 

Вкладка «АЛЬТЕРНАТИВА»

 

Вкладка «АЛЬТЕРНАТИВА»

 

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

 

Вкладка «РАСШИРЕНЫЕ»

 

Вкладка «РАСШИРЕНЫЕ»

 

Стиль – Вы можете указать один из встроенных CSSстилей

Список классов – Вы можете указать доступный класс для изображения, выбрав его из выпадающего списка

Классы – Вы можете самостоятельно прописать класс для Вашего изображения.

Название – укажите название картинки, которое будет отображаться при наведении на нее курсора мыши

Так же Вы можете указать ID, направление, код языка и другие параметры для Вашего изображения.

 

Заключение

            В этой статье мы рассказали о том:

- Как вставить ссылку в материал Джумла 3

- Как вставить изображение в материал Джумла 3

Так же мы разобрали основные функции, доступные при добавлении этих элементов в материал

 

Комментарии   

0 #2 RE: Урок 9.2 Как вставить ссылки и изображения в материал Jommla 3Администратор 04.06.2017 10:41
Цитирую олег_11:
все сделал как описали, джумла 2.5 да ссылка появилась, но она почему то видна только когда курсор на нее навожу, а так невидимый текст((

Посмотрите в настройках Вашего шаблона, возможно установлен цвет ссылки такой же как цвет Вашего фона, а при наведении на нее цвет естественно меняется и она становится видима.
Цитировать
0 #1 ссылка в джумлеолег_11 03.06.2017 18:30
все сделал как описали, джумла 2.5 да ссылка появилась, но она почему то видна только когда курсор на нее навожу, а так невидимый текст((
Цитировать