Разработка сайта для Вашего бизнеса. Веб дизайн. Дизайн логотипа, фирменного стиля, рекламная фотография . Комплексный рекламный креатив.

Ralex. We do the work.
На рынке с 1999го года. Средняя ценовая категория. Ориентация на эффективность решений.
Ознакомтесь с нашим портфолио
Узнайте больше о услугах
Свяжитесь с нами:
E-mail: [email protected]
Tel: (044) 587 - 84 - 78
Custom web design & дизайн и разработка сайта "под ключ"
Креативный, эффективный дизайн. Система управления сайтом (СУС).
Custom flexible разработка систем электронной коммерции
Система e-commerce разрабатывается под индивидуальные потребности. Гибкая функциональность.
Search Engine Optimzation & оптимизация под поисковые системы (SEO)
Постоянная оптимизация и мониторинг сайта в поисковых системах. Достигаем результата быстро и эффективно
Custom logo design & дизайн логотипа и фирменного стиля
Многолетний опыт. Огромное портфолио. Уникальное предложение и цена.
профессиональная рекламная фотография
креативно, смело, качественно
Custom logo design & рекламный креатив. дизайн рекламы
Многолетний опыт. Огромное портфолио. Уникальное предложение и цена.

ScrapHouse | Скрапбукінг для початківців | Як додати картинку або посилання на бічну панель Blogger

Наша взаимовыгодная связь https://banwar.org/

Добридень! Знову замітка для скрап-блогерів. Розповім, як додати посилання у вигляді картинки на бічну панель Blogger.

Заходимо на головну сторінку Blogger і бачимо список своїх блогів (у більшості з вас 1 блог):
Заходимо на головну сторінку Blogger і бачимо список своїх блогів (у більшості з вас 1 блог):

Натискаємо на кнопочку з трикутником навпаки блогу, на бічну панель якого хочемо додати гаджет. У випадаючому списку вибираємо "Дизайн":
Натискаємо на кнопочку з трикутником навпаки блогу, на бічну панель якого хочемо додати гаджет

Потрапляємо на сторінку настройки вмісту блогу, натискаємо в р-ні бічній панелі "Додати гаджет" (до слова, так само гаджет можна додавати не тільки на бічну панель, а в будь-яке місце блогу - відповідно до його розміткою).
Потрапляємо на сторінку настройки вмісту блогу, натискаємо в р-ні бічній панелі Додати гаджет (до слова, так само гаджет можна додавати не тільки на бічну панель, а в будь-яке місце блогу - відповідно до його розміткою)

З'являється віконце зі списком можливих гаджетів, вибираємо в цьому списку "HTML / JavaScript":
З'являється віконце зі списком можливих гаджетів, вибираємо в цьому списку HTML / JavaScript:

Тепер перед нами інше віконце, що містить два поля - "Назва" і "Зміст". "Назва" - це назва гаджета, яке буде відображатися безпосередньо над гаджетом (в нашому випадку - картинкою), розташованим на бічній панелі блогу. В поле "Зміст" ми будемо вводити той самий код, заповітний код, код картинок з посиланнями або просто картинок, або просто посилань - в залежності від того, що і кому потрібно.
Тепер перед нами інше віконце, що містить два поля - Назва і Зміст

Давайте відразу приклад, а потім розберемо через підрядник, що є що. В даному прикладі в поле "Назва" я ввів "ScrapHouse", а в полі "Зміст" вставив код банера по сайту:
Давайте відразу приклад, а потім розберемо через підрядник, що є що

Після цього натиснув "Зберегти" (помаранчева кнопка) і виявив гаджет в адмінки на бічній панелі:
Після цього натиснув Зберегти (помаранчева кнопка) і виявив гаджет в адмінки на бічній панелі:

Перетягнув мишкою гаджет туди, куди хотів, наприклад, на пару гаджетів нижче:
Перетягнув мишкою гаджет туди, куди хотів, наприклад, на пару гаджетів нижче:

Натиснув "Зберегти розташування":
Натиснув Зберегти розташування:

Натиснув на "Перегляд":
Натиснув на Перегляд:

Переконався, що гаджет не просто з'явився, а з'явився там, де я того хотів:
Переконався, що гаджет не просто з'явився, а з'явився там, де я того хотів:

Ви теж переконалися. І навіть можете додати гаджет (в даному випадку - банер) до себе в блог, якщо у вас є готовий код банера. А якщо немає готового коду? Чи зможете додати, наприклад, картинку, яку хочете?

Давайте розберемо код банера з наведеного вище прикладу:

<a target="_blank" href="http://scraphouse.ru/"> <img src = "http://scraphouse.ru/images/scraphouse_banner.gif" alt = "ScrapHouse: все про скрапбукінге!" border = "0" /> </a> Дивимося на першу і третю сходинки - це відкриває і закриває теги "а". Все, що знаходиться всередині, завжди є посиланням. В даному випадку всередині тега "а" знаходиться тег "img", який є картинкою. Тому наша картинка є "клікабельно". Тому, клікаючи на банер (картинку), коли він знаходиться на реальному блозі, ми потрапляємо на сайт http://scraphouse.ru.

