Как быстро сделать меню группы в контакте, несколькими пощёлкиваниями мышкой.

И так поехали. Как создавать группу и редактировать меню,Вы уже знаете. Необходимо будет загрузить свои картинки.Можете, конечно нарисовать.

Кликабельно

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

1. Загружаем в мои фотографии картинки. 6 штук- шесть опций. Заходим в редактировать меню—исходный код—и вставляем вот такой код:

{|

|-

| [[photo172950652_284976948|74x75px|club40124635]]

| [[photo172950652_285020971|75x75px|page-40124635_43916382]]

| [[photo172950652_284976395|75x75px|page-40124635_43914507]]

|-

! [[club40124635|ГЛАВНАЯ]]

! [[page-40124635_43916379|Обсуждения]]

! [[page-40124635_43914507|Аудио]]

|-

| [[photo172950652_284976747|75x75px|page-40124635_43916427]]

| [[photo172950652_285021697|75x75px|page-40124635_43916431]]

| [[photo172950652_284976766|75x75px|page-40124635_43916433]]

|-

! [[page-40124635_43916427|ВИДЕО]]

! [[page-40124635_43916431|Новости]]

! [[page-40124635_43916433|Фото]]

|}

Вам необходимо поменять строчки отображающие аватаркии меню:

[[photo172950652_284976948|74x75px|http://vk.com/club40124635]]

Где:

1.Это номер картинки, которую Вы загрузили в фотоальбом. Где его взять. Идём в мои фотографии жмём на картинку и в верхней строке браузера копируем вот эти циферки.

2.Это размер аватарок меню

3. Это адрес нашей страницы. Необходимо это для того,что бы пользователь нажимая на аватарку меню группы в контакте попадал на соответствующую страницу.

Где взять адрес?

Идем опять в исходный код нашего меню. И прописываем вот такой код:

[[Главная]]

[[Обсуждения]]

[[Аудио]]

[[Видео]]

[[Новости]]

[[Фото]]

Нажимаем на предосмотр, и видим наши страницы ссылки.

Кликабельно

С главной всё понятно- её создавать не надо – просто скопируйте адрес в браузере нажав на опцию --группа.

Нам примере страницы обсуждения: нажимаем правой кнопкой мыши –открыть в новом окне. Далее попадаем на страницу чистую.

Кликабельно

Жмём на редактировать и в строке браузера опять копируем page и вот такие цифры.

Знаки после цифр копировать не надо.

И вставляем эту ссылку вот сюда:

То есть, первые три строки это фотографии меню одновременно являются ссылками.

Следующие три строки- ссылки нашего меню. Тут необходимо опять прописать. Нажимаем на аватар меню- копируем page и цыфры.

То же самое проделываем со второй строкой меню: видео,новости фото.

Первые строки активируем аватарки, вторые три строки – активируем ссылки меню.

Незабываем после предосмотра, нажимать кнопку сохранить. Контольный выстрел: по нажимать на аватарки меню и на ссылки под ними.Если всй сделано правильно,то должна быть переадресация на нужные нам страницы.

Если данное таинство не свершается присмотритесь внимательно к исходному коду- не забыли ли где поставить скобочку или лишнюю запятую.

Ну вот,теперь любому в Вашей команде,кто умеет подчинить своим пальцам мышку, сделать меню для группы в контакте в полне посилам.Без всякого фотошопа и wiki разметки.

Рецепт подготовления меню группы для Вконтакте

Здравствуйте! Дорогие посетитель блога ARTtime Сегодня я раскажу Вам как сделать меню группы Вконтакте. Не зря я затрагиваю эту тема так как ВК был, есть и будет самой популярной социалкой ру-нета! И многие уже сталкивались, а кто то столкнется с проблемой как правильно разместить меню для группы. Кстати, группа на картинке моя… Я там кредитки и советы раздаю

Дополнение от 20.09.2013. Технологии не стоят на месте, и Вконтакте появилась возможность делать красивые открытые меню для группы. Так что приглашаю посмотреть статью на эту тему - Как сделать всегда открытое меню для вконтакте.

Собственно в чем же проблема, а проблема в том что для создания такого меню не достаточно красивой картинки. Чтобы все кнопки Функционировали, наше будущие меню нужно порезать на части, а точнее на полоски!

Приступим к делу! Наше будущее меню открываем в фотошопе, для примера я выбрал старую запылившуюся картинку еще одной группы. Дальше все просто, берем инструмент “ раскройка “

И начинаем выделять область наших будущих кнопок:

Практически готово, осталось правильно сохранить наше меню… Для этого идем в “ Файл – Сохранить для Web и устройств ” или же комбинация клавиш “Alt+Shift+Ctrl+S ” Только не повредите руку! Все же придется нажать четыре клавиши одновременно

Вверху я обозначил стрелочками настройки которые я применил, взамен JPEG формата можно выбрать и GIF или же PNG, на ваш вкус И жмем кнопку сохранить “ Save ” та что внизу. В открывшемся окне дайте имя файлу и выберете место куда нужно сохранить нашу картинку.

Видите все аккуратно лежит в папке, к тому же еще и пронумеровано! Дальше нужно скинуть все эти изображения Вконтакт, в альбом группы или в свой личный альбом и прописать в группе Wiki разметку… Можете посмотреть примерный код который я использую:

[[photo-20070034_253533413|386px;noborder;nopadding|page-20070034_29865434]]

[[photo-20070034_253533414|386px;noborder;nopadding;nolink|1]]

[[photo-20070034_253533502|386px;noborder;nopadding|page-20070034_29885140]]

[[photo-20070034_253533503|386px;noborder;nopadding;nolink|1]]

[[photo-20070034_253533504|386px;noborder;nopadding|http://vkontakte.ru//topic-20070034_23111244]]

Там все предельно просто, вот эта часть кода ” [[photo-20070034_253533413 " адрес нашего изображения.

Это " | 386px;noborder;nopadding " ширина а также " noborder " указывает на то что картинку нельзя обводить полями.

А "nopadding " говорит о том что картинка не должна иметь отступов.

Вот эта строчка" |page-20070034_29865434]] ” адрес куда будет направлять нас картинка точнее кнопка…

Что то меня понесло, я надеюсь Вы поняли как делать меню группы Вконтакте. Ну а если вы ленивый жук, за небольшую плату всем этим могу заняться я, от дизайна до верстки кода.. Контакты вот тут

Начнём с того, что нужна красивая аватарка для группы. Она должна отражать суть данной группы, здесь нужна только ваша фантазия и соответсвенно фотошоп где будут твориться ваши идеи. Не забываем, что максимальные параметры для аватара группы составляют 200 на 800 пикселей.

--

Теперь перейдём непосредственно к меню: Во первых нужно готовое меню сделанное в фотошопе. Я обычно беру размер 600 на 600 пикселей, но можно сделать меню намного больше (шире и длиннее). На кнопках можно написать всё что угодно (аудио, видео, новости и т.д). Обратите внимание, что размер меню на главной не должен превышать 390px в ширину, если кнопки баннерные (одна на всю строку). Если у вас два и более столбца, то размер меню будет ~375px. Это оптимальный размер.

--

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

--

После того, как меню и аватар готовы, начинаем редактировать: редактируем информацию группы, загружаем на фото группы сделанный нами аватар. Далее включаем новости (это наша песочница, где будет настраиваться меню), новости можно переименовать, например – навигатор. Далее загружаем СТАНДАРТНЫМ ЗАГРУЗЧИКОМ наше разрезанное меню в альбом группы.

--

После загрузки в альбом: всё, что вам понадобится – это тег “ nopadding ”. Обратите внимание, что при наличие этого тега пропадают не только пробелы, но и рамки, значит тег “noborder” вам не понадобится. Вставляете его в код так же, как и остальные теги:
[[photo123_456|nopadding;123px| ]] (это пример)

Далее уже идёт проверка ваших знаний на вики разметках в контакте!

--КЛАСС!!

В сегодняшней статье речь пойдет исключительно про группу вконтаке, хотя в большей части, я предпочитаю работать с публичными страницами. Но когда в прошлой статья я затронул как сделать меню в группе вконтакте на примере своего паблика, у многих возникли вопросы, именно про меню для группы.

Дата добавления: 2015-07-20