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

Как сделать красивое меню для группы ВКонтакте

Подготовительные работы

Перед тем как создавать ссылки на разделы группы, следует их активировать. В противном случае в сообществе будут отсутствовать вкладки с фотографиями, аудиозаписями, обсуждениями, документами и прочим.

Инструкция по активации разделов:

  • Перейти в список Групп. Затем переключится на вкладку «Управление» и выбрать сообщество, в котором у пользователя есть права администратора.

Меню группы ВКонтакте 1-min

  • Под аватаркой группы нажать по ссылке «Управление».

Меню группы ВКонтакте 2-min

  • В блоке справа кликнуть по строке «Разделы».
  • Напротив каждого раздела нажать по надписи «Выключены» и выбрать режим доступа: ограниченные или открытые. В первом случае добавлять материалы сможет только администратор или редактор, во втором – любой участник группы.

Меню группы ВКонтакте 3-min

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

Создание текстового меню

Простое текстовое меню создается с помощью специального кода. Времени на это уйдет не более 5 минут. Последовательность действий:

  • На главной странице группы, сразу под названием, перейти на вкладку «Свежие новости».
  • Открыть режим редактирования wiki-страницы, нажатием на соответствующую кнопку.

Меню группы ВКонтакте 4-min

  • В первой строке сменить название вкладки. В нашем случае это будет «Меню».
  • Используя значок <> в правой части панели инструментов, переключиться на режим wiki-разметки.

Меню группы ВКонтакте 5-min

  • В нижнее поле вставить код: *[http://vk.com/|Пункт меню].
  • Повторить вставку с новой строки в количестве разделов будущего меню.
  • Заменить ссылки и текст в соответствии со своими разделами и их названиями. Для перехода в визуальный режим редактирования следует повторно нажать значок <>.
  • Кликнуть по кнопке «Сохранить страницу».

Меню группы ВКонтакте 6-min

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

Создание графического меню

Чтобы создать красивое меню потребуются базовые навыки обращения с графическим редактором. В данном примере работа будет построена на программе PhotoShop. Если опыта нет – можно четко следовать инструкции и использовать представленные параметры.

Как сделать дизайн графического меню:

  • Через поисковую систему отыскать изображение, которое послужит фоном для текста. Его размеры не должны быть меньше, чем 610х450 px.
  • Запустить PhotoShop.
  • Открыть меню «Файл» и кликнуть по строке «Создать».

Меню группы ВКонтакте 7-min

  • Указать размеры холста (610х450 px) и разрешение (100px). Остальные параметры оставить прежними. Кликнуть «Создать».

Меню группы ВКонтакте 8-min

  • Открыть проводник Windows, найти загруженное изображение и перетащить его в окно программы.
  • Растянуть картинку до размеров холста и нажать Enter.
  • Открыть меню отображения слоев. Кликнуть правой кнопкой мыши по одному из них, после чего выбрать пункт «Объединить видимые».

Меню группы ВКонтакте 9-min

  • В панели инструментов, расположенной в левой части окна, выбрать «Прямоугольник». Начертить объект, который в будущем будет играть роль кнопки меню. Таких объектов нужно создать в количестве разделов. Важно чтобы «прямоугольники» были одинаковыми.

Меню группы ВКонтакте 10-min

  • В списке отображения слоев, выбрать слой с прямоугольником. Нажать ПКМ и кликнуть по строке «Параметры наложения». Затем изменить внешний вид слоя, используя представленные в открывшемся списке инструменты.

Меню группы ВКонтакте 11-min

  • Когда все прямоугольники настроены, следует активировать инструмент «Текст». После включения потребуется отчертить область текста и вписать туда название пункта меню. Операция повторяется для остальных строк. Размер текста и его стиль выбирается исходя из личных предпочтений. Главное – чтобы надпись помещалась в отмеченное место.

Меню группы ВКонтакте 12-min

  • В боковом меню выбрать инструмент «Раскройка».
  • Выделить кнопки, учитывая высоту всего холста.

Меню группы ВКонтакте 13-min

  • Теперь осталось сохранить элементы будущего меню. Для этого: открыть «Файл» и выбрать «Сохранить для web».

Меню группы ВКонтакте 14-min

  • Указать место на диске компьютера.

Меню группы ВКонтакте 15-min

После того как удалось создать картинку для каждого пункта меню, можно приступать к непосредственной публикации:

  • Открыть wiki-страницу и перейти в режим редактирования, как указано ранее.
  • На панели инструментов нажать на иконку фотоаппарата и выбрать загрузку с диска.

Меню группы ВКонтакте 16-min

  • Указать созданные ранее картинки.
  • Дождаться их загрузки на сервер. Когда это произойдет, в поле будет вставлен код.

Меню группы ВКонтакте 17-min

  • Отредактировать код следующим образом:
    • Установить ширину картинки 600px.
    • После размеров изображения добавить «;» и вставить параметр «nopadding|». Благодаря нему будут удалены разрывы между картинками, что создать видимость цельного изображения.
    • После вертикальной черточки «|» вставить ссылки на разделы группы.
  • Сохранить созданные изменения. Также перед переходом на другую страницу рекомендуется сохранить код в текстовый документ на компьютере. Это позволит восстановить меню при возможном сбое сохранения.

Меню группы ВКонтакте 18-min

Справка. Непосредственно на панели инструментов находится значок «i», который открывает инструкцию по разметке wiki-страницы. Там можно найти пояснения по созданию различных эффектов текста и списков, вставке цитат и т.д.

Подведем итоги. Если есть сложности в понимании принципов работы с разметкой wiki-страницы, то лучше создать ссылки, попросту заменив нужные участки кода. Графическое меню выглядит более привлекательно, но требует познаний, как в работе редактора кода, так и графической программы. Для начала рекомендуется создать простое меню, а дальше попытаться его улучшить в соответствии с представленными в статье инструкциями.