Детальніше про першому рядку коду: відкривається тег "а" (посилання), далі йде частина рядка,

яка говорить про те, що посилання буде відкрита в новій вкладці (або новому вікні) браузера.
Наступна частина рядка href = "http://scraphouse.ru/" показує, який сайт / сторінка відкриється, коли ви клацніть по посиланню (в даному випадку - по картинці). У лапки вставляється адресу сайту / сторінки.

Детальніше про другому рядку коду: відкривається тег "img" (картинка), далі бачимо фрагмент,

src = "http://scraphouse.ru/images/scraphouse_banner.gif" позначає місце, де лежить сама картинка. Це є повний шлях до картинки. Будь-яка доступна картинка в мережі Інтернет має подібний адресу. Ця електронна адреса була вставляється в лапки. Ось, наприклад, нашої помічниці, Саші Буйко. Перейшли? Всі бачать праворуч мультяшних картинку панянки з білим вінком на голові? Повний шлях до цієї картинки такий: http://cs10412.vk.com/u442428/517081/m_ec7de2c2.jpg Як я його отримав? Клікнув на зображенні правою кнопкою миші, вибрав "Відкрити зображення в новій вкладці", скопіював з адресного рядка шлях до картинки і вставив сюди. Всього-то.
Наступний фрагмент другого рядка: alt = "ScrapHouse: все про скрапбукінге!" Це так званий альтернативний текст (в лапках), який буде відображатися замість картинки в тому випадку, якщо з якої-небудь причини сама картинка буде недоступна (ну, впав той сервер, де знаходиться картинка). Даний фрагмент рядка не обов'язковий.
І третя частина другого рядка говорить про те, що рамка навколо картинки відсутня (її товщина, як видно, дорівнює нулю).

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

Підсумуємо. Все, що нам потрібно в найпростішому випадку, - це посилання на картинку і посилання на сайт / сторінку (ресурс).

<a href="/ссилка_на_ресурс"> <img src = "/ ссилка_на_картінку" /> </a> Як це справа вставляється на блог - описано вище.

Пара найпростіших прикладів:
- потрібна посилання, але текстова, а не у вигляді картинки - замість тега "img" пишемо будь-який текст, текст буде клікабельним:

<a href="/ссилка_на_ресурс"> Фальсифікація виборів </a> - потрібна картинка, але не клікабелье, просто хочеться картинку - ну, так позбавляємося від тегів "а" і залишаємо тільки картинку - тег "img": <img src = "http://scraphouse.ru/images/banners/banner_shop.gif" />

Звичайно, треба розуміти, що в код можна додавати і інші параметри, наприклад, задавати розміри картинки. Можна замахнутися і на вставку джава-скриптів в блог, але це, гадаю, вже тема окремої статті.
Начебто подужав. Все зрозуміло?
Задавайте питання, пані.

Відповідаю на питання Анни (коментарі нижче). Анна, в вашому випадку код буде таким:

<a target="_blank" href="http://сайт.ру"> <img src = "http://2.bp.blogspot.com/-JSkv8ZWpy7E/TsY4E0sg6OI/AAAAAAAAEe4/XuzbqDW3Zhs/s1600/IMG_1254.jpg "alt =" ScrapHouse: все про скрапбукінге! " width = "250px" border = "0" /> </a> Єдине - в першому рядку вам потрібно буде вставити адресу сайту / сторінки, який повинен відкриватися при кліці на банер (замість мого http: //сайт.ру). Так, так як у вас картинка величезна, то в тезі img я обмежив її ширину (250 пікселів). Можете змінювати ширину так, як зручно, щоб картинка вміщалася в вашу бічну панель блогу.

Коментувати за допомогою ВКонтакте

А якщо немає готового коду?
Чи зможете додати, наприклад, картинку, яку хочете?
Перейшли?
Всі бачать праворуч мультяшних картинку панянки з білим вінком на голові?
2.jpg Як я його отримав?
Все зрозуміло?
Категории
  • Биология
  • Математика
  • Краеведению
  • Лечебная
  • Наука
  • Физике
  • Природоведение
  • Информатика
  • Новости

  • Новости
    https://banwar.org/
    Наша взаимовыгодная связь https://banwar.org/. Запустив новый сайт, "Пари Матч" обещает своим клиентам незабываемый опыт и возможность выиграть крупные суммы.


    Наши клиенты
    Клиенты

    Быстрая связь

    Тел.: (044) 587-84-78
    E-mail: [email protected]

    Имя:
    E-mail:
    Телефон:
    Вопрос\Комментарий: