вторник, 22 октября 2013 г.

Как сделать баннер с переходом на другую страницу-вкладку

"Поди туда, не знаю куда, принеси то, не знаю что..." гласит русская народная сказка.
При интернетсерфинге бывает схожая ситуация: не знаешь куда и за чем тебя уведет путешествие по веб-страницам. И уже нет ни сил,  ни возможности вернуться в начало пути.

Обозначим нашу задачу: необходимо сделать картинку/баннер для панели блога правой/левой, чтобы переход осуществлялся на веб-страницу в новой вкладке/окне. При этом первоначальная страница  остается открытой.


Нам понадобится:
  • HTMLкод страницы, на которую производится переход;
  • HTMLкод рисунка/баннера; 
  • абра-кадабра форма кода для HTMLгаджета.
Для начинающих - все это производится с помощью обычного копирования.  Так же полезно иметь заготовки на "листочках" текстового редактора (word, Блокнот).

Та самая абра-кадабра можете смело закинуть к себе в кладовку, хотя бы на первое время

<a  href="http://elalko77.blogspot.ru/2013/10/blog-post_3063.html#comment-form" target="_blank"><img src="http://img-fotki.yandex.ru/get/9507/54664490.15/0_b6451_f0188ba4_L.jpg" width="150" height="135"  border="0" /></a>

Алгоритм создания баннера:
  1. Добавить гаджет;
  2. Выбрать HTML/JavaScript
  3. Вставить HTMLкод абру-кадабру, указанный здесь
  4. Доработать HTMLкод в соответствии с вашими "реквизитами":
  • кодом страницы - на  место перехода;
  • кодом  рисунка/баннер.
 Примерно, что у вас должно получиться:
И подробно "что есть что"
красный маркер -HTMLкод страницы, на которую производится переход;
желтый - HTMLкод рисунка/баннера;
зеленый - ширина картинки/баннера циферки меняем в зависимости от дизайна вашего блога;
голубой - высота картинки/баннера.
фиолетовый - проверьте наличие этих штучек "скобок".

Вот вроде бы и все!
Пробуйте, экспериментируйте и будет вам Счастье!

Есть вопросы  - слушаю...


И совсем для лентяев как делаю я.
С помощью копирования можно существенно облегчить себе жизнь  и безо всяких загашников:
  1. открываете чистую новую заготовку HTML гаджета;
  2. открываете HTMLкод уже ранее когдато созданного баннера;
  3. переносите абру-кадабру из 2 в 1;
  4. замещаете необходимые реквизиты коды рисунка и вебстраницы
  5. И всё - баннер готов!

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

  1. Вот спасибо! А я все думала-гадала, как это сделать! ))))

    ОтветитьУдалить
    Ответы
    1. Вика, пользуйся с удовольствием! сама была в такой ситуации - когда приспичило, не смогла найти подсказок.

      Удалить
  2. Здорово Елена!!! А ведь пригодится))) Спасибо большое))

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

Спасибо за ваше мнение!