Меню для группы ВКонтакте пошаговая инструкция. Основы оформления группы ВКонтакте с использованием вики-разметки

Содержание
  1. Читайте также
  2. Актуальные размеры изображений ВКонтакте
  3. Размер аватара ВК
  4. Обложка
  5. Прикрепленные изображения
  6. Изображения для постов со ссылкой
  7. Изображение для статьи, созданной в редакторе
  8. Размер фото и видео для историй
  9. Размер обложки фотоальбома
  10. Размер изображения для видео
  11. Wiki-страница
  12. Как сделать так, чтобы изображения ВКонтакте не сжимались? Влияние фона и размера на качество картинки.
  13. Как стилизовать заголовок страницы
  14. Обложка
  15. Обложка + описание сообщества + ссылка на веб-сайт
  16. Описание с хэштегами
  17. Закрепленный пост, рассказывающий, о чем эта страница
  18. Открыть меню группы
  19. Меню группы закрыто
  20. Групповое меню
  21. GIF и аватар в одном изображении
  22. Скрытое меню
  23. Автоматически. воспроизведение видео
  24. Как добавить такое видео в шапку своей страницы?
  25. Пост, который получает много репостов
  26. Анонсы новых клипов, альбомов, событий
  27. Презентация новых товаров/услуг
  28. Скидки и акции
  29. Кейсы, отзывы покупателей
  30. Реклама приложений
  31. Розыгрыши
  32. Правила сообщества
  33. Ссылки на другие социальные сети
  34. Какой должен быть аватар
  35. Миниатюра аватара
  36. Какую информацию можно разместить на миниатюре аватара
  37. Объявление о новом продукте/услуге/событии
  38. Преимущества компании/услуги/страницы
  39. Номер телефона компании
  40. Выгодные цены
  41. Бесплатная доставка
  42. Акции
  43. Конкурсы
  44. Вакансии
  45. Что должен быть сам аватар?
  46. Какую информацию можно разместить на аватаре?
  47. Домен сайта
  48. Телефон/адрес/часы работы
  49. Конкурсы/акции
  50. Самые покупаемые товары/новинки
  51. информация о доставке
  52. Реклама мобильных приложений
  53. Основные преимущества компании/страницы/продукта и т.д.
  54. Обновление ассортимента/новое творчество и т. д.
  55. Информация о том, что ваше сообщество является официальным
  56. Информация о предстоящих событиях
  57. Адреса аккаунтов в других социальных сетях
  58. Расширенное описание страницы
  59. Брэгс
  60. Как создать слитный аватар и меню
  61. Как использовать виджеты
  62. Как стилизовать изображения для сообщений
  63. Где взять хорошие изображения?
  64. А что делать тем, кто не умеет работать в фотошопе?
  65. 1. Fotor.com
  66. 2 . Canva.com
  67. Как форматировать статьи в редакторе
  68. Как использовать вики-разметку
  69. С чего начать?
  70. Путь №1. Заказать создание меню у специалиста-дизайнера
  71. Путь №2. Использование онлайн-конструктора
  72. Путь №3. Все делать самому
  73. Шаг №0. Общая информация о том, как устроены меню группы ВКонтакте
  74. Шаг 1. Подготовительный этап
  75. Шаг № 2. Делаем простое меню для группы ВКонтакте
  76. Шаг № 3. Где Могу ли я размещать вики-страницы ВКонтакте
  77. Шаг №4. Как сделать меню в группе ВКонтакте. Графика
  78. 3 шага к красивому общедоступному меню !
  79. Шаг № 1: создайте внутреннюю страницу меню
  80. Шаг №2: создайте пост на стене
  81. Шаг № 3: исправьте сообщение
  82. Что такое Wiki Markup?
  83. Методы создания вики-разметки
  84. Работа с изображениями
  85. Как мне создавать таблицы с использованием вики-разметки?
  86. Создание группового меню в социальной сети ВКонтакте с использованием вики-разметки: пример реализации
  87. Важность вики-разметки при продвижении вашего проекта
  88. Заключение
  89. Как сделать меню в группе ВК
  90. Способы сделать меню в паблике Вконтакте в новом версия
  91. Способ 1. Функционал Photoshop + Вконтакте (меню DIY)
  92. Способ 2. Сервис «Menumake» — помогает быстро составить меню
  93. Заключение

Читайте также

Как установить MIUI9: описание для телефонов Xiaomi
Почему мой телефон Xiaomi не включается?
Забыли пароль к учетной записи Mi — Простое решение проблемы
Разблокировка загрузчика устройств Xiaomi Mi unlock достигает 50 что делать
Обновление Прошивка HTC One

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

Актуальные размеры изображений ВКонтакте

Некоторое время назад разработчики социальной сети «ВКонтакте» запустили новый дизайн … Это привело к тому, что размер изменились принципы отображения изображений. Памятка, которая будет представлена ​​ниже, соответствует всем нововведениям и содержит размеры, актуальные на данный момент времени.

Теперь давайте более подробно рассмотрим каждый пункт.

Размер аватара ВК

Минимальный размер аватара — 200 х 200 пикселей. Если вы попытаетесь загрузить изображение шириной или длиной менее 200 пикселей, вы увидите следующую ошибку:

Максимальный размер аватара составляет 200 x 500 пикселей. Но, в принципе, можно загружать изображения и большего размера — до 7000 пикселей с каждой стороны. Главное, чтобы соотношение их сторон не превышало 2 к 5.

Я вам покажу на примере.

У меня есть изображение. Его размер составляет 200 на 800 пикселей (соотношение 2 к 8). При загрузке ошибок не возникает. Однако я все еще не могу использовать это изображение, так как «Контакт» не позволяет мне полностью выделить его.

Обложка

Размер обложки для полной версии сайта составляет 1590 x 400 пикселей.

Обратите внимание: в мобильной версии и приложениях не полная версия обложки отображается, но только его часть размером 1196 на 400 пикселей. Посмотрите, как он обрезается в мобильном приложении:

Чтобы Чтобы этого не произошло, разместите основные элементы обложки в пределах 1196 на 400 пикселей.

Прикрепленные изображения

В обновленном дизайне« Контакт »ширина ленты новостей стала фиксированной.. Это означает, что изображения, прикрепленные к сообщению, больше не растягиваются, а остаются такими, какие есть. Следовательно, если вы хотите, чтобы ваше изображение полностью заполняло отведенное ему пространство в ленте новостей, его ширина должна быть не менее 510 пикселей. Лучше всего, если это будет квадрат или прямоугольник в альбомной ориентации.

Звучит немного запутанно 🙂 Итак, я покажу вам пример.

