14.08.2009

Как вставить картинку в блог

Такой вопрос рано или поздно задет себе любой блогер.

Вот, на мой взгляд, самый простой способ.

Для того чтобы вставить изображение в сообщение блога, как и в любую другую html страницу, необходимо воспользоваться тегом <img>, в атрибуте src которого указать ссылку на это изображение. Для этого, прежде всего, необходимо разместить файл с изображением где-то в Интернет, так, чтобы любой пользователь мог получить к нему доступ. Здесь лучше всего (на мой взгляд) воспользоваться сервисом Google Picasa. Заводим (если еще нет) аккаунт Google, заходим на сайт сервиса. Жмем на кнопку "загрузить" сверху в середине страницы.

Появится окно с предложением создать или выбрать альбом

Для картинок размещаемых в блоге лучше всего создать отдельный частный альбом (например с именем блога или по тематике размещаемых картинок), что бы в дальнейшем, когда изображений станет много, этим хозяйством было проще управлять. Переходим по ссылке "создайте новый альбом" и создаем альбом.

Кстати, если блог размещен на Blogger'е то при первой попытке вставит картинку с помощью кнопки "добавить изображения" редактора сообщений, на сервисе Picasa автоматически будет создан частный альбом с именем блога и файлы картинок будут загружаться в этот альбом.

После выбора альбома, сервис Picasa покажет форму для загрузки изображений. Пользователь за раз может загрузить пять файлов.

После того как файл изображение будет загружен, сервис выведет страницу просмотра содержания альбома. Кликаем на загруженном изображении, откроется страница просмотра изображения. Picasa, если изображение загруженное пользователем полностью не помещается на странице просмотра, автоматически создает миниатюру, которую и отображает на странице. Что бы для крупных изображений получить ссылку именно на исходное изображение необходимо один или несколько раз нажать на кнопку изменения масштаба справа от изображения.

После того как кнопка изменения масштаба станет неактивной, кликаем правой кнопкой мыши на изображении. В всплывающем меню выбираем "Copy Image Location" (если у Вас браузер Firefox).

Далее в html редакторе блога в нужном месте Вашего сообщения размещаем тег <img src=""/>, устанавливаем курсор между двумя знаками кавычек и вставляем из буфера обмена ссылку на изображение.

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKG7ApGZzLT_ERuv8mTgJLHVBAtVonuAPN7L4UFk0_Emid4vIVt24AsujkgAJHRcQYZ1e192H8HPdiDgSYKq-1T7l3NT0aTCJt9FpqbIsCmiQowwB0tMCIu4cPYtexmFOlH7JOfOFLEc4/"/>

Сохраняем сообщение. Вот собственно и все.

Ну можно еще добавить, что в контекстном меню браузера Internet Explorer нет пункта "Copy Image Location", но там есть пункт "Property/Свойства". Кликаем правой кнопкой на картинке, выбираем пункт "Property".

В появившемся окне копируем ссылку на изображение.

Далее поступаем как описано выше.

Следующий пост по теме: Как вставить в блог фрагмент кода с подсветкой синтаксиса.

7 комментариев:

  1. одну картинку я вставила ))) а как вставить несколько в один пост?????

    ОтветитьУдалить
  2. Да точно так же :)
    Повторить все описанные действия с другой картинкой и вставит еще один тег <img> с новой ссылкой...

    ОтветитьУдалить
  3. [im#]http://4.bp.blogspot.com/-bVhexDSkuww/UOF3_ExxsYI/AAAAAAAAG10/LGeBfyYa8wc/s320/veselyie-otkryitki-s-godom-.gif[/im]

    ОтветитьУдалить
  4. [im#]"http://4.bp.blogspot.com/-bVhexDSkuww/UOF3_ExxsYI/AAAAAAAAG10/LGeBfyYa8wc/s320/veselyie-otkryitki-s-godom-.gif"[/im]

    ОтветитьУдалить
  5. Что-то не получается вставить картинку

    ОтветитьУдалить