| WOLF
|
Дата: Четверг, 28.06.12, 07:07:42 | Сообщение # 1
|
|
|
|
Ваше желание:
|
|
| |
|
Я тут недавно озадачился оформлением своей группы В Контакте. Видел много красиво оформленных групп и захотелось сделать что-то подобное. После нескольких часов изучения Вики разметки я наконец сделала для себя красивый баннер и графическое меню, ведущее сразу на страницы моего сайта. В двух словах как это делается. Сначала в фотошопе одновременно создаются две картинки, потом одна из них нарезается на несколько частей. Далее на страничках редактирования В Контакте вставляется специальный код с внешними
Шаг 1.
Создаем в фотошопе новый документ размером 630х725 пикселей, заливаем его белым цветом. Теперь нам надо вырезать в слое два окна, через которые будет проглядывать собственно само графическое оформление. Сначала выделяем прямоугольник размером 200х710 пикселя и нажимаем Del. Потом выделяем прямоугольник размером 382х442, совмещаем прямоугольники по низу, и также нажимаем Del.
Шаг 2.
Теперь под этим слоем располагаем все наше графическое оформление. В данном случае я положила картинку с основным фоном, потом написала текст, и потом в левом прямоугольнике создал пять пунктов меню.
Шаг 3.
Теперь правый прямоугольник сразу же сохраняем отдельной картинкой размером 200х710 пикселя. Это уже готовая картинка для оформления группы. Она загружается в блок в правом верхнем углу группы, где написано «Загрузить фотографию». А левую картинку надо нарезать на несколько картинок по количеству пунктов меню. В данном случае это 5 картинок шириной 382 пикселя и высотой не меньше, чем 50 пикселей.
Шаг 4.
После этого загружаем наши пять картинок в основной альбом вашей странички В Контакте: Мои фотографии > Мои альбомы > Добавить фотографии. Потом идем на страничку группы и сразу под описанием группы выбираем блок «Новости», по-моему так он называется в оригинале. Я его переименовала в «Меню группы». Нажимаем «Редактировать».
Шаг 5.
Сразу же переходим на закладку «Исходный код». Визуальным редактором я бы вам не советовала пользоваться, поскольку он всегда сбрасывал все настройки. Копируем код, расположенный в окошке ниже и вставляем его в «Исходный код». А вот далее вам в коде надо будет заменить photo на названия ваших файлов, указать высоту вашего файла (ширина уже задана 382px) и выставить урл ссылок вашего меню. Имя файла можно взять в вашем альбоме. Если открыть картинку то она будет иметь приблизительно такой урл http://vkontakte.ru/photo72160765_272239413. Вот все что начинается с photo и есть название картинки.
Доступно только для пользователей
Шаг 6.
Обратите внимание, для того, чтобы картинки совместились, вам надо сделать название группы в 1 строку, описание группы в 10 строк и урл вашего веб-сайта в 1 строку. Щелкните по картинке, чтобы посмотреть, как это все выглядит в реальности. Ну и соответственно присоединяйтесь к моей группе В Контакте.
Короткая ссылка на этот пост: http://www.designonstop.com/?p=6209
| |
|
|
|
Всего: 31315
За месяц: 0
За неделю: 0
Новых вчера: 0 
Новых сегодня: 0
Малышей: 29482 
Детишек: 1710 
Помощников: 7
Инквизиторов: 2
Замов.админа: 1
V.I.P: 15
Парней: 9480
Девушек: 21835 
