lorem ipsum dolor
sit amet 4
1 2 3
7 6 5
  1. lorem
  2. ipsum
  3. dolor
  • sit
  • amet

Пример картинки с увеличением при клике по ней

1. Добавить на эту страницу фотографию, нужного размера (советую не более 1000 px по ширине)

пример: фото remont-skolow.jpg 640 на 361

Ремонт сколов

2. Тебе необходимо уменьшить эту фотку до нужного размера. Это ты можешь сделать так: кликни по фотке, нажми левую кнопку мышки на один из углов фотки и не отпуская, кнопку мышки, двигай, пока не получишь нужный размер. Либо 2ой вариант: правой кнопкой по картинке свойства изображения: задаешь нужный размер.

Я задал 200 px по ширине. Высота подставляется автоматически, пропорционально.

Ремонт сколов

3. Теперь необходимо сделать эту картинку ссылкой для увеличения на экран.

Для этого:

  1. Кликаем по фотке, Идем в "свойства изображения" и копируем путь до фотки (Скрин: https://yadi.sk/i/ZyNDs0Pq3KZ7CJ )
  2. Затем этот путь сразу вставляем в ссылку: https://yadi.sk/i/Q8wJGwQZ3KZ7z9
  3. В редакторе кликаем по кнопке Источник https://yadi.sk/i/SN-dK1C03KZ8JX
  4. Находим нашу фотку (проще по названию искать)
    Видим такой код:
    <a href="/files/image/remont-skolow.jpg"><img src="/files/image/remont-skolow.jpg" alt="Ремонт сколов" width="200" height="113" /></a>
    Добавляем вот это:
    rel="lightbox[]" data-fancybox="gallery"
    Вот сюда:
    <a href="/files/image/remont-skolow.jpg" rel="lightbox[]" data-fancybox="gallery"><img src="/files/image/remont-skolow.jpg" alt="Ремонт сколов" width="200" height="113" /></a>
    не забывай поставить пробел перед этим кодом.
  5. Сохраняешь - проверяешь
     

Ремонт сколов