Персональные Страницы. Как вставить изображение. Как вставить видео.

для раздела Блоги



1. Текст.


  Набираем в любом текстовом редакторе. Орфография и ещё раз орфография! Грамотности не  хватает (мне тоже) - автопроверка орфографии в помощь. Поисковики, если автопроверки недостаточно. Сленг - малыми дозами. Заборную лексику - в топку.

 
2. Изображения.


 Готовим заранее, с запасом, в разных разрешениях - графические редакторы в помощь. Позднее разберёмся, что нужно, что - нет.
Фотохостинг выбираем очень внимательно, чтобы не получилось объяснение в любви, сидя на унитазе.
Итак, фотохостинг выбран.  Для примера на фотохранилище загружен оригинал 3648x2736. Для просмотра предлагаются разные размеры. Копируем ссылки на нужные размеры изображения. Сохраняем, скажем, в текстовом редакторе. Позже пригодятся.
3. CKEditor в помощь. Умеет всё.


Начинаем. Копируем нужный текст из буфера обмена. Редактирование текста более-менее понятно. Затруднение вызывают вставка изображений и ссылок на изображение в виде текста. Панель управления:  "Изображение" и "Вставить/редактировать ссылку".  В первом случае, вставив ссылку на изображение, получаем картинку в тексте, во втором - ссылку на изображение в виде текста (того, что выделили). Пример:
 
small
Маленькая картинка
Большая картинка (290 Кб)
Очень большая картинка (3,2 Мб)
Логично указывать размер - далеко не каждый Читатель пожелает рассматривать фотошедевр в максимальном разрешении.
Замечание. Максимальная ширина изображения на ПС слева от колонки Последние записи/Популярные теги - 600 пикселей (округлённо), иначе будет наложение. Ниже колонки ограничения нет.
 
4. Вставка видео.
Как вставить видео, подсказал Mech здесь.
Первым использовал iframe wowaaa в обзоре ноутбука. Респект.
Что такое iframe, можно посмотреть здесь в Таблице основных тегов HTML
Для примера взят видеоролик с youtube с такой ссылкой: https://www.youtube.com/embed/mii4jTm0uxM
Две условные строки текста с пустой строкой между ними, видеоролик расположим в тексте:

При нажатии на Источник отображается HTML-код:

Вставляем в этом режиме iframe. HTML-код вида (между фигурными скобками):
{ <iframe allowfullscreen="" frameborder="1" height="360" scrolling="no" src="https://www.youtube.com/embed/mii4jTm0uxM" width="640"></iframe><br /> }
Обратите внимание на правильный синтаксис. Получаем:

В режиме редактирования текста (клик по Источник) - прямоугольник с заданными размерами; можно редактировать Свойства iFrame (правый клик).

Панель управления: "Предварительный просмотр".

Сохраняем.


Получилось.
А вот собственно видеоролик:


 
 
 
Опубликованный материал можно редактировать и удалять: Мои записи - Название записи - всплывает подсказка.
 
Удачи.
Ссылка по теме
Telegram-канал @overclockers_news - это удобный способ следить за новыми материалами на сайте. С картинками, расширенными описаниями и без рекламы.
Оценитe материал

Возможно вас заинтересует

Популярные новости

Сейчас обсуждают