Давайте скажем, у нас есть квадратное изображение со сторонами 510 пикселей. Если мы прикрепим его к нашему сообщению, он будет очень хорошо смотреться в ленте новостей на всех устройствах:

А вот так выглядит горизонтальное изображение в альбомной ориентации (ширина 510 пикселей):

Как видите, чем уже изображение (по высоте), тем меньше оно выглядит в ленте смартфонов. Чтобы убедиться в этом, посмотрите на картинку ниже:

Это Понятно, что разница здесь не особо критична, и пользователи смартфонов все равно будут рассматривать ваше изображение, просто во втором случае им будет немного удобнее.

Изображения для постов со ссылкой

Все эти данные взяты из Open Graph код разметки:

Если Open Graph не указан, заголовок взят из метатега Title, а изображение — из статьи. При этом его можно легко изменить — или выбрать другое изображение из статьи с помощью специальных стрелок:

Или загрузите свой:

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

Изображение для статьи, созданной в редакторе

Размер изображения для обложки статьи, созданной в редакторе, составляет 510 на 286 пикселей. Лучше, если он будет темным и более-менее одноцветным, так как на светлом фоне теряется название статьи и сообщества.

Хороший пример:

Не лучший пример:

Размер фото и видео для историй

размер фото — 1080 на 1920 пикселей. Размер видео составляет 720 на 1280 пикселей.

Характеристики видеозаписей:

  • до 15 секунд;
  • не более 5 МБ;
  • кодек h.264;
  • звук aAC.

Истории должны использовать фото и видео в вертикальном формате.

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

Размер обложки фотоальбома

Размер изображения для видео

1280 на 720 пикселей.

Wiki-страница

Область содержимого вики-страницы имеет ширину 607 пикселей. Если вы загрузите изображение большего размера, оно автоматически загрузится в ширину 400 пикселей. Пример: у меня есть изображение 1366 на 768 пикселей. Если я добавлю его на вики-страницу, он будет выглядеть так:

Чтобы изменить размер картинки, вам нужно щелкнуть по ней и установить нужные значения:

Я подробно опишу, как работать с вики-страницами ниже. Поэтому мы не будем здесь останавливаться на этом моменте.

Как сделать так, чтобы изображения ВКонтакте не сжимались? Влияние фона и размера на качество картинки.

Если вы когда-либо пробовали загружать изображения ВКонтакте (неважно, аватар ли это или просто фото из вашей поездки), то вы, наверное, уже знаете, что они имеют тенденцию к усадке. Особенно это заметно на темном (и особенно на красном) фоне и когда картинка не слишком большого размера … Пример:

Как сделать так, чтобы качество картинки не ухудшилось?

Чтобы изображение не сжималось (точнее, сжималось, но в гораздо меньшей степени), необходимо сделать его в 2–3 раза больше необходимого. Например, если нам нужно сделать аватар размером 200 на 500 пикселей, мы делаем снимок размером 400 на 1000 пикселей. Если вам нужно сделать меню 510 на 400 пикселей, возьмите 1020 на 800.

Изображение на темно-синем фоне, которое я привел чуть выше, имеет размер 510 на 350. I увеличил вдвое (1020 на 700) и сэкономил. Вот что из этого получилось:

Как исправить? Ответ очень прост — нужно выбрать другой фон. Дело в том, что на темном фоне пиксели видны лучше, чем на светлом. Поэтому, если вы хотите добиться идеального качества (хотя картинка выше уже выглядит вполне нормально), то вам нужно немного изменить цветовую схему. Например, сделайте фон белым, а текст синим:

Как стилизовать заголовок страницы

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

Обложка

Не так давно ВКонтакте представил обновление — теперь можно загружать большие и красивые обложки на страницах (1590 x 400 пикселей). Для этого перейдите в «Настройки» и нажмите кнопку «Загрузить».

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

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

Примеры динамических скинов:

Обложка + описание сообщества + ссылка на веб-сайт

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

Описание с хэштегами

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

Закрепленный пост, рассказывающий, о чем эта страница

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

А вот что видит пользователь после перехода по ссылке:

Открыть меню группы

Открытое меню Я вызываю такое меню, которое сразу показывает какие пункты это состоит из. То есть изображение предварительного просмотра сообщения вики полностью дублирует его содержание. Таким образом, пользователи сразу видят, что их ждет внутри. Я покажу вам пример.

Вот как закрепленный пост выглядит в заголовке Flatro:

Меню группы закрыто

Закрытое меню — это та же запись вики, что и в предыдущем абзаце, только в объявлении есть картинка, на которой нет пунктов меню. Обычно на нем пишут: «Меню», «Меню навигации» или «Навигация по общедоступным материалам».

А вот что мы видим, когда нажимаем на него:

Кстати, следует отметить, что это не единственные варианты. В принципе, вы можете написать на этой картинке все, что захотите. Главное, чтобы пользователь хотел по ней кликнуть, и он понимал, что его ждет после этого. Пример:

Групповое меню

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

GIF и аватар в одном изображении

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

Кстати, я видел этот пример в группе SMM-маркетолога Сергея Шмакова. Итак, за находку выражаю ему огромную благодарность 🙂

Скрытое меню

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

Автоматически. воспроизведение видео

В конце ноября 2015 года в социальной сети ВКонтакте появилось интересное нововведение — как только пользователь заходит на вашу страницу, видео, прикрепленное к шапке, начинает воспроизводиться автоматически. С помощью этой техники вы можете привлечь еще больше внимания пользователей (особенно тех, кто впервые посетил вашу страницу), и при этом не раздражать тех, кто не любит, когда им навязывают их контент, потому что видео воспроизводится без звука и практически не мешает …

Как добавить такое видео в шапку своей страницы?

Для этого необходимо выполнение трех условий быть встречено:

  • Прикрепите видео к сообщению и закрепите его в топе сообщества.
  • Кроме видео, ничего больше должен быть приложен к записи. Только видео и текст необязательны.
  • Видео должно быть загружено ВКонтакте — сторонние плееры не поддерживаются.

Пост, который получает много репостов

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

Анонсы новых клипов, альбомов, событий

Презентация новых товаров/услуг

Скидки и акции

Кейсы, отзывы покупателей

Реклама приложений

Розыгрыши

Правила сообщества

Ссылки на другие социальные сети

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

Какой должен быть аватар

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

Миниатюра аватара

  1. Текст на миниатюре аватара должен быть достаточно большим, чтобы его можно было прочитать.
  2. Текст не должен выходить за пределы эскиза.
  3. Пользователи должны понимать, что показано на аватаре.
  4. По возможности лучше не использовать стоковые изображения, поскольку они часто снижают доверие к компании.
  5. Нежелательно, чтобы миниатюра аватара была слишком скучной и скучной, иначе она затеряется на фоне более ярких аватарок конкурентов.
  6. Если вы хотите, чтобы ваш аватар выглядел современно, сделайте его в стиле минимализма: меньше текста, теней, градиентов и элементов, не несущих никакой семантической нагрузки. Ваш аватар должен быть максимально простым и аккуратным. Этот стиль сейчас в тренде.
  7. Если ваша цель — привлечь внимание пользователей и выделиться среди других аватарки в ленте, вам придется включить фантазию. Подумайте, что вы сами ищете, когда ищете интересные сообщества? Например, меня уже привлекли аватары с горящей лампочкой, которая обычно означает, что пришло новое сообщение. Это очень старая техника, но по какой-то причине она все еще влияет на меня — когда я увижу такой свет, я обязательно буду следить за ним.

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

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

Какую информацию можно разместить на миниатюре аватара

Хотя миниатюра аватара очень маленькая, она может (и должна) использоваться для привлечения подписчиков в ваше сообщество. Как это сделать? Давайте рассмотрим несколько вариантов:

Объявление о новом продукте/услуге/событии

Преимущества компании/услуги/страницы

Номер телефона компании

Выгодные цены

Бесплатная доставка

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

Акции

Конкурсы

Вакансии

Что должен быть сам аватар?

Я подумал, каким должен быть эскиз аватара и какой текст можно на нем разместить. А теперь перейдем к самому аватару. Полная версия Аватар будет отображаться только в сообществе, у которого не установлена ​​обложка. Именно для таких случаев я написал этот раздел. Итак, каким должен быть аватар вашего сообщества, чтобы пользователи сразу поняли, что ваша компания подошла к созданию страницы ответственно и профессионально.

  1. Аватар должен быть качественным . О том, как этого добиться, я писал чуть выше. Для тех, кто пропустил эту часть, расскажу в двух словах — размер аватара должен быть в 2-3 раза больше, чем вы планировали.
  2. Желательно, чтобы аватар был совмещен с меню : у него такая же цветовая схема, те же шрифты, элементы и т. д. Благодаря этому заголовок вашей страницы будет выглядеть более аккуратно и профессионально. Пример:
  3. Сам аватар и его эскиз могут отличаться. Например, вы можете нарисовать круг на своем аватаре, оформить его так, как вам нравится, выбрать эту область в качестве миниатюры и стилизовать остальную часть аватара в другом стиле.
  4. Другой вариант — разделить аватар на две части. Один для миниатюры и один для остальной части аватара.

  5. Чтобы побудить пользователей подписаться на вашу страницу или написать сообщение представителю компании, вы можете разместить соответствующий призыв к действию в самом низу аватара и сопровождать его стрелка, указывающая на кнопку.
  6. Старайтесь не размещать на аватаре слишком много информации, иначе он будет выглядеть перегруженным и неопрятным. Добавьте к нему только самые важные моменты и убедитесь, что между ними есть «воздух».

Какую информацию можно разместить на аватаре?

В принципе, вы можете разместить на своем аватаре что угодно. В отличие от миниатюр, здесь действительно есть где побродить. Главное, не злоупотребляйте этим 🙂

Домен сайта

Телефон/адрес/часы работы

Конкурсы/акции

Самые покупаемые товары/новинки

информация о доставке

Реклама мобильных приложений

Основные преимущества компании/страницы/продукта и т.д.

Обновление ассортимента/новое творчество и т. д.

Информация о том, что ваше сообщество является официальным

Информация о предстоящих событиях

Адреса аккаунтов в других социальных сетях

Расширенное описание страницы

Брэгс

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

Как создать слитный аватар и меню

Чтобы объединить аватар и меню, вам потребуется программа Adobe Photoshop или аналогичная. Я объясню весь процесс на примере Photoshop. Итак, вперед.

  1. Загрузите шаблон Photoshop, который я специально подготовил для этой статьи.. Обычный размер (меню — 510 пикселей в ширину, аватар — 200) или увеличенный (меню — 1020 пикселей в ширину, аватар — 400).
  2. Откройте изображение, на котором вы хотите создать основу.
  3. Скопируйте его, вставьте в шаблон и расположите так, как вы хотите вырезать.

  1. Добавить эффекты, текст, графику и многое другое.

  1. Если вам не нужна часть изображения чтобы быть потерянным (в этом пространстве, которое составляет 50 пикселей), переместите его вправо, как показано на следующем гифке:

  1. Выберите инструмент «Вырезание» и нажмите кнопку «Срезы по направляющим».

  1. Удалить ненужные фрагменты (правый клик — «Удалить фрагмент») и редактировать существующие (правый клик — кликнуть в пустом месте — взять нужную область и растянуть до нужного размера).

  1. Перейдите в «Файл» раздел и выберите команду «Сохранить для Интернета».

  1. Перейдите в место, где вы сохранили изображения (рабочий стол или какой-либо конкретный каталог), и найдите там папку с названием «Изображения». Здесь будут ваши изображения. Теперь остается лишь заполнить их на странице.

PS Высота аватара может быть изменена на ваше усмотрение. Я взял максимальный размер — 500 пикселей, но ваше значение может быть меньше. Например, как на странице разметки вики:

Как использовать виджеты

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

Вот несколько примеров того, как виджеты выглядят на странице ВКонтакте:

Как стилизовать изображения для сообщений

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

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

Где взять хорошие изображения?

У нас есть хорошая статья в блоге на эту тему — «». Все они бесплатны, но для некоторых требуется регистрация. Если вы не нашли для себя ничего подходящего, попробуйте поискать по ключевому слову + обои (или, если на английском, обои). Обычно по такому запросу выходят качественные изображения. Но здесь нужно быть внимательным и проверить тип лицензии, иначе при серьезном бизнесе могут возникнуть проблемы.

А что делать тем, кто не умеет работать в фотошопе?

Если вы никогда не работали в Photoshop (или других графических редакторах) и еще не готовы потратить время на его освоение, вы можете воспользоваться сервисами, в которых уже есть готовые шаблоны изображений для разные социальные сети:

1. Fotor.com

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

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

После этого меняем текст, шрифт, размер шрифта, расположение надписи и т.д.

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

2 . Canva.com

Еще один сервис, который поможет вам красиво украсить ваше изображение. Он работает по тому же принципу, что и предыдущий. Регистрируемся в сервисе (можно использовать свою учетную запись google + или электронную почту).

Выбираем сферу деятельности. Мы пропускаем шаг, на котором вас просят пригласить друзей. Мы попадаем в главное меню, где выбираем сообщение Facebook, если нам нужна прямоугольная фотография, или публикация Instagram, если нам нужна квадратная.

Выберите шаблон (если шаблон отмечен как «БЕСПЛАТНО», то он бесплатный), измените текст.

При необходимости загрузите свое изображение , настроить размеры, изменить текст, шрифт и положение надписи. После этого нажмите кнопку «Загрузить», выберите формат изображения и сохраните его на свой компьютер или любое другое устройство.

Как форматировать статьи в редакторе

С недавнего времени ВКонтакте появилась возможность набирать статьи в специальном редакторе. Чтобы создать статью, необходимо нажать на букву «Т»:

Как использовать вики-разметку

Итак, мы подошли к самому интересному и в то же время сложному разделу. Возможно, среди читателей найдутся люди, не знающие, что такое вики-разметка, и вообще слышат этот термин впервые. Поэтому специально для вас я дам определение, которое дает сам «Контакт».

Вики-разметка — это язык разметки, который используется для стилизации текста на веб-сайтах (обычно принадлежащих к классу вики-проекты) и упрощает доступ к функциям языка hTML … На нашем сайте вики-страницы являются хорошей альтернативой обычным сообщениям и текстовой навигации. Если вам нужно создать большую статью с разным форматированием текста (жирным шрифтом, подчеркиванием, заголовками и т. Д.) Или добавить к ней графику или просто создать красочное меню навигации по вашему сообществу — вики незаменима.

Так же, как WordPress (или любая другая CMS) имеет редактор HTML, с помощью которого вы создаете статьи, у Contact есть собственный редактор для создания и редактирования вики-страниц. Выглядит это так:

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

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

С чего начать?

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

После того, как скачали или нарисовали меню, его нужно вырезать. Для чего это? Это необходимо для создания отдельных ссылок для конкретного изображения. Поскольку, если мы поместим наше меню полностью в группу, то больше одной ссылки работать не будет, или я чего-то не знаю. Кроме того, необходимо изменить размер нашего меню, то есть сразу принять во внимание, что максимальная видимая ширина составляет 388 пикселей (одно изображение), а остальные будут либо обрезаны, либо скорректированы до размеров, которые вы укажете при создании меню в группе, при этом изображение может растягиваться или сжиматься, что может испортить первоначальную задумку. Также стоит учесть, что, например, для горизонтального меню нам придется ориентироваться на ширину, равную 370 пикселей, иначе меню не будет выстраиваться горизонтально.

Итак, я покажу , например, самые обычные кнопки. Все манипуляции с графикой буду проделывать с помощью Photoshop, поэтому рекомендую вам его использовать. После того, как разобрались с размерами, осталось вырезать меню. Для этого вы можете использовать удобный инструмент «Резка».

Просто выберите нужные области с помощью этих инструментов, например:

И сохраните для веб-устройств.

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

Перейти на страницу нашей группы. И делаем некоторые подготовительные шаги: В управлении сообществом подключаем «материалы», сохраняем. Если на данном этапе что-то непонятно, то читайте статью про текстовое меню ВКонтакте, там все подробно, об этом сказано.

После этого нам нужно загрузить наши картинки, которые мы получил при вырезании меню. То есть нажимаем «добавить фото».


После загрузки изображений мы можно приступить к созданию меню. Для этого нажмите «изменить» рядом с последними новостями.

А теперь мы можем добавить код нашего меню. В моем случае это будет выглядеть так:

[] [] []

Итак, рассмотрим подробнее при чем здесь:

… — эти теги выравнивают наше меню по центру. Если их убрать, то меню будет прижато к левому краю.

photo-48249652_297601976 — путь к нашей картинке. Путь формируется следующим образом: номер альбома_номер самой фотографии. Как узнать путь к нашему образу? Все очень просто. Заходим в фотоальбом, в котором есть наши картинки, и нажимаем на нужное изображение. Тогда в адресной строке мы увидим полный путь к нашему изображению.

130×46 пикселей; nopadding; — параметры изображения: 130x46px; — ширина и высота нашей картинки (может отличаться от размера самой картинки) — указывать в вертикальном меню не обязательно; nopadding; — без пробелов — при использовании этой опции все пробелы (отступы) удаляются, а изображения объединяются в одно.

Вот что я сделал:

Горизонтальное меню ВКонтакте выполнено по тому же принципу. Единственное отличие состоит в том, что при написании кода новые пункты меню не нужно переносить на новую строку … А также не забывайте, что при таком расположении изображений мы можем использовать только 370 пикселей в ширину. Я немного поправил код, показанный выше, и вот что у меня получилось:

[] [] []

А вот как это выглядит:


И еще хочу добавить: бывают ситуации, когда нам нужно вставить картинку в меню, но это не должна быть ссылка. Она должна сыграть роль украшения. Для этого просто используйте опцию «без ссылки». Вот наглядный пример: такое же горизонтальное меню, только первая кнопка не активная ссылка, а простая картинка.

[] [] []

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

Теперь любые манипуляции в группах Вконтакте (меню, навигация, пагинация, новости и т. Д.) Станут намного проще. для выполнения, для этого достаточно изучить мой Видеокурс по техническим секретам групп Вконтакте … Вы просили видеоуроки, а я записал целый видеокурс — забирайте !! !

Удачных экспериментов!

На вопрос «как создать меню для группы ВКонтакте» можно три основных ответа: заказать у специалиста, создать с помощью онлайн-конструктор или мастеринг, вникните в некоторые тонкости вопроса и сделайте все самостоятельно.

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

Итак, вот три способа создать меню:

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

Кстати, для тех, кто предпочитает получать информацию через видео , а не читать длинные тексты, есть видео:

Путь №1. Заказать создание меню у специалиста-дизайнера

Преимущества этого метода — относительная скорость и минимальное участие с вашей стороны. Минусы — самая высокая цена и шанс получить красивое, но неправильное меню (про основные ошибки при создании меню мы подготовили). К тому же еще нужно найти художника. Здесь мы можем порекомендовать поискать его на сервисе kwork.ru, в разделе «Дизайн групп в социальных сетях».

Путь №2. Использование онлайн-конструктора

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

Путь №3. Все делать самому

Преимущества этого пути очевидны: он бесплатный, и вы приобретаете новые навыки. Минусы: Вам понадобится немного навыков и довольно много времени (впервые). Вот что вам нужно:

  • Уметь уверенно пользоваться графическим редактором … Например, PhotoShop. При составлении меню вам нужно будет сначала сделать изображение правильного размера (до пикселя, без «примерно»!), А потом правильно его обрезать (разбить на фрагменты)
  • Быть умеете понимать инструкции и внимательно их читать
  • Не сдавайтесь и не отчаивайтесь, если что-то не получится с первого раза

Если у вас Думаю, вы справитесь со всем этим, тогда приступим.

Шаг №0. Общая информация о том, как устроены меню группы ВКонтакте

Меню для группы есть сделаны из вики-страниц, создание которых поддерживает ВК. Вики-страницы — это специальные страницы, которые можно создавать только публично. Они отличаются от обычных сообщений тем, что могут использовать так называемую вики-разметку. Эта разметка представляет собой специальный код, который преобразуется в дополнительные объекты форматирования. Чтобы было понятнее, поясним. Например, в обычных сообщениях вы можете использовать только обычный текст, в то время как разметка вики позволяет выделить части текста жирным шрифтом или курсивом. То есть она вводит дополнительные функции оформления. В частности — возможность размещать изображения, при нажатии на которые пользователь будет перенаправлен на ссылку. Именно эти дополнительные параметры форматирования используются для того, чтобы сделать общедоступное меню ВКонтакте.. Как именно это сделать, мы расскажем ниже.

Шаг 1. Подготовительный этап

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

Итак, вы создали новую группу … Давайте теперь узнаем идентификатор вашей группы. ID группы — это ее уникальный номер, с которым контактирует. Зайдите в свою группу и нажмите «Сообщения сообщества» (если в группе нет сообщений, то вместо «Сообщения сообщества» будет «Нет сообщений»). Вы перейдете на новую страницу с таким адресом:

https://vk.com/wall- XXX ? own = 1

Вместо XXX у вас будет набор чисел (и только цифры!). Это ваш идентификатор сообщества. Например, в нашей тестовой группе это 154457305.

Теперь давайте создадим новую вики-страницу в группе. Для этого создайте ссылку следующего типа:

http://vk.com/pages?oidu003d- Group_id & p = Имя_страницы

http://vk.com/pages?oidu003d- 154457305 & p = Меню

Откройте получившуюся ссылку в своем браузере (скопируйте ее в адресную строку браузера и перейдите по адресу). Вот и все, вы создали вики-страницу с названием «Меню» (если, конечно, вы указали «Меню» в качестве имени страницы в ссылке). Вы должны увидеть такой текст: «Страница меню пуста. Наполните содержанием. «В правом верхнем углу есть значок карандаша (). Щелкните по нему, чтобы перейти к редактированию страницы.

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

Обратите внимание на две вещи. Во-первых, слева На кнопке переключения режимов редактирования есть кнопка для вызова справочной информации по вики-разметке (). Очень полезная вещь, особенно для новичков. Второй момент, на который следует обратить внимание, — это адрес вики-страницы. Вы увидите что-то вроде это в адресной строке вашего браузера:

http://vk.com/page- Group_id _ XXX ? act u0 03d edit & section = edit

Часть адреса перед знаком «?» — это адрес вашей вики-страницы. Запишите где-нибудь: в ВК нет возможности увидеть список ваших вики-страниц и ссылок на них. Чтобы перейти к желаемой, вам необходимо знать ее адрес или снова воспользоваться ссылкой для создания вики-страницы. Используя последний способ, имейте в виду, что страницы, если они уже существуют, не создаются заново.

Шаг № 2. Делаем простое меню для группы ВКонтакте

Итак, мы создали вики-страницу «Меню». Переключитесь в режим разметки редактора и добавьте следующий код:

Нажмите кнопку «Предварительный просмотр», расположенную в нижней части редактора. Вы должны увидеть список из трех ссылок. Первые два являются внешними и ведут на главные страницы Яндекс и Гугл соответственно. Третья ссылка внутренняя. Выводит в паблик ВК с ID «1» (это официальная группа ВК для разработчиков). Если в предварительном просмотре отображается код, а не ссылки (на которые можно щелкнуть) — , значит, вы ввели код в режиме визуального редактирования , а не в режиме макета. Будьте внимательны!

Обратите внимание, что внешние ссылки в вики-коде ВКонтакте оформляются одинарными скобками, а внутренние — двойными. При этом внутренние ссылки ВК указываются не как обычный адрес сайта, а как указатель на конкретный объект ВКонтакте. Например, указатель на группу имеет такое обозначение:

club Group_id

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

Обязательно сохраните страницу. По сути, мы только что создали базовую страницу навигации. Это не более чем простейшее меню для группы ВКонтакте … Конечно, это еще не графическое меню, но даже оно может справиться с основной задачей меню — быстро направлять пользователей в желаемое общественное место. Чуть позже мы рассмотрим, как сделать графическое меню.

Теперь давайте посмотрим, как и где можно использовать вики-страницы.

Шаг № 3. Где Могу ли я размещать вики-страницы ВКонтакте

Есть два основных места: вы можете создать сообщение со ссылкой на вики-страницу или разместить его в разделе «Контент» вашего сообщества.

Начнем с первого варианта. Начните добавлять новую запись на стене своей группы. Сначала прикрепите к нему любую фотографию. Лучше сделать снимок достаточно большого размера, ширина которого больше высоты. Затем вставьте ссылку на созданную вами вики-страницу с помощью простого меню в текст создаваемого вами сообщения. Мы просили вас записать это немного раньше. Напомним, ссылка выглядит так ( у вас будут разные номера ):

http://vk.com/page-121237693_72827423

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

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

Итак, мы узнали, что вики-страницы могут быть прикреплены к сообщениям. В частности, к назначенному сообщению. Второе место, где вы можете использовать вики-разметку, находится в разделе «Материалы».

Зайдите в настройки сообщества и найдите управление разделами (сервисами) сообщества там. Отметьте «Материалы» как «Ограниченные». Новый элемент появится вверху главной страницы вашего сообщества. Он расположен справа от элемента «Информация». Когда вы впервые включаете материалы в группу, этот элемент по умолчанию называется «Последние новости». Вот как это выглядит:

Перейдите к этому новому элементу. Нажмите на пластину «Изменить». В результате вы попадете в уже знакомый редактор вики-страницы. Единственное отличие состоит в том, что есть поле для ввода заголовка страницы. Измените его из «Свежие новости» в «Меню2». В режиме редактирования разметки введите следующий код:

«» «Пункт меню для раздела» Материалы «» «»

[]

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

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

Мы узнали, что меню можно размещать в двух местах. Желательно делать это как в виде фиксированной записи, так и в разделе «Материалы». Помните два нюанса:

  • Закрепленный пост увидят 98% ваших посетителей и только 25-40% самых любопытных, а также лояльных старых пользователей вашего группа, знающая, что есть что-то полезное, попадет в раздел материалов.
  • Закрепленный пост с картинкой для вызова меню можно дополнить текстом. Таким образом, вы не потеряете функцию закрепленной записи. Но не переусердствуйте: чем больше текста, тем ниже будет ссылка для открытия вашего меню.

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

Кстати. Вы можете переходить с одной вики-страницы на другую. Это работает так: пользователь открывает (например, используя изображение ссылки в сообщении) первую страницу вики. Он также содержит ссылки на другие вики-страницы. При нажатии на эти ссылки откроется соответствующая вики-страница. Таким образом, вы можете, например, создавать довольно сложные и многоуровневые меню и инструкции. Однако мы не советуем слишком увлекаться этим без надобности.

Шаг №4. Как сделать меню в группе ВКонтакте. Графика

Итак, основные принципы усвоены. Перейдем к созданию графического меню. Сразу оговоримся, что мы будем делать довольно простое меню: вертикальный ряд кнопок со ссылками. Но не спешите говорить «нет, я хотел сверхсложное меню» и закрывайте это руководство. Давайте объясним, почему именно сейчас.

Во-первых, переход от простого к сложному обычно является наиболее эффективным способом овладения новыми знаниями. Научившись делать относительно простое меню, вы освоите 90% техник создания меню для групп ВКонтакте.

А во-вторых, как мы уже говорили, разметка вики ВК была введена в свое время когда про мобильные приложения мало кто слышал. Наше условно «простое» меню будет максимально корректно и качественно работать везде: в браузерной версии ВКонтакте, в мобильных браузерах и, наконец, в приложении. Многие «сложные» меню этим похвастаться не могут. Более того, в большинстве случаев «простое» меню будет работать лучше, чем «сложное», которое «разваливается» при просмотре в официальном приложении. Чаще всего лучше остановиться на этом пункте меню. Да, есть несколько довольно богатых реализаций меню. С ними тоже можно экспериментировать. Но наш опыт говорит, что реальной выгоды — конверсий, покупок и репутации они вряд ли добавят. И у них вполне могут быть проблемы.

Наше тестовое меню будет выглядеть так:

Всего две кнопки. Первый будет вести на главную страницу Яндекса, а второй — в группу ВКонтакте.

Вертикальное графическое меню в ВК — изображение, разрезанное на полосы. Эти полосы расположены друг под другом на странице вики. Некоторым из этих «бэндов» присвоены ссылки. При нажатии на такую ​​ссылку-изображение, собственно, и происходит переход по этой ссылке. Одна полоса — это одно звено. С другой стороны, некоторым полосам (например, промежуточным, расположенным между точками) присваивается отсутствие ссылки. Такие полосы становятся «не кликабельными».

Создание вертикального графического меню для группы ВК сводится к следующей последовательности действий:

  • Первое шаг — нарисовать меню. Ширина должна быть строго 600 пикселей (пикселей). Рекомендуем делать меню не более 900 пикселей в высоту. Результат лучше всего сохранять в формате PNG, в крайнем случае -JPG. Воспользуйтесь знакомыми и удобными инструментами для рисования (такими как Photoshop или GIMP). Результат здесь на 95% зависит от ваших творческих и технических навыков.. Даже если вы совсем не умеете пользоваться графическими редакторами, не отчаивайтесь. Навыков, которых хватит, можно приобрести максимум за пару часов. В Интернете огромное количество справочной и обучающей информации. Кроме того, возможность хоть немного использовать графический редактор очень и очень полезна для публичных администраторов. Вы не будете тратить зря время.
  • Далее картинка с меню разрезается на горизонтальные полосы. Сделать это можно любым удобным для вас способом: от привычного многим Photoshop до различных онлайн-сервисов. Если вы не знаете, как это сделать, просто задайте вопрос своей любимой поисковой системе. Не будем подробно описывать техническую часть процесса нарезки: способов десятки, одни подходят для одних, а для других не подходят. При обрезке нужно соблюдать одно простое правило: высота одной полосы не должна быть меньше 60px … В противном случае у вас могут возникнуть проблемы с отображением меню в приложении и в мобильных браузерах. : так называемые. «Белые полосы» между изображениями.
  • Нарезанные «полосы» загружаются в альбом или альбом группы на странице администратора группы. Мы рекомендуем второй вариант. В любом случае альбом с нарезанными частями меню должен быть в открытом доступе … В противном случае те пользователи, для которых недоступны изображения альбома, не увидят ваше меню!
  • Код разметки вики компилируется и вставляется на нужную страницу вики.
  • Группа содержит закрепленное сообщение с изображением-ссылкой на страницу вики с меню. Как делается такой пост, мы подробно писали выше. Кроме того, код (с небольшими изменениями) можно добавить на корневую вики-страницу (элемент справа от элемента «Информация» появляется, когда вы включаете раздел «Материалы». Подробнее см. Выше).

Теперь давайте более подробно рассмотрим загрузку частей меню и кода вики. Мы подготовили для вас. Он содержит два каталога: «1» и «2». Первый содержит части самого примитивного и простого варианта нарезки для нашего меню — на две части. Скачиваем архив, загружаем изображения (1.png и 2.png) из каталога «1» в новый альбом (на свою страницу или в группу).

У нас есть две «полосы»: верхний (с кнопкой Яндекс) и нижний (с кнопкой ВКонтакте). Оба будут ссылочными изображениями. В вики-разметке это делается с помощью следующего кода:

«LINK» — целевая ссылка. Например, https://yandex.ru/. Помимо обычных внешних ссылок может быть указание на объект ВКонтакте: пост, страницу пользователя или группу. Например, чтобы после нажатия кнопки происходил переход в сообщество «Команда ВКонтакте», вы можете указать как его адрес (https://vk.com/team), так и указатель на него (club22822305). В принципе разницы не будет. Внешние ссылки (те, которые не ведут на ресурсы ВК) рекомендуем сокращать через

Учитывая, что это меню не в группе, а на странице ВКонтакте (public), я решил показать вам, как все это делается! Уже давно меня теребят вопросами: как сделать меню публичным, как сделать меню открытым, как исправить и т.д. Вот вам инструкция!

Так как же можно создать меню на общедоступной странице в контакте с ? Все мы знаем, что возможность добавить встроенное вики-меню есть только в группе , я писал об этом и. Но как сделать публичное меню, если в настройках нет такой функции? Для пытливого ума ограничений нет! Вот так меню выглядит в нашей корпоративной публике:

Публичное меню? Легко, как пирог!

Просмотрите статьи еще раз: и теперь эти знания будут нам полезны!

3 шага к красивому общедоступному меню !

Вы, наверное, уже догадались, что в основе такого меню лежит … закрепленный пост с внутренней страницы! Лично мне очень нравится этим методом я даже в группе своего блога отказался от встраивания и использования «меню в клипе». А теперь я дам вам четкие инструкции о том, «как это сделать»!

Шаг № 1: создайте внутреннюю страницу меню

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

Вариант 1: (нормальный)

http://vk.com/pages?oidu003d- XXX & p = Page_name

, где XXX — это идентификатор вашей общедоступной страницы,

и «Page_Name» — любое слово, которое будет использоваться для названия страницы

Вариант 2: (легкий, но)

Итак, мы создаем вики-страницу и заполняем ее точно так же, как если бы мы заполняли меню для группы. То есть регистрируем там все изображения и переходы. У нас должно получиться что-то вроде этого:

Это меню wiki

Внимание! Если вы до сих пор не умеете создавать наглядные меню в контакте, то снова статья! Если все в порядке. то вы получите похожую картинку:

А это готовая страница меню

Шаг №2: создайте пост на стене

Теперь нам нужно добавить наше меню на стену сообщества ВКонтакте. Для этого скопируйте ссылку на внутреннюю страницу и добавьте ее в сообщение, например:

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

Итак, теперь мы должны удалить ссылку из «тела» сообщения (прикрепленная страница останется) и добавить к сообщению изображение , которое увидят подписчики. Хитрость заключается в том, что если ссылка и изображение присутствуют в одной записи, то при нажатии на изображение переход по ссылке ! Все гениальное — просто!
Картинка может частично или полностью повторять само меню, здесь решать вам. Если вы заказываете меню для паблика, то вам также понадобится баннер , т.е. картинку, которая будет висеть в клипе. Вот что мы получим n публикуем пост:

Картинка повторяет меню и привлекает внимание посетителей страницы

Шаг № 3: исправьте сообщение

Наконец, у нас все готово, сообщение висит с изображением и ссылка на стене! Теперь нам нужно переместить его в шапку группы, закрепить пост на главной странице, сделать пин … Для этого кликаем по дате/времени поста (под каждым постом есть дата публикации), мы перейдите на внутреннюю страницу сообщения, прокрутите вниз и найдите кнопку «закрепить» ». Посмотрите на картинке, что вам нужно найти:

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

vk.com/frilkacom

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

Итак, с помощью трех простых шагов нам удалось создать красивое меню, которое можно использовать в любом сообществе ВКонтакте!

У меня есть все! Делитесь статьей с друзьями, добавляйте в избранное и следите за обновлениями блога, чтобы не пропустить новые интересные статьи!

Социальные сети давно вошли в жизнь большинства людей и являются в нем важной составляющей. Многим даже удается создать в них свой виртуальный бизнес: продвижение лайков, подписчиков, продажа товаров как из других стран, так и копирайт. Практически у всех есть группа. И как пользователи могут быстрее всего понять то, что делает человек или даже целая организация? Создайте специальное меню, содержащее самую необходимую информацию. И здесь нам нужна разметка Wiki. Как сделать групповое меню ВК? Что к этому добавить? В статье будут рассмотрены правила создания и примеры..

Что такое Wiki Markup?

Как сделать групповое меню ВКонтакте? Разметка Wiki — хороший помощник! Это очень эффективный и удобный способ создать группу в социальной сети ВКонтакте. Эта разметка в принципе очень похожа на html-код … Но для людей, не имеющих отношения к программированию, она будет более понятной из-за простоты реализации. Свое название разметка Wiki получила благодаря Википедии, где многие пользователи впервые смогли ознакомиться с основными особенностями ее функционирования. Разметка Wiki позволяет людям без знаний программирования быстро и легко создавать группы внешнего вида:

  1. Создавать графические спойлеры и таблицы.
  2. Форматировать текст и изображения.
  3. Работа с якорами и ссылками.

Как сделать меню для группы ВК? Рекомендации могут быть так необходимы, но в целом разобраться можно с помощью хорошего гида. Если говорить о html, то для его изучения и работы с ним нужно было сидеть несколько дней, а то и неделю. Разметка Wiki с хорошей памятью занимает очень мало времени. Как его создать? Какие есть подходы? Здесь мы поговорим о технологиях, а кто их создал? Разберемся, как сделать меню для группы ВК. Уорд Каннингем впервые представил понятие «вики» (в переводе с гавайского означает «быстрый»).

Методы создания вики-разметки

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

  1. Если группа имеет социальную направленность, то вы можете создать текстовое меню. Преимущества ему даются за счет более серьезного внешнего вида.
  2. Для коллективов коммерческого и развлекательного характера желательно полагаться на графическое меню. Использование изображений в нем привлечет внимание пользователей к тому, что должно быть на виду. Применение этого подхода также сделает вашу группу более приятной и расслабляющей.

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

Работа с изображениями

Как сделать так, чтобы меню в группе в ВК было красивым? В социальной сети ВКонтакте можно вставить фото или картинку с помощью вики-разметки только тогда, когда они загружены в фотоальбомы сайта. Итак, заходим в него, выбираем желаемое фото и копируем его адрес. Например, пусть это будет так: photo12345_67890. Теперь нужно взять его в дубль. Вы должны получить следующий результат: []. Что делать, если к фотографии или картинке нужно прикрепить текст или ссылку? А может есть желание немного подправить внешний вид? Тогда в этом поможет следующее: необходимо, чтобы файл выглядел так — [[photo12345_67890 | варианты | текст/ссылка]]. Вместо последних трех слов подставляется то, что нужно. Текст — пишем то, что нужно. Вроде особых пояснений не нужно. Ссылка переводится с английского как «ссылка». Это указано для того, чтобы машина пользователя знала, куда ей нужно идти. Параметры — здесь можно задать следующие значения:

  1. Обычный — ссылка на изображение оформлена в виде текста, картинки в ней нет.
  2. Noborder — убирает рамку вокруг фотографии.
  3. Box — изображение открывается в окне.
  4. Nolink — ссылка на фото удаляется .
  5. Nopadding — пробелы между изображениями не отображаются.
  6. NNNxYYYpx или NNNpx — укажите размер картинки в пикселях. Первый вариант обеспечивает ширину и высоту. При желании можно «сжать» картинку. А второй вариант предполагает редактирование ширины.

Как мне создавать таблицы с использованием вики-разметки?

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

  1. (| — это обозначение начала таблицы. Без него невозможно обойтись при при создании этого элемента он является обязательным атрибутом.
  2. | — используется для придания ячейкам эффекта прозрачности.
  3. | + — этот набор символов используется для размещения таблицы имя в центре. Это не обязательный атрибут, но он должен размещаться сразу после знаков для обозначения начала.
  4. | — — так обозначаются новые строки (в том числе для ячеек) .
  5. ! — дает темный цвет. При отсутствии эго необходимо использовать знак из пункта 2.
  6. |) — набор символов которые обозначают конец таблицы. Это необязательный атрибут. Но все же рекомендуется использовать его, чтобы предотвратить возникновение ошибки.

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

Создание группового меню в социальной сети ВКонтакте с использованием вики-разметки: пример реализации

Параметры noborder и nolink будут здесь используется. Они уберут рамку с изображением и ссылку. Кроме того, размер изображений будет изменен, а вторая строка ячеек таблицы будет иметь темную заливку благодаря использованию! Атрибут. А вот пример:

{|
| —
|

”« Новое в науке »’ | |
| —
! [] !!
| —
|
[[Новости науки | Новости]]

[[Открытия]]

|
[[Конференции]]

[[Разработка]]

[[Книги]]

[[Симпозиумы]]

|
Разделы:

[[Медицина | 1]] | [[Физика | 2]] | [[Математика | 3]] | [[Экономика | 4]]

[[Химия | 5]] | [[Биология | 6]] | [[Программирование | 7]] | [[Электротехника | 8]]

| —
|}

Как видите, ответ на вопрос: «Как сделать меню в группе в ВК?» » очень легкий.

Важность вики-разметки при продвижении вашего проекта

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

Заключение

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



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

Как известно, «ВКонтакте» — это не просто социальная сеть, в которой мы обсуждаем любые актуальные темы. Вконтакте — это огромная бизнес-площадка, где вы можете продвигать свой бренд, зарабатывать на рекламе, продвигать различные товары и услуги. Отличную возможность для ведения бизнеса предлагают сообщества в ВК, посвященные самым разным темам и имеющие базу из сотен тысяч подписчиков. При этом яркое качественное меню такой группы способно улучшить и одновременно упростить работу с ней, тем самым сделав эту группу еще более удобной и привлекательной в глазах пользователей. В этой статье я расскажу, как сделать меню в группе ВК, какие инструменты нам в этом помогут и как с ними работать.

Создать меню для сообщества ВК

Контент статьи:

  • Способы сделать меню в паблике Вконтакте в новой версии 1 Способы сделать меню Вконтакте публичным в новой версии
  • Способ 1. Photoshop + функционал Вконтакте (Меню своими руками) 2 Способ 1. Функциональность Photoshop + ВКонтакте (меню «Сделай сам»)
  • Способ 2. Сервис «Menumake» — поможет сделать Меню быстро 3 Способ 2. Сервис » Menumake »- помогает сделать меню быстро.
  • Заключение 4 Заключение

Способы сделать меню в паблике Вконтакте в новом версия

Для того, чтобы создать меню в группе социальной сети ВК, в первую очередь отмечу, что методы и инструменты, которые использовались до перехода «Вконтакте» на новый дизайн, сегодня , в основном, не работают. Я рекомендую использовать те приемы (а также просматривать те видео), которые поддерживают новый интерфейс ВКонтакте, а также использовать spec иализованные программы, поддерживающие функции нового интерфейса.

А теперь перейдем к непосредственному описанию способов создания группового меню в «ВК».

Способ 1. Функционал Photoshop + Вконтакте (меню DIY)

Для создания меню в группе ВК вам понадобится довольно популярный графический редактор Photoshop (если у вас его нет, его нужно будет найти, скачать и установить). Затем рекомендую сделать следующее:

  • Загрузите изображение в «Photoshop», которое станет фоном для нашего меню (или, если вы предпочитаю, можно использовать белый фон). Чтобы создать прозрачный фон, прочтите инструкцию по ссылке;
  • Напишите на нем название пунктов меню вашей группы (в соответствии с существующим планом);
  • Используя инструмент Photoshop под названием «Вырезание», разделите названия имен на отдельные блоки. Лучше всего иметь эти блоки в виде квадратов одинакового размера (или прямоугольников);

    Делаем меню для ВКонтакте

  • Сохраните эти блоки как отдельные файлы;
  • Откройте новую вкладку браузера, введите там следующую ссылку:

http://vk.com/pages?oid = -ХХХ & p = Name_page

В тексте ссылки вместо XXX вставьте идентификатор вашего сообщества, а вместо «Название страницы» введите заголовок вашего материала (например, в данном случае «Меню»).

Если вы не знаете ID своей страницы, перейдите на страницу вашего сообщества, там выберите «Записи сообщества». В адресной строке рядом с вопросительным знаком вы увидите серию чисел, которые будут вашим идентификатором (ID) сообщества.

Скопируйте ID группы

После ввода этой ссылки и нажатия на« Enter »откроется страница с надписью« Fill with content ». Щелкаем по ней, откроется окно редактирования.

  1. При редактировании контента лучше перейти к «вики-коду» (удобный язык разметки страниц), который активируется нажатием на соответствующий значок в правом верхнем углу;
  2. Щелкните значок «Камера» и добавьте наши фотографии. После каждого изображения мы вставляем необходимый тег «option; nopadding» (должен быть размещен перед указанием размера нашего изображения), он будет действовать как пробел;
  3. Под каждым пунктом меню мы вставляем ссылки на соответствующий контент (например, фотографии);
  4. Сохраняем результаты, и закрепите вверху сам ваш пост, это позволит вам создать меню в группе Вконтакте.

Как это выглядит визуально вы можете посмотреть здесь:

Способ 2. Сервис «Menumake» — помогает быстро составить меню

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

  1. Чтобы использовать Menumake, перейдите в этот сервис и войдите в него, используя данные своей учетной записи ВКонтакте, и сервис немедленно отобразит созданные вами группы.
  2. Рядом с желаемым сообществом нажмите «Создать меню», и вы попадете на страницу редактора.
  3. Сервис автоматически подтянет все доступные элементы группы.
  4. При их редактировании вам нужно будет щелкнуть стрелку слева от элемента, выбрать желаемое значение, а затем (при необходимости) указать ссылку справа.

    Выберите шаблон для меню

Редактирование меню отображения

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

Чтобы опубликовать шаблон в группе, вам нужно будет нажать кнопку «Загрузить меню в группу», передать небольшую плату службе за указанное действие, и выбранное вами меню будет быть помещенным в вашу группу.

Заключение

Обдумывая задачу, как сделать меню в группе ВК, в первую очередь, следует определиться по выбору графического шаблона (картинка должна быть подходящего размера и высокого качества), а затем, разрезая картинку на компоненты с помощью Photoshop, поместить графические компоненты в свою группу с помощью вики-разметки. В то же время, если то, что вы описали, покажется вам слишком сложным, вам будет проще воспользоваться инструментами соответствующих программ (например, «Makemenu»), которые позволят вам создать и настроить качественное меню вашего сообщества ВКонтакте для относительно небольшая плата.

В контакте с
Facebook
Twitter
Одноклассники
Pinterest
Как вы оцениваете статья?
(оценок пока нет)
Загрузка …
Оцените статью
logicle.ru
Добавить комментарий