Отже, починаємо. Банери бувають зазвичай наступних форматів: 468х60, 120х120, 100х100 або 88х31. Для наочності пропоную зробити банер 468х60.
Створювати будемо в фотошопі. Я роблю це в версії 6.0, але все інструменти, про які я буду говорити, присутні версіях вище 6.0.
1. Відкриваємо фотошоп. Верхнє горизонтальне Меню -> Файл -> Новий.
У вікні вписуємо розміри в пікселях: для нашого випадку ширина 468, висота - 60, дозвіл 150пікс / дюйм, вміст - прозорість, далі тиснемо «ОК».
2. На банері розміщують логотип або будь-яку бажану картинку, а також необхідний текст, наприклад «як збільшити відвідуваність сайту«. Цим ми зараз і займемося.
Зліва в фотошопі є вертикальне меню (ви бачите його на блозі теж зліва). Лівою клавішею мишки натискаємо на ліве віконце палітри кольорів і для прикладу вибираємо зелений. Тиснемо «ОК».
3. Вибираємо інструмент "відро". Якщо ви не бачите інструмент, про який я буду говорити, тоді натисніть правою кнопкою мишки на місце передбачуваного інструменту, і ви побачите весь набір інструментів для даного віконця меню. Після вибору «відра», тиснемо по банеру лівою кнопкою мишки. Банер забарвиться в зелений колір. Вийшло? Повинно бути як на кртинки нижче.
4. Тепер будемо поміщати картинку на банер. У мене картинка, наприклад, для RSS-підписки із зображенням шахової фігури у вигляді коня. Вона має розширення jpg, але можна і розширення gif. Відкриваємо картинку в фотошопі. Буде краще, якщо ми помістимо не всю картинку, а тільки зображення коня. Йдемо: Меню -> Зображення -> розмір зображення. Запам'ятовуємо розмір картинки.
5. Верхнє горизонтальне Меню -> Файл -> Новий. Для нового документа пишемо розміри, як у картинки з конем (у мене 84х84), вміст - «прозорий».
6. Вибираємо інструмент «Переміщення» та перетягуємо коня в новий документ. Перетягувати треба, натиснувши інструментом «переміщення» по коню, щоб зробити картинку активної і перетягнути потім в новий документ.
8. Тепер необхідно зробити так, щоб кінь помістився в банері. Далі йдемо: верхнє горизонтальне Меню -> Зображення -> розмір зображення. Пишемо висоту 60 (по висоті нашого банера). Зверніть увагу, щоб внизу стояла галочка «зберігати пропорції». Тиснемо «ОК», при цьому картинка повинна змінити розміри.
9. І знову інструмент «переміщення», натискаємо на коня зі зменшеним розміром, щоб зробити картинку активної, і перетягуємо його на банер. Розміщуйте картинку там, де потрібно. У нашому випадку я помістила її справа.
10. Залишилося написати текст. Вибираємо інструмент «Текст» і колір тексту, як в пункті 2. Для нашого випадку це білий. Пишемо, наприклад, «Підпишіться на RSS-стрічку». Інструментом «переміщення» ви можете встановити текст так, як вам це потрібно.
Вітаю. Наш банер готовий! З гордістю використовуйте своє творіння. Наступного разу я розповім, як зробити анімований банер.
І ще: тут можна скачати безкоштовно заготовки для банерів, шпалери і кнопки.
Навігація по публікаціям
URL може бути моєї сторінки будь-?
Марина, я на вас розраховую, зареєструєтесь в партнерку 50% поставлю, тільки помгіте розібратися з банерами, дійсно у мене в проекті ще три партнерки. так, що замовляти, це на мою нерозумно, тут Ви маєте рацію, простіше ні від кого не залежати
Вибачте, що багато пишу, у мене платний хостинг, я можу створити там окремий блог, для зберігання всіх картинок і звідти брати посилання. Тоді банери будуть на будь-якій сторінці в неті висвітлюватися. Загалом, вся проблема в тому, що ніфіга не получається і не знаю, як запитати.
ось, що я за код зробив, але нічого не працює
Після цього знову з нового рядка вставляєте код вашого банера, який робиться як пояснила Марина ...
Тепер розберемося з другим питанням. Гаджета зовсім ніякого не треба ... Просто вставляєте код як звичайний текст, але не там де прописувати НТМ, а де пишеться тільки текст.
P.S: Якщо я погано пояснюю то вибачте 🙂 Я не намагаюся будувати з себе професіонала цієї справи, я ним не є, сподіваюся Марина ви не проти того що я тут за вас трохи відповів?
К сожелению сдесь в Коментар воно не надрукувало:
типу вигляду сторінки, розміру тексту і т.д. тоді з нового рядка набираєте:
Після цього знову з нового рядка вставляєте код вашого банера, який робиться як пояснила Марина ...
Шкода але я тут безсилля ... Показат команду я не зможу, покрали НЕ міру тут ... .Дайте мені вашу пошту я туди напишу ще раз ...
Анна, питання буде незрозумілий до тих пір поки за пояснення не візьметься який-небудь «чайник» на зразок мене, але який все-таки сам дійшов, правда основний штовхає силою був цей сайт з його хозяйкой.Но поки не буде покрокового прискіпливого пояснення питання будуть і дальше.Ну для початку щось що вони тут називають сервером - то це звичайна вебстраніца або сайт, або блог до інструментів управління якого у вас є доступ.Ви повинні розуміти що цих місця у вас має бути два.Об'ясню почему.На першу вебстраніцу ви вставляєте ті файли, які ви з поранили з фотошопа для того щоб побачити саму болванку html-кода.Ну для точності пояснюю-допустимо нехай сервером для вставки банера і отримання коду у вас буде наприклад ваш щоденник в livejournal.Заходіте в режим-нова запісь.Откроется сторінка для редактірованія.Там два режиму-html і обичний.виберіте обичний.Методом вставки картинки завантажуєте файл (збережений з фотошопа) .Баннер загрузілся.Переключаете в html-режим - бачите код баннера.Меняете перший http в коді на той на який повинен виводити банер і вставляєте цей код на сайт який ви і х отелі.Пара цих сайтів може бути будь-який як ви розумієте ...
А що у мене вийшло можна подивитися тут - hvadimraz. livejournal. com
Вадим, спасибі за допомогу і роз'яснення установки банера на безкоштовному хостингу, але тільки не треба вводити в оману моїх читачів, поясненням того, що таке сервер. Сервер - це, просто кажучи, той же комп'ютер, але тільки значно більших розмірів, який надає місце для зберігання інформації. Тому коли йдеться про те, що банер треба записати на сервер, то це, значить, що ви повинні мати місце на одному з серверів. Можна записати на безкоштовний сервер radikal. ru, а потім скласти html-код.
І вам спасибі, але скажіть ніж радикал як сервер відрізняється від яндекса (по
суті), google.com, і ін. ну може більше структорізованним.В суті не бачу різниці, а значить якщо немає різниці, то чому вводжу в оману.
Ну да, блог (сайт) на сервері-це не сервер ... Ту ж процедуру виконав на платному домені, все получілось.Маріна, якщо хочете розмістіть код отриманий за допомогою liveinternet і livejournal на своєму сайті і банер буде работать.Вибірать сервер потрібно не по тому-сервер це чи ні, а за принципом-наскільки він долговечен.Ведь коли сервер закривається (на якому розміщували файли банерів) то банера на вашому сайті перетворюються на порожні рамки з запитаннячком посередині.
Та й коли всетаки відбувається закриття серверів, адже все в світі не вічне, пам'ятайте-зберігайте файли своїх банерів на своїх комп'ютерах, щоб повторити цю процедуру на іншому сервері / сайті / блозі ...
Спасибі, Вадим, все картинки і банери я розміщую на хостингу, де знаходиться мій блог.
ось я так прикинув і кажись понел як робити банер, ви мені скжіте пожалуйсто а за допомогою кокого фотошопа треба це робити? або можна використовувати будь-який фотошоп?. =)
Q-ItS, будь фотошоп
Марина, а я і не пропонував вам ваші файли тримати на іншому хостінге.Я вам запропонував спробувати вставити на свій платний хостинг-код отриманий на безкоштовному хостінге.Ви ж тут пишіть в невірі, що процедура на платному і безкоштовному-отлічаются.А я будучи наданими але прагматичним домігся результату, тому наполягаю-процедура одінаковая.І як вона може відрізнятися якщо вставка коду на сайт в платному хостингу та ж що і на безкоштовному, а процедура отримання коду • описати вами так само відбувається на безкоштовному сервере.Ваш сайт переглядають і т е хто користується безкоштовними хостингами, так що для них-ви вводите в заблужденіе.На радикала теж є-особистий кабінет (це і є-вебстраніца на сервері) чим вона відрізняється від щоденників, блогів і т.п.которие теж знаходяться на серверах і в комплексі-є єдиним сервером зберігання файлов.Еслі на розміщеному файлі можна побачити код, так чомусь б не використати цю вебстраніцу-як сервер.
Все зрозуміло, але Марина можете мені дати посилання на скачування фотошопа? А то де тільки не шукав, все через смс або платно :(
Ось сайт -www.artbanner .com.ua на якому є конструктор банерів як статичних (простих) так і двошарових ... З миттєвим генератором коду ... І не парся більше ... Фотошоп-це добре, але зробити задоволення простим-це вже наша робота ... Якщо потрібно щось покруче (конструктори гіф, іконок, що біжать рядків, анімованих ваших фото, самописних текстів) звертайтеся на мій ящик [email protected] (для блондинок і сподобалися мені людей-безкоштовно) ...
Марина здрастуйте, зробив на вашу уроку банер, розмістив його в кореневій папці хостингу, вводжу в рядку браузера шлях до банера, і вискакує віконце із запитом на аутентифікацію, Беннер можу бачити тільки після введення ника і пароля, як це можна обійти, інакше як я розумію ніхто не зможе побачити мій банер без імені і пароля? а давати доступ до сервера хостера не хочеться.
Андрій, але я не бачу лічильників на вашій сторінці. Всі шаблони вордпресс розрізняються між собою. Але, якщо просили перед лічильником, то швидше за все це не індексний файл, а футер. Подивіться, де стоїть лічильник в футере і поставте перед ним. Більше нічого не можу сказати, не бачачи шаблону
Спасибі величезне, Марина!
Чудовий, зрозумілий урок. Ніколи не думала, що зможу намалювати сама банер. З Вашою допомогою це вийшло.
Дякуємо!
Хто банери ставить, поясніть мені будь ласка як це правильно зробити!
У мене є інструкції, але мені не ясно.
Збірку роблю на шаблонах від Темплейтмонстер. Зараз у мене Zen-cart. Офіційний сайт взагалі не йде на контакти, відсилають на форум, а там американці, і все англійською.
Я знаю, що банери змінюються легко, і ставляться відразу, а не виходить. Движок варто англійською, малюнок я зберігаю англійською, дозвіл роблю 940х1002 пікселів. Загальна вага банерів шаблону 87-90 кб, у мене вага 140-150кб. Там, якісь посилання треба вказати, я в них не можу розібратися. Може через посилань? Взагалі збірку всю роблю на сервері через хостинг.
Відкриваю сайт через хостинг, а в браузері він не відкривається, набираю по-різному - йде скидання. Може мені спочатку установку шаблону треба було робити не через хостинг, а відразу в браузері - в інструкції так, і написано: пишемо в рядку браузера .... і виробляємо установку. Але у мене і через панель адмін хостингу все встановлюється добре. Малюнки по товару міняти розібрався, а з банерами на головній сторінці ні як.
Марина, добрий день. Я по вашій статті робила банер, але у мене версія 3 фотошопа. Можливо не виходить переміщення картинки в банер.