Как делать вики меню в вк
ВК Часть 2: Как сделать wiki меню для группы Вконтакте?
Приветствую, друзья! Прошло совсем немного времени со дня публикации прошлого поста из серии «Продвижение Вконтакте», как в свет выходит новый пост о создании меню для группы ВК.
На самом деле графическое меню играет не самую последнюю роль в получении качественной целевой аудитории, а соответственно потенциальных клиентов.
Красивое меню для группы — это не только поддержка имиджа, но и отличный способ удержать целевую аудиторию. Как правило, профессионалы в сфере SMM работают над продвижением коммерческих групп только при наличии wiki разметки.
Почему? Дело в том, что даже при наличии хорошего контента: интересных постов, аудио и видеозаписей, дискуссий и т. д. — не факт, что участники группы будут конвертироваться в потенциальных клиентов.
По статистике наличие меню в группе увеличивает конверсию как минимум до 10%. Разумеется, это условный показатель, так как средняя конверсия меняется в зависимости от тематики, подобранной аудитории и методах рекламы, о чем я буду рассказывать в следующих постах.
А пока давайте разберемся с созданием меню для группы Вконтакте.
Если вы еще не подписались на обновления блога, то настоятельно рекомендую это сделать, чтобы не пропустить новые статьи о продвижении в социальной сети ВК.
Итак, давайте приступим…
Как сделать меню в группе Вконтакте?
Для начала давайте определим, каким должно быть меню. В зависимости от целей (продажи, трафик или подписчики) меню принимает разные виды.
1. Графическое меню для продаж
Как правило, такое меню представляет собой категории или каталог товаров. В качестве примера я выбрал следующую группу:
В принципе, все сделано надлежащим образом. Только один момент: было бы намного изящнее, если бы администраторы сделали переход от аватарки к меню в виде плавной линии.
2. Графическое меню для переходов на основной сайт
Такое меню в основном используют крупные и мелкие интернет-магазины. Основным преимуществом является структура, а именно наличие следующих пунктов: оплата и доставка, как заказать, отзывы и контакты.
В качестве образца посмотрите на это меню:
НО! Тут есть интересный момент. Многие SMM’щики с помощью меню перенаправляют посетителей группы на основной сайт и следует отметить, что это приносит хороший результат. Разумеется, данный метод получения клиентов не всегда работает. Все зависит от тематики, оформления сайта, навигации и т.д., а это совсем другая сфера, в которой проблем намного больше, чем в SMM.
3. Графическое меню для привлечения подписчиков
Данное меню используется с целью увеличения количества переходов на основной сайт. Обычно его использует некоммерческие и полукоммерческие проекты. В качестве примера приведу свою работу, выполненную несколько недель назад для проекта ВТопе.
Как видно, меню выполнено с целью увеличения числа пользователей программы ВТопе. Все сделано очень качественно, и заказчики оценили работу на пять с плюсом
Но, к сожалению, Вконтакте не любит группы, пропагандирующие программы для накрутки, и через несколько дней её удалили.
К счастью, я успел заскриншотить и сохранить у себя на компьютере.
Кстати, вы можете посмотреть все мои работы в портфолио и заказать различного рода услуги по продвижению в социальных сетях.
Итак, в основном меню нужно интернет-магазинам для получения клиентов, так как во всех остальных случаях ключевую роль играет интересный контент, а не внешний вид. Специально для них выделю основные пункты, которые должно включать в себя хорошее меню.
1. Меню должно сочетаться с цветовой гаммой аватарки 2. Меню должно быть простым в плане навигации
3. В идеале размеры меню должны сочетаться с аватаркой, как это сделано на скриншоте выше
В принципе, вся теория мною изложена. Давайте перейдем к технической части поста, т.е. непосредственно к самому созданию и правке кода для меню Вконтакте.
Как создать меню для группы Вконтакте?
Несколько недель назад я создал группу Вконтакте для своего любимого блога SMM Life, но, к сожалению, до сих пор не сделал красивое меню. Пользуясь случаем, в режиме реального времени я создам меню и распишу подробно все этапы.
Окей, группа у нас есть. Сейчас она выглядит следующим образом:
На данном этапе вместо меню закреплена одна из записей, поэтому начинаем с самого начала.
1. Переходим в Управление сообществом → Материалы → Подключить
Сохраняем и возвращаемся в группу. Под описанием группы появится вкладка Свежие новости
2. Наводим курсор мыши на вкладку и нажимаем Редактировать
3. Меняем название вкладки. Например, на >
Дальше можно пойти по двум путям:
1) создаем меню в виде статистических ссылок 2) создаем меню в виде изображения
Давайте разберем каждый способ подробно, ведь не все владеют в совершенстве графическими редакторами. Начну с первого.
Создание простого меню для группы Вконтакте
В принципе, ничего сложного нет. Меню создается с помощью встроенного визуального редактора, работать с которым одно удовольствие.
1. Переходим в редактирование и создаем меню, используя возможности визуального редактора
С помощью него можно добавить в меню заголовки, ссылки, фотографии, аудио и видеозаписи, а также настроить форматирование текста.
Таким образом, у меня получилось простое меню с описанием проекта, ссылками на популярные записи.
Я не стал заморачиваться над форматированием текста и созданием внутренних страниц, так как впереди меня ждет создание графического меню с использованием wiki разметки.
Создание wiki меню для группы Вконтакте
Здесь нам потребуются навыки работы в графическом редакторе Photoshop и знания wiki разметки. Итак, начнем…
1. Открываем графический редактор и создаем новое изображение (Файл → Новое изображение)
2. Указываем размеры (500px на 500px) и название нового изображения
После некоторых преобразований у меня получилось следующее изображение:
Несмотря на то, что я делал меню на скорую руку, оно получилось довольно-таки милым и красивым
3. С помощью инструмента Slice Tool делим наше изображение на части
4. Сохраняем изображение для Веб-сайта (Файл → Сохранить для Web-Sites)
5. Переходим в группу и открываем редактор меню
6.
Добавляем с помощью специальной кнопки все изображения
7. Сохраняем и возвращаемся в группу
Уже на этом этапе наше меню выглядит очень привлекательно.
НО! Возможно, вы заметили, что между изображениями есть пробелы, поэтому снова переходим в редактор, но уже правим исходный код.
Редактируем исходный код каждого изображения.
1) Добавляем стиль nopadding после стиля noborder (до слеша!) 2) Добавляем ссылку после слеша
Вот пример правильно оформленного изображения:
[[photo123162574_321612375|400x51px;noborder;nopadding|http://smm-life.ru/o-sebe-i-bloge]]
Таким образом, у меня получилось относительно простое графическое меню для группы Вконтакте.
Вы также можете добавить внутренние страницы и проставить на них ссылки. Я не буду вдаваться в подробности, так как есть хороший учебник по wiki разметке, в котором вы найдете все, что вам может понадобиться при создании красивого меню для группы Вконтакте.
А сейчас я рекомендую вам подписаться на мою группу Вконтакте и посмотреть на меню своими глазами.
Дополнительная информация:
1. На создание изображения я потратил около получаса 2. На правку исходного кода и коррекцию изображений ушло около 15 минут
И еще кое-что: при создании меню можно использовать готовые шаблоны различных кнопок. Благо в интернете их предостаточно.
P.S. подписывайтеcь на обновления блога и получайте ежедневно информацию о свежих статьях, новых методиках и способах заработка в интернете!!!
Автор: Тимур Рубрика: SMM продвижение Метки: группа вконтакте, оформление, создание менюТакже рекомендую прочитать следующие статьи блога:
Оформление группы Вконтакте: как сделать вики разметку
Думаю, каждый, кто активно пользуется соц сетью Вконтакте, уже встречал красиво оформленные группы и паблики. Многие из них имеют помимо меню еще и множество стилизованных вложенных страниц, каталоги и прочее, что по сути создает небольшой сайт прямо внутри социалки.
Вот несколько примеров, чтобы все понимали, о чем речь.
Такие группы позволяют выделиться среди своих конкурентов и привлекать больше пользователей. Особенно, если еще и контент интересный 🙂 В рамках данной статьи мы поговорим о том, как это всё делается. Чтобы более подробно всё разобрать и вникнуть во все тонкости, возьмем конкретный пример. Будет небольшой мастер-класс по оформлению групп.
Идея и выбор формата сообщества
Самый первый этап нашей работы — это идея. Нужно понять, о чем мы хотим рассказать и кому. В контакте есть несколько форматов сообществ и выбирать стоит с учетом поставленных задач. Хотя в дальнейшем группу можно перевести в формат паблика и наоборот.
Объясняю на пальцах. Паблик — это что-то сравни блогу. Лента новостей. Иными словами, мы рассказываем своим подписчикам о каких-то вещах и они не смогут писать на стене нашего сообщества. Максимум — комментировать.
Группа позволяет создать более открытое к беседе и обсуждениям сообщество, где люди смогут от своего имени делать посты в ленте.
В неё также можно добавлять друзей из своего списка. В паблике такой возможности нет. Кроме того, в группе немного больше возможностей по интегрированию вики-разметки (здесь есть раздел «Новости», в который можно интегрировать меню).
Глобально можно рассуждать так: если нам нужно создать сообщество для магазина, то я бы взял формат «паблик». Если же речь идет, например, о любителях рыбалки, то лучше взять «группу». Хотя, каждый волен поступать так, как считает нужным. Ведь в любой момент формат можно будет изменить. Однако, имейте в виду, что Вконтакте вводит ограничение на повторное изменение формата сообщества и после первого раза нужно будет ждать несколько дней до того момента, как вы сможете всё вернуть назад при необходимости. Поэтому тестировать функционал лучше до того, как группа начнет наполняться контентом.
В рамках данного мастер-класса я в качестве отправной точки возьму игру Mad Max по мотивам одноименного фильма, которая вышла буквально пару недель назад и создам сообщество для игроков с различными материалами по этой игре.
Главная цель — слив трафика на свой игровой сайт.
Формат будет «Группа», так как нужно создать естественный приток аудитории и максимально расширить общение внутри сообщества. Сразу уточню, что буду использовать универсальную методику, которую можно применять как в формате группы, так и в паблике. Это работает везде.
Контента море, начинаем воплощать идею в жизнь!
Создание группы
Чтобы создать группу, переходим в «Мои группы» в правом меню аккаунта Вконтакте и нажимаем на синюю кнопку вверху «Создать сообщество».
Должно появиться вот такое окошко, где мы вводим название для нашей группы и выбираем формат.
Введя необходимую информацию перед нами открывается панель управления нашим сообществом. В моем случае она выглядит следующим образом.
Как вы видите, я добавил немного параметров: включил видео, аудиозаписи, обсуждения и еще ряд возможностей, которые мне пригодятся в дальнейшей работе при сборе контента. Всё это можно будет в дальнейшем изменять без каких-либо ограничений.
Также я прописал адрес своего сайта. Если у вас сайта нет, либо же его тематика не соответствует формату сообщества (они о разных вещах и никак не связаны друг с другом), то эту строку можно оставить пустой.
Возрастные ограничения я ставлю в данном случае от 18, по аналогии с теми, что разработчики выставили игре. Хотя я практически не сомневаюсь, что играют и дети.
Всё. Группа создана!
Теперь можно начинать ее оформлять.
Оформление группы Вконтакте
Этот этап можно разбить на 2 составляющие: графическая и техническая. Для работы нам потребуется шаблон для создания аватарки группы и меню, а также немного воображения и базовые знания фотошопа (он же Adobe Photoshop).
Шаблон разметки
Что представляет из себя шаблон и что это вообще такое? Шаблон — это своего рода заготовка. В данном случае, в *.psd формате у нас размечены области для картинки под меню и аватарки группы.
Как видно на втором примере в начале данной статьи, мы можем сделать оформление в едином стиле для аватарки и картинки меню.
При этом визуально ее разрезает на 2 части. Так вот шаблон позволяет сформировать изображение так, чтобы устранить смещение графики и максимально подогнать картинки на один уровень.
Чтобы стало понятнее, вот пример.
Мы видим, что на обеих частях картинки есть полоса с видом на жилой район. Без использования шаблона ровно сделать с первого раза практически нереально. Нужно будет подгонять картинки, вымеряя расхождения вплоть до 1px. В то время как при использовании шаблона мы просто добавляем в него графику в рамках разметки и сразу же получаем желаемый результат.
Хочу отметить, что данный шаблон рассчитан на 1 строку в пояснении. На скриншоте примера там телефоны. Если появится вторая строка, то необходимо будет использовать другой шаблон, либо исправить дизайн вручную.
Мы же тем временем приступаем непосредственно к графическому оформлению своей новой группы. Здесь я выбираю путь наименьшего сопротивления и для поиска частей дизайна отправляюсь в Google Картинки.
Можно использовать и Яндекс. Кому что больше нравится.
Дизайнерского образования у меня нет, поэтому подробно останавливаться на вопросах подбора шрифтов и прочих мелочей не будем. Поколдовав немного в фотошопе, я получил такой результат.
На левом фрагменте (где надпись «Меню») можно также добавить несколько триггеров. В данном случае я решил делать без них. Всё. Дизайн аватарки готов. Жмем в фотошопе сочитание горячих клавиш Shift+Ctrl+Alt+S и сохраняем наши фрагменты в папку на жесткий диск.
Первый этап работы с графикой завершен. Возвращаемся в контакт.
Установка аватара и меню для группы
Щелкаем мышкой на двух типов на месте авы нашей группы и загружаем туда наше изображение. Вот эти ребята, под ними еще написано «Загрузить фотографию».
Добавляем картинку. Указываем поля и выбираем миниатюру. Здесь всё просто и проблем быть не должно.
После чего нам надо добавить картинку ссылку на наше будущее меню. Здесь немного сложнее. Для работы нам потребуется скрипт для создания вики-страниц Вконтакте (его также можно найти в правом меню моего сайта в разделе «Полезные ссылки» — там большая буква В в синем квадратике).
Как мы видим, нужно знать id сообщества. Узнать его очень просто. Находим в своей группе меню (сразу под аватаркой) и открываем «Статистику сообщества». При этом в адресной строке браузера появится что-то похожее (цифры будут другие).
Эти цифры после «?gid=» и есть искомое id группы. Вставляем полученное значение в форму скрипта и пишем название для той страницы, которую хотим создать. В данном случае, я вбиваю «Меню».
Стоит отметить, что страницу создаст лишь в том случае, если окно с группой открыто в соседней вкладке. Проще говоря, вы должны быть авторизованы в вк в этом же браузере. Ведь на подобные манипуляции есть доступ только у администратора группы и назначенных им людей. Случайный прохожий не сможет вот так запросто взять и поменять настройки группу, в админку которой он не имеет доступа.
Если всё сделано правильно, откроется вот такая страница.
Это то самое окно, где мы чуть позже сделаем вики-разметку и создадим внутреннее меню для своей группы.
Пока что нам достаточно написать здесь что-нибудь. После чего нажимаем синюю кнопку «Сохранить страницу» и вверху жмем на ссылку Вернуться к странице.
Я у себя написал «Меню» и моя страница после сохранения стала выглядеть следующим образом.
Дизайна еще никакого нет, но сейчас нам нужна лишь ссылка на эту страницу. Забираем ее в адресной строке браузера и возвращаемся на главную страницу нашей группы. В ленту.
Здесь создаем пост следующего содержания: вставляем туда картинку и ссылку на страницу меню для группы.
Нажимаем отправить. После чего щелкаем по времени отправки сообщения и выбираем там среди всех вариантов пункт «Закрепить». Обновляем страничку (клавиша F5 на клавиатуре) и, если всё сделано правильно, получаем первый результат: группа обрела аватарку и ссылку для перехода в раздел меню.
Wiki-разметка меню группы Вконтакте
Теперь займемся оформлением непосредственно самой менюшки. Снова идем в фотошоп и создаем дизайн для нашего меню.
При проектировании интерфейса нужно помнить о тех людях, которые будут заходить в вк через приложение с мобильных телефонов. Иными словами, у нас не должно быть мелких элементов и кроме того нужно постараться сделать всё как можно понятнее. Чтобы не нужно было гадать, как здесь всё устроено и куда нам нажать… а просто ткнуть в нужный пункт и изучать искомую информацию.
Не буду сейчас останавливаться подробно на том, как именно я собирал меню. Вот, что у меня получилось.
Минимум полей. Вертикальная раскладка. Идеальный формат для адаптивного меню. То есть, на мобилах ничего никуда не поедет. Всё будет в точности, как на экранах компьютеров и планшетов. Ширину беру 500 px, чтобы потом ничего не ужалось и не потерять в качестве изображения дважды. Высота не принципиальна.
Разрезаем изображение на фрагменты и сохраняем их.
Всё. Настало время заключительного аккорда — собираем меню уже в самой группе.
Для этого возвращаемся на главную страницу группы (там, где лента и наша ссылка-картинка, ведущая в меню).
Щелкаем мышкой на изображение меню и попадаем на ту самую страничку, которую ранее создали для менюшки.
Если вы администратор или создатель группы (в нашем случае это так и есть), то в верху страницы будет ссылка «Редактировать». Щелкаем по ней.
Затем переходим в режим wiki-разметки (под кнопкой закрыть в верхнем правом углу странички нарисована такая рамочка с внутри). Когда нужный режим активирован, данная кнопка обведена серым.
После чего тыкаем в иконку фотоаппарата и добавляем сразу все фрагменты нашего меню. В режиме вики самих картинок мы не увидим, лишь код этих изображений с размерами и параметрами.
Я хочу расположить меню по центру и чтобы между фрагментами не было никаких зазоров. Поэтому каждый из элементов обертываем в тег и к уже вложенному параметру «noborder» дописываю второй параметр «nopadding». Первый отключает обводку фрагментов и границы у ячеек таблиц. Второй убирает отступы от края.
Первый и последний элементы меню не должны быть кнопками — у меня на рисунке это всего лишь графический элемент без ссылки на внутреннюю страницу, поэтому к ним прописываем дополнительно параметр «nolink».
Это уберет возможность щелкнув по данному элементу открыть в отдельном окне кусочек картинки. От щелчка мышки теперь вообще ничего не произойдет. Это обычный фон страницы. Неактивный.
В моем случае код меню выглядит следующим образом.
Отдельно хочу отметить тот факт, что после импорта картинок в вк встроенная система порой неверно указывает размеры изображений. Поэтому за этим нужно внимательно следить и выставлять именно те, которые мы планировали на этапе проектирования дизайна. В противном случае всё может разъехаться и пазл в итоге не сложится.
Когда мы прописали код и выровняли все элементы, сохраняем страничку и видим тоже самое, что было в фотошопе.
Остался последний штрих — нужно создать те самые страницы, куда будет отправлять людей наше меню. Для этого вновь обратимся к скрипту по генерации wiki-страниц и на этот раз заказываем сразу три страницы. При этом также необходимо что-нибудь на каждой написать и не забыть сохранить куда-то их адреса из адресной строки браузера.
После чего вставляем в вики-код менюшки ссылки на новые страницы в виде page-102302049_51013384, где первое число — это id группы, а второе — номер страницы. Хотя, это в общем-то и не важно. Ведь нам нужно всего лишь скопировать этот фрагмент URL и вставить в разметку.
В итоге код меню принимает следующий вид.
Внешне же ничего не изменилось. Зато, когда мы щелкаем мышкой по элементам меню, видно, что теперь оно работает!
Как видите, ничего сложного. Дальше структуру можно развивать подобным образом сколь угодно долго: из меню делать ссылки на разделы. В разделах оформлять новые менюшки и так снова и снова.
Что касается самой разметки и правил, по которым пишется код, советую почитать специально посвященную этому делу группу Вконтакте. Ребята описали все ключевые моменты и в их каталоге без труда можно найти необходимый элемент и выяснить, как добавить его на свою вики-страничку.
Ссылки по теме статьи:
Как сделать меню в группе в ВК: вики-разметка
Социальные сети давно вошли в жизнь большинства людей и являются важной составляющей в ней.
Многие люди даже умудряются создавать свои виртуальные бизнесы в них: накрутка лайков, подписчиков, продажа товаров как из других стран, так и авторских. Почти все они имеют группу. А как пользователям донести быстрее всего, чем занимается человек или даже целая организация? Создать специальное меню, в котором будет содержаться самая необходимая информация. И именно здесь нам понадобится Wiki-разметка. Как сделать меню группы ВК? Что добавить в неё? В статье будут рассмотрены правила создания и примеры.
Чем является Wiki-разметка?
Как сделать меню группы ВК? Вики-разметка — вот хороший помощник! Это очень эффективный и удобный способ оформления группы в социальной сети «ВКонтакте». Эта разметка по принципу своего действия очень напоминает html код. Но для людей, не связанных с программированием, она будет более понятной благодаря простоте реализации. Своё название вики-разметка получила благодаря «Википедии», где многие пользователи впервые смогли ознакомиться с основными особенностями её функционирования. Вики-разметка позволяет людям без знаний в программировании быстро и легко оформлять внешний вид группы:
- Создавать графические спойлеры и таблицы.
- Форматировать текст и изображения.
- Работать с якорями и ссылками.
Как сделать меню группе ВК? Рекомендации бывают так нужны, но в целом, можно разобраться и с помощью хорошего руководства. Если говорить о html, то для его изучения и работы с ним необходимо было посидеть несколько суток или даже неделю. Вики-разметка при хорошей памяти требует только совсем немного времени. Как же её можно создать? Какие есть подходы? Вот мы будет говорить о технологии, а кто её сделал? Мы разберемся, как сделать меню группе ВК. Уорд Каннингем же впервые ввёл понятие «вики» (в переводе с гавайского значит «быстрый»).
Способы создания вики-разметок
Нужно задать себе не только вопрос: «Как сделать меню в группе в ВК», но и уточнить, как это реализовать. Можно выбрать несколько путей. Каждый из них зависит от направленности и цели группы. Итак, что может быть:
- Если группа имеет социальное направления, то можно создать текстовое меню. Преимущества ему отдают благодаря более серьезному внешнему виду.
- Группам коммерческого и развлекательного характера желательно сделать ставку на графическое меню. Использование в нём изображений позволит обратить внимание пользователей на то, что должно быть на виду. Применение такого подхода позволит вам также сделать пребывание в группе более приятным и расслабляющим.
В качестве примера работы будет рассмотрена работа с картинками и фотографиями, как делать таблицы, вставлять ссылки, открывать и многое другое. Конечно, это далеко не весь функционал, но оформить меню своей группы таким образом можно будет легко и с довольно значительным размахом.
Работа с изображениями
Как сделать меню в группе в ВК, которое было бы красивым? В социальной сети «ВКонтакте» вставить фотографию или картинку при помощи вики-разметки предоставляется возможным только в тех случаях, когда они загружены в фотоальбомы сайта. Итак, заходим в него, выбираем нужную фотографию и копируем её адрес. К примеру, пускай он будет такой: photo12345_67890. Теперь необходимо его взять в двойные квадратные скобки. Должен получиться такой результат: [[photo12345_67890]]. А что, если к фотографии или картинке следует прикрепить текст или ссылку? А может, есть желание немного отредактировать внешний вид? Тогда с этим поможет следующее: необходимо, чтобы у файла был такой вид — [[ photo12345_67890|options|text/link]]. Вместо трех последних слов подставляется то, что надо. Text — пишем то, что нужно. Думается, особенных объяснений не надо. Link переводится с английского как «ссылка». Указывается для того, чтобы машина пользователя знала, куда ей необходимо идти. Options — здесь могут устанавливаться такие значения:
- Plain — ссылка на изображение оформлена как текст, в ней отсутствует картинка.
- Noborder — убирается рамка около фотографии.
- Box — изображение открывается в окне.
- Nolink — ссылка на фотографию убирается.
- Nopadding — пробелы между изображениями не отображаются.
- NNNxYYYpx или NNNpx — указывают, какой размер будет иметь картинка в пикселях. Первый вариант предусматривает ширину и высоту. При желании можно «сжать» картинку. И второй вариант предусматривает редактирования ширины.
Как создавать таблицы с использованием вики-разметки?
Обычно и графическому, и текстовому меню необходим элемент, который позволяет представить данные в удобном виде, а именно таблицы. Без них мало какая группа в «ВКонтакте» обходится. Чтобы создать таблицу в вики-разметке, необходимо использовать определённый набор символов. Предлагаем ознакомиться, за какой функционал они отвечают:
- {| — так обозначается начало таблицы. Обойтись без него при создании данного элемента невозможно, он является обязательным атрибутом.
- | — используется, чтобы давать ячейкам эффект прозрачности.
- |+ — с помощью этого набора символов располагают название таблицы по центру. Это не обязательный атрибут, но он должен быть размещен сразу после знаков, что обозначают начало.
- |- — так обозначают новые строки (в том числе и для ячеек).
- ! — даёт тёмный цвет. При эго отсутствии необходимо использовать знак из пункта №2.
- |} — набор символов, которые обозначает конец таблицы. Он является необязательным атрибутом. Но использовать его всё же рекомендуется, чтобы предотвратить возникновение ошибки.
Как же проводится заполнение ячейки? Все данные, которые должны быть внесены в них, помещают после знаков |. При желании отделить ячейки одну от другой необходимо просто продублировать его таким образом: ||. Всё рассказанное до этого момента может выглядеть не слишком понятно, но это сейчас будет исправлено с помощью примера.
Создание меню группы в социальной сети «ВКонтакте» с помощью вики-разметки: пример реализации
Здесь будут использованы опции noborder и nolink. Они уберут рамку картинки и ссылку. Также у изображений будет изменён размер, а вторая строка ячеек таблицы будет иметь тёмную заливку, благодаря использованию атрибута !. А вот и сам пример:
{| |- |”’Новое в науке”’|| |- ![[photo12345_67890|nolink;noborder;150x70px| ]]!! |- | [[Новости науки|Новости]] [[Открытия]] | [[Конференции]] [[Разработки]] [[Книги]] [[Симпозиумы]] | Разделы: [[Медицина|1]] | [[Физика|2]] | [[Математика|3]] | [[Экономика|4]] [[Химия|5]] | [[Биология|6]] | [[Программирование|7]] | [[Электротехника|8]] |-
|}
Как видите, ответ на вопрос: «Как сделать меню в группе в ВК?» весьма лёгок.
Важность Wiki-разметки при продвижении своего проекта
Использование данных наработок позволяет придать группе свой атмосферный вид и создать чувство уюта. Конечно, для полноценного оформления следовало бы иметь ещё возможность устанавливать тему страницы, но это пока не реализовано в социальной сети. Поэтому знайте, читающие эти строки, что вы не зря заинтересовались тем, как сделать меню в группе в ВК.
Заключение
Вот, теперь читателям известно, как сделать меню в группе ВК, чтоб было красиво. Как видите, данный функционал является полезным и одновременно достаточно легким в реализации. Но прежде чем создавать меню, необходимо продумать, что и как должно быть организовано, и что следует выделить. Ведь неправильная оптимизация может сделать только хуже.
Вики разметка вконтакте меню. Баннер для группы Вконтакте, создать бесплатно! Информация о предстоящих мероприятиях
Думаю, каждый, кто активно пользуется соц сетью Вконтакте, уже встречал красиво оформленные группы и паблики. Многие из них имеют помимо меню еще и множество стилизованных вложенных страниц, каталоги и прочее, что по сути создает небольшой сайт прямо внутри социалки.
Вот несколько примеров, чтобы все понимали, о чем речь.
Такие группы позволяют выделиться среди своих конкурентов и привлекать больше пользователей. Особенно, если еще и контент интересный:)
В рамках данной статьи мы поговорим о том, как это всё делается. Чтобы более подробно всё разобрать и вникнуть во все тонкости, возьмем конкретный пример. Будет небольшой мастер-класс по оформлению групп.
Самый первый этап нашей работы — это идея. Нужно понять, о чем мы хотим рассказать и кому. В контакте есть несколько форматов сообществ и выбирать стоит с учетом поставленных задач. Хотя в дальнейшем группу можно перевести в формат паблика и наоборот.
Объясняю на пальцах. Паблик — это что-то сравни блогу. Лента новостей. Иными словами, мы рассказываем своим подписчикам о каких-то вещах и они не смогут писать на стене нашего сообщества. Максимум — комментировать.
Группа позволяет создать более открытое к беседе и обсуждениям сообщество, где люди смогут от своего имени делать посты в ленте. В неё также можно добавлять друзей из своего списка. В паблике такой возможности нет. Кроме того, в группе немного больше возможностей по интегрированию вики-разметки (здесь есть раздел «Новости», в который можно интегрировать меню).
Глобально можно рассуждать так: если нам нужно создать сообщество для магазина, то я бы взял формат «паблик». Если же речь идет, например, о любителях рыбалки, то лучше взять «группу». Хотя, каждый волен поступать так, как считает нужным. Ведь в любой момент формат можно будет изменить. Однако, имейте в виду, что Вконтакте вводит ограничение на повторное изменение формата сообщества и после первого раза нужно будет ждать несколько дней до того момента, как вы сможете всё вернуть назад при необходимости. Поэтому тестировать функционал лучше до того, как группа начнет наполняться контентом.
В рамках данного мастер-класса я в качестве отправной точки возьму игру Mad Max по мотивам одноименного фильма, которая вышла буквально пару недель назад и создам сообщество для игроков с различными материалами по этой игре. Главная цель — слив трафика на свой игровой сайт.
Формат будет «Группа», так как нужно создать естественный приток аудитории и максимально расширить общение внутри сообщества. Сразу уточню, что буду использовать универсальную методику, которую можно применять как в формате группы, так и в паблике. Это работает везде.
Контента море, начинаем воплощать идею в жизнь!
Создание группы
Чтобы создать группу, переходим в «Мои группы» в правом меню аккаунта Вконтакте и нажимаем на синюю кнопку вверху «Создать сообщество».
Должно появиться вот такое окошко, где мы вводим название для нашей группы и выбираем формат.
Введя необходимую информацию перед нами открывается панель управления нашим сообществом. В моем случае она выглядит следующим образом.
Как вы видите, я добавил немного параметров: включил видео, аудиозаписи, обсуждения и еще ряд возможностей, которые мне пригодятся в дальнейшей работе при сборе контента. Всё это можно будет в дальнейшем изменять без каких-либо ограничений. Также я прописал адрес своего сайта. Если у вас сайта нет, либо же его тематика не соответствует формату сообщества (они о разных вещах и никак не связаны друг с другом), то эту строку можно оставить пустой.
Возрастные ограничения я ставлю в данном случае от 18, по аналогии с теми, что разработчики выставили игре. Хотя я практически не сомневаюсь, что играют и дети.
Всё. Группа создана!
Теперь можно начинать ее оформлять.
Оформление группы Вконтакте
Этот этап можно разбить на 2 составляющие: графическая и техническая. Для работы нам потребуется шаблон для создания аватарки группы и меню, а также немного воображения и базовые знания фотошопа (он же Adobe Photoshop).
Шаблон разметки
Что представляет из себя шаблон и что это вообще такое? Шаблон — это своего рода заготовка. В данном случае, в *.psd формате у нас размечены области для картинки под меню и аватарки группы.
Как видно на втором примере в начале данной статьи, мы можем сделать оформление в едином стиле для аватарки и картинки меню. При этом визуально ее разрезает на 2 части. Так вот шаблон позволяет сформировать изображение так, чтобы устранить смещение графики и максимально подогнать картинки на один уровень.
Чтобы стало понятнее, вот пример.
Мы видим, что на обеих частях картинки есть полоса с видом на жилой район. Без использования шаблона ровно сделать с первого раза практически нереально. Нужно будет подгонять картинки, вымеряя расхождения вплоть до 1px. В то время как при использовании шаблона мы просто добавляем в него графику в рамках разметки и сразу же получаем желаемый результат.
Хочу отметить, что данный шаблон рассчитан на 1 строку в пояснении. На скриншоте примера там телефоны. Если появится вторая строка, то необходимо будет использовать другой шаблон, либо исправить дизайн вручную.
Мы же тем временем приступаем непосредственно к графическому оформлению своей новой группы. Здесь я выбираю путь наименьшего сопротивления и для поиска частей дизайна отправляюсь в Google Картинки. Можно использовать и Яндекс. Кому что больше нравится.
Дизайнерского образования у меня нет, поэтому подробно останавливаться на вопросах подбора шрифтов и прочих мелочей не будем. Поколдовав немного в фотошопе, я получил такой результат.
На левом фрагменте (где надпись «Меню») можно также добавить несколько триггеров. В данном случае я решил делать без них. Всё. Дизайн аватарки готов. Жмем в фотошопе сочитание горячих клавиш Shift+Ctrl+Alt+S и сохраняем наши фрагменты в папку на жесткий диск.
Первый этап работы с графикой завершен. Возвращаемся в контакт.
Установка аватара и меню для группы
Щелкаем мышкой на двух типов на месте авы нашей группы и загружаем туда наше изображение. Вот эти ребята, под ними еще написано «Загрузить фотографию».
Добавляем картинку. Указываем поля и выбираем миниатюру. Здесь всё просто и проблем быть не должно.
Как мы видим, нужно знать id сообщества. Узнать его очень просто. Находим в своей группе меню (сразу под аватаркой) и открываем «Статистику сообщества». При этом в адресной строке браузера появится что-то похожее (цифры будут другие).
Эти цифры после «?gid=» и есть искомое id группы. Вставляем полученное значение в форму скрипта и пишем название для той страницы, которую хотим создать. В данном случае, я вбиваю «Меню».
Стоит отметить, что страницу создаст лишь в том случае, если окно с группой открыто в соседней вкладке. Проще говоря, вы должны быть авторизованы в вк в этом же браузере. Ведь на подобные манипуляции есть доступ только у администратора группы и назначенных им людей. Случайный прохожий не сможет вот так запросто взять и поменять настройки группу, в админку которой он не имеет доступа.
Если всё сделано правильно, откроется вот такая страница.
Это то самое окно, где мы чуть позже сделаем вики-разметку и создадим внутреннее меню для своей группы. Пока что нам достаточно написать здесь что-нибудь. После чего нажимаем синюю кнопку «Сохранить страницу» и вверху жмем на ссылку Вернуться к странице.
Я у себя написал «Меню» и моя страница после сохранения стала выглядеть следующим образом.
Дизайна еще никакого нет, но сейчас нам нужна лишь ссылка на эту страницу. Забираем ее в адресной строке браузера и возвращаемся на главную страницу нашей группы. В ленту.
Здесь создаем пост следующего содержания: вставляем туда картинку и ссылку на страницу меню для группы.
Нажимаем отправить. После чего щелкаем по времени отправки сообщения и выбираем там среди всех вариантов пункт «Закрепить». Обновляем страничку (клавиша F5 на клавиатуре) и, если всё сделано правильно, получаем первый результат: группа обрела аватарку и ссылку для перехода в раздел меню.
Wiki-разметка меню группы Вконтакте
Теперь займемся оформлением непосредственно самой менюшки. Снова идем в фотошоп и создаем дизайн для нашего меню. При проектировании интерфейса нужно помнить о тех людях, которые будут заходить в вк через приложение с мобильных телефонов. Иными словами, у нас не должно быть мелких элементов и кроме того нужно постараться сделать всё как можно понятнее. Чтобы не нужно было гадать, как здесь всё устроено и куда нам нажать… а просто ткнуть в нужный пункт и изучать искомую информацию.
Не буду сейчас останавливаться подробно на том, как именно я собирал меню. Вот, что у меня получилось.
Минимум полей. Вертикальная раскладка. Идеальный формат для адаптивного меню. То есть, на мобилах ничего никуда не поедет. Всё будет в точности, как на экранах компьютеров и планшетов. Ширину беру 500 px, чтобы потом ничего не ужалось и не потерять в качестве изображения дважды. Высота не принципиальна.
Разрезаем изображение на фрагменты и сохраняем их.
Всё. Настало время заключительного аккорда — собираем меню уже в самой группе.
Для этого возвращаемся на главную страницу группы (там, где лента и наша ссылка-картинка, ведущая в меню). Щелкаем мышкой на изображение меню и попадаем на ту самую страничку, которую ранее создали для менюшки.
Если вы администратор или создатель группы (в нашем случае это так и есть), то в верху страницы будет ссылка «Редактировать». Щелкаем по ней.
Затем переходим в режим wiki-разметки (под кнопкой закрыть в верхнем правом углу странички нарисована такая рамочка с внутри). Когда нужный режим активирован, данная кнопка обведена серым.
После чего тыкаем в иконку фотоаппарата и добавляем сразу все фрагменты нашего меню. В режиме вики самих картинок мы не увидим, лишь код этих изображений с размерами и параметрами.
Я хочу расположить меню по центру и чтобы между фрагментами не было никаких зазоров. Поэтому каждый из элементов обертываем в тег
и к уже вложенному параметру «noborder» дописываю второй параметр «nopadding». Первый отключает обводку фрагментов и границы у ячеек таблиц. Второй убирает отступы от края.Первый и последний элементы меню не должны быть кнопками — у меня на рисунке это всего лишь графический элемент без ссылки на внутреннюю страницу, поэтому к ним прописываем дополнительно параметр «nolink». Это уберет возможность щелкнув по данному элементу открыть в отдельном окне кусочек картинки. От щелчка мышки теперь вообще ничего не произойдет. Это обычный фон страницы. Неактивный.
В моем случае код меню выглядит следующим образом.
Отдельно хочу отметить тот факт, что после импорта картинок в вк встроенная система порой неверно указывает размеры изображений. Поэтому за этим нужно внимательно следить и выставлять именно те, которые мы планировали на этапе проектирования дизайна. В противном случае всё может разъехаться и пазл в итоге не сложится.
Когда мы прописали код и выровняли все элементы, сохраняем страничку и видим тоже самое, что было в фотошопе.
Остался последний штрих — нужно создать те самые страницы, куда будет отправлять людей наше меню. Для этого вновь обратимся к скрипту по генерации wiki-страниц и на этот раз заказываем сразу три страницы. При этом также необходимо что-нибудь на каждой написать и не забыть сохранить куда-то их адреса из адресной строки браузера.
После чего вставляем в вики-код менюшки ссылки на новые страницы в виде page-102302049_51013384, где первое число — это id группы, а второе — номер страницы. Хотя, это в общем-то и не важно. Ведь нам нужно всего лишь скопировать этот фрагмент URL и вставить в разметку.
В итоге код меню принимает следующий вид.
Внешне же ничего не изменилось. Зато, когда мы щелкаем мышкой по элементам меню, видно, что теперь оно работает!
Что касается самой разметки и правил, по которым пишется код, советую почитать специально посвященную этому делу группу Вконтакте. Ребята описали все ключевые моменты и в их каталоге без труда можно найти необходимый элемент и выяснить, как добавить его на свою вики-страничку.
Перед тем как углубиться в вики — разметку, создавая интерактивное меню , необходимо сделать некоторые подготовительные действия, в первую очередь, изменить некоторые настройки в группе. Нажимаем на «Управление сообществом», открываем «Обсуждения», и подключаем «Материалы».
Теперь переходим к подготовке изображений. Если Вы не работаете с графическими редакторами, то придется обратиться к фрилансерам. Дальнейшая работа будет показана с применением Фотошопа, но может быть выполнена и в других редакторах.
Заготавливаем шаблон для группы ВКонтакте согласно изображению.
Размеры окна А, в котором будет размещаться меню, могут отличаться от указанных. Все зависит от того, какие размеры Вы зададите кнопкам меню. В предложенном варианте предусмотрено по одной кнопке в строчку. Если же Вам нужно разместить по две кнопки в строчку, то ширину окна А нужно уменьшить до 377 рх максимум. Высота этого окна в большинстве случаев подбирается опытным путем. В предложенном варианте высота в 377 рх выбрана при размещении на передней странице группы каждого элемента информации в одну строчку.
Далее подготавливаем подходящее изображение, прописываем надписи и раскраиваем весь рисунок на участки, с учетом того, что каждый отдельный участок, с соответствующей надписью, будет служить кнопкой меню. Как все это сделать, здесь мы углубляться не будем, так как эта статья не урок по Фотошопу.
Сохранив и удалив ненужные фрагменты (фотошоп кроит и сохраняет всё изображение и белые поля тоже), переименуем фрагменты, пронумеровав их по порядку их расположения в меню.
Теперь переходим непосредственно к группе. После корректировки настроек, на стене появились две вкладки: «Свежие новости» и «Обсуждения». Кликаем по «Новая тема» в закладке обсуждений и создаем первую страничку нашего меню.
Её нужно назвать в соответствии с именем на графическом меню и заполнить поле с описанием. После заполнения всей необходимой информации, нажимаем «Создать тему».
На стене появится созданное сообщение. Таким же путем создаем нужное нам количество (в соответсвии с разделами меню) страниц.
После завершения подготовительных операций можем переходить к редактированию нашего меню. Для этого нам понадобится вкладка «Свежие новости». Наводим курсор на нее и нажимаем на «Редактировать».
Далее нам откроется уже знакомое . Находясь в визуальном режиме редактирования, при помощи нажатия на значок фотоаппарата в редакторе загружаем все фрагменты в той последовательности, в какой они располагаются в общем изображении. Также меняем название на более понятное для наших посетителей. После этого переключаемся в режим wiki — разметки и редактируем код.
Образец кода для рассматриваемого меню:
[]
[]
[]
[]
Важно иметь в виду, что для фрагментов, не выполняющих роль кнопки необходимо вместо ссылки на страничку прописывать «nolink». Иначе, фрагмент будет кликабельным, и при каждом нажатии на него будет открываться сам фрагмент, как отдельное изображение.
Если все сделано правильно и не допущено никакой ошибки в коде, то при возврате в нашу группу и после нажатия на название вкладки (Главное меню группы) откроется созданное нами меню, которое смотрится, как одно целое вместе с аватаром. Интерактивное меню и графическое оформление группы представляют собой единую композицию. При нажатии на разделы меню мы попадаем в соответствующие разделы группы.
Если меню не совпало по нижнему уровню с аватаром, в коде в нижнем фрагменте, меняя высоту в рх, добейтесь выравнивания. Если это отобразилось на качестве рисунка, то в исходном шаблоне графического редактора внесите изменения в размер нужного фрагмента и перекроите макет.
Мы рассмотрели, как сделать интерактивное меню или оформить группу в стиле wiki. Если возникнут вопросы по самому процессу подготовки, пишите в комментариях и вместе попробуем решить их.
Думаю, каждый, кто активно пользуется соц сетью Вконтакте, уже встречал красиво оформленные группы и паблики. Многие из них имеют помимо меню еще и множество стилизованных вложенных страниц, каталоги и прочее, что по сути создает небольшой сайт прямо внутри социалки.
Вот несколько примеров, чтобы все понимали, о чем речь.
Такие группы позволяют выделиться среди своих конкурентов и привлекать больше пользователей. Особенно, если еще и контент интересный:)
В рамках данной статьи мы поговорим о том, как это всё делается. Чтобы более подробно всё разобрать и вникнуть во все тонкости, возьмем конкретный пример. Будет небольшой мастер-класс по оформлению групп.
Самый первый этап нашей работы — это идея. Нужно понять, о чем мы хотим рассказать и кому. В контакте есть несколько форматов сообществ и выбирать стоит с учетом поставленных задач. Хотя в дальнейшем группу можно перевести в формат паблика и наоборот.
Объясняю на пальцах. Паблик — это что-то сравни блогу. Лента новостей. Иными словами, мы рассказываем своим подписчикам о каких-то вещах и они не смогут писать на стене нашего сообщества. Максимум — комментировать.
Группа позволяет создать более открытое к беседе и обсуждениям сообщество, где люди смогут от своего имени делать посты в ленте. В неё также можно добавлять друзей из своего списка. В паблике такой возможности нет. Кроме того, в группе немного больше возможностей по интегрированию вики-разметки (здесь есть раздел «Новости», в который можно интегрировать меню).
Глобально можно рассуждать так: если нам нужно создать сообщество для магазина, то я бы взял формат «паблик». Если же речь идет, например, о любителях рыбалки, то лучше взять «группу». Хотя, каждый волен поступать так, как считает нужным. Ведь в любой момент формат можно будет изменить. Однако, имейте в виду, что Вконтакте вводит ограничение на повторное изменение формата сообщества и после первого раза нужно будет ждать несколько дней до того момента, как вы сможете всё вернуть назад при необходимости. Поэтому тестировать функционал лучше до того, как группа начнет наполняться контентом.
В рамках данного мастер-класса я в качестве отправной точки возьму игру Mad Max по мотивам одноименного фильма, которая вышла буквально пару недель назад и создам сообщество для игроков с различными материалами по этой игре. Главная цель — слив трафика на свой игровой сайт.
Формат будет «Группа», так как нужно создать естественный приток аудитории и максимально расширить общение внутри сообщества. Сразу уточню, что буду использовать универсальную методику, которую можно применять как в формате группы, так и в паблике. Это работает везде.
Контента море, начинаем воплощать идею в жизнь!
Создание группы
Чтобы создать группу, переходим в «Мои группы» в правом меню аккаунта Вконтакте и нажимаем на синюю кнопку вверху «Создать сообщество».
Должно появиться вот такое окошко, где мы вводим название для нашей группы и выбираем формат.
Введя необходимую информацию перед нами открывается панель управления нашим сообществом. В моем случае она выглядит следующим образом.
Как вы видите, я добавил немного параметров: включил видео, аудиозаписи, обсуждения и еще ряд возможностей, которые мне пригодятся в дальнейшей работе при сборе контента. Всё это можно будет в дальнейшем изменять без каких-либо ограничений. Также я прописал адрес своего сайта. Если у вас сайта нет, либо же его тематика не соответствует формату сообщества (они о разных вещах и никак не связаны друг с другом), то эту строку можно оставить пустой.
Возрастные ограничения я ставлю в данном случае от 18, по аналогии с теми, что разработчики выставили игре. Хотя я практически не сомневаюсь, что играют и дети.
Всё. Группа создана!
Теперь можно начинать ее оформлять.
Оформление группы Вконтакте
Этот этап можно разбить на 2 составляющие: графическая и техническая. Для работы нам потребуется шаблон для создания аватарки группы и меню, а также немного воображения и базовые знания фотошопа (он же Adobe Photoshop).
Шаблон разметки
Что представляет из себя шаблон и что это вообще такое? Шаблон — это своего рода заготовка. В данном случае, в *.psd формате у нас размечены области для картинки под меню и аватарки группы.
Как видно на втором примере в начале данной статьи, мы можем сделать оформление в едином стиле для аватарки и картинки меню. При этом визуально ее разрезает на 2 части. Так вот шаблон позволяет сформировать изображение так, чтобы устранить смещение графики и максимально подогнать картинки на один уровень.
Чтобы стало понятнее, вот пример.
Мы видим, что на обеих частях картинки есть полоса с видом на жилой район. Без использования шаблона ровно сделать с первого раза практически нереально. Нужно будет подгонять картинки, вымеряя расхождения вплоть до 1px. В то время как при использовании шаблона мы просто добавляем в него графику в рамках разметки и сразу же получаем желаемый результат.
Хочу отметить, что данный шаблон рассчитан на 1 строку в пояснении. На скриншоте примера там телефоны. Если появится вторая строка, то необходимо будет использовать другой шаблон, либо исправить дизайн вручную.
Мы же тем временем приступаем непосредственно к графическому оформлению своей новой группы. Здесь я выбираю путь наименьшего сопротивления и для поиска частей дизайна отправляюсь в Google Картинки. Можно использовать и Яндекс. Кому что больше нравится.
Дизайнерского образования у меня нет, поэтому подробно останавливаться на вопросах подбора шрифтов и прочих мелочей не будем. Поколдовав немного в фотошопе, я получил такой результат.
На левом фрагменте (где надпись «Меню») можно также добавить несколько триггеров. В данном случае я решил делать без них. Всё. Дизайн аватарки готов. Жмем в фотошопе сочитание горячих клавиш Shift+Ctrl+Alt+S и сохраняем наши фрагменты в папку на жесткий диск.
Первый этап работы с графикой завершен. Возвращаемся в контакт.
Установка аватара и меню для группы
Щелкаем мышкой на двух типов на месте авы нашей группы и загружаем туда наше изображение. Вот эти ребята, под ними еще написано «Загрузить фотографию».
Добавляем картинку. Указываем поля и выбираем миниатюру. Здесь всё просто и проблем быть не должно.
Как мы видим, нужно знать id сообщества. Узнать его очень просто. Находим в своей группе меню (сразу под аватаркой) и открываем «Статистику сообщества». При этом в адресной строке браузера появится что-то похожее (цифры будут другие).
Эти цифры после «?gid=» и есть искомое id группы. Вставляем полученное значение в форму скрипта и пишем название для той страницы, которую хотим создать. В данном случае, я вбиваю «Меню».
Стоит отметить, что страницу создаст лишь в том случае, если окно с группой открыто в соседней вкладке. Проще говоря, вы должны быть авторизованы в вк в этом же браузере. Ведь на подобные манипуляции есть доступ только у администратора группы и назначенных им людей. Случайный прохожий не сможет вот так запросто взять и поменять настройки группу, в админку которой он не имеет доступа.
Если всё сделано правильно, откроется вот такая страница.
Это то самое окно, где мы чуть позже сделаем вики-разметку и создадим внутреннее меню для своей группы. Пока что нам достаточно написать здесь что-нибудь. После чего нажимаем синюю кнопку «Сохранить страницу» и вверху жмем на ссылку Вернуться к странице.
Я у себя написал «Меню» и моя страница после сохранения стала выглядеть следующим образом.
Дизайна еще никакого нет, но сейчас нам нужна лишь ссылка на эту страницу. Забираем ее в адресной строке браузера и возвращаемся на главную страницу нашей группы. В ленту.
Здесь создаем пост следующего содержания: вставляем туда картинку и ссылку на страницу меню для группы.
Нажимаем отправить. После чего щелкаем по времени отправки сообщения и выбираем там среди всех вариантов пункт «Закрепить». Обновляем страничку (клавиша F5 на клавиатуре) и, если всё сделано правильно, получаем первый результат: группа обрела аватарку и ссылку для перехода в раздел меню.
Wiki-разметка меню группы Вконтакте
Теперь займемся оформлением непосредственно самой менюшки. Снова идем в фотошоп и создаем дизайн для нашего меню. При проектировании интерфейса нужно помнить о тех людях, которые будут заходить в вк через приложение с мобильных телефонов. Иными словами, у нас не должно быть мелких элементов и кроме того нужно постараться сделать всё как можно понятнее. Чтобы не нужно было гадать, как здесь всё устроено и куда нам нажать… а просто ткнуть в нужный пункт и изучать искомую информацию.
Не буду сейчас останавливаться подробно на том, как именно я собирал меню. Вот, что у меня получилось.
Минимум полей. Вертикальная раскладка. Идеальный формат для адаптивного меню. То есть, на мобилах ничего никуда не поедет. Всё будет в точности, как на экранах компьютеров и планшетов. Ширину беру 500 px, чтобы потом ничего не ужалось и не потерять в качестве изображения дважды. Высота не принципиальна.
Разрезаем изображение на фрагменты и сохраняем их.
Всё. Настало время заключительного аккорда — собираем меню уже в самой группе.
Для этого возвращаемся на главную страницу группы (там, где лента и наша ссылка-картинка, ведущая в меню). Щелкаем мышкой на изображение меню и попадаем на ту самую страничку, которую ранее создали для менюшки.
Если вы администратор или создатель группы (в нашем случае это так и есть), то в верху страницы будет ссылка «Редактировать». Щелкаем по ней.
Затем переходим в режим wiki-разметки (под кнопкой закрыть в верхнем правом углу странички нарисована такая рамочка с внутри). Когда нужный режим активирован, данная кнопка обведена серым.
После чего тыкаем в иконку фотоаппарата и добавляем сразу все фрагменты нашего меню. В режиме вики самих картинок мы не увидим, лишь код этих изображений с размерами и параметрами.
Я хочу расположить меню по центру и чтобы между фрагментами не было никаких зазоров. Поэтому каждый из элементов обертываем в тег
и к уже вложенному параметру «noborder» дописываю второй параметр «nopadding». Первый отключает обводку фрагментов и границы у ячеек таблиц. Второй убирает отступы от края.Первый и последний элементы меню не должны быть кнопками — у меня на рисунке это всего лишь графический элемент без ссылки на внутреннюю страницу, поэтому к ним прописываем дополнительно параметр «nolink». Это уберет возможность щелкнув по данному элементу открыть в отдельном окне кусочек картинки. От щелчка мышки теперь вообще ничего не произойдет. Это обычный фон страницы. Неактивный.
В моем случае код меню выглядит следующим образом.
Отдельно хочу отметить тот факт, что после импорта картинок в вк встроенная система порой неверно указывает размеры изображений. Поэтому за этим нужно внимательно следить и выставлять именно те, которые мы планировали на этапе проектирования дизайна. В противном случае всё может разъехаться и пазл в итоге не сложится.
Когда мы прописали код и выровняли все элементы, сохраняем страничку и видим тоже самое, что было в фотошопе.
Остался последний штрих — нужно создать те самые страницы, куда будет отправлять людей наше меню. Для этого вновь обратимся к скрипту по генерации wiki-страниц и на этот раз заказываем сразу три страницы. При этом также необходимо что-нибудь на каждой написать и не забыть сохранить куда-то их адреса из адресной строки браузера.
После чего вставляем в вики-код менюшки ссылки на новые страницы в виде page-102302049_51013384, где первое число — это id группы, а второе — номер страницы. Хотя, это в общем-то и не важно. Ведь нам нужно всего лишь скопировать этот фрагмент URL и вставить в разметку.
В итоге код меню принимает следующий вид.
Внешне же ничего не изменилось. Зато, когда мы щелкаем мышкой по элементам меню, видно, что теперь оно работает!
Что касается самой разметки и правил, по которым пишется код, советую почитать специально посвященную этому делу группу Вконтакте. Ребята описали все ключевые моменты и в их каталоге без труда можно найти необходимый элемент и выяснить, как добавить его на свою вики-страничку.
С помощью вики-разметки можно оформить меню группы, аналитические статьи, кейсы, инструкции. Конечно, на это нужно будет потратить чуть больше времени, чем на оформление привычных постов на стене. Но чем больше вы заморочитесь с оформлением контента — тем благодарнее будет ваша аудитория.
Как работает вики-разметкаВики-разметка — это язык, который используется для верстки страниц. Условно его можно назвать младшим братом HTML. На вики-страницах удобно писать и форматировать текст, вставлять иллюстрации, видео, ссылки, таблицы. Можно сверстать простую статью или составить целый интерактивный гайд с главами и подзаголовками.
Ширина любой вики-страницы — 607px. Высота ограничивается только количеством знаков, всего их может быть около 16 000.
Вся вики-разметка держится на тегах, как и HTML. Есть одиночные теги (например,
— перенос строки) и парные (например, жирный текст).
Как работают теги для текста в вики-разметке
В некоторых случаях вики-разметка использует упрощенный синтаксис (теги заменены на типографские знаки). Например, для создания маркированного списка используются звездочки «*», а для нумерованного — решетки «#».
Как работают типографские знаки в вики-разметке
Все существующие теги и методы их использования собраны в официальном сообществе вики-разметки ВКонтакте . Используйте материалы этого сообщества как надежную шпаргалку. А в этой статье мы пройдемся по основным принципам работы с вики-разметкой и пошагово покажем, как с ее помощью создавать страницы и меню группы.
В стандартном редакторе вики-страниц есть два режима: визуальный и режим вики-разметки (кнопка переключения выглядит так: ).
Так выглядит активный режим вики-разметки
Примитивный текст с парой картинок можно сверстать в визуальном режиме. Это обычный редактор текста и не требует никаких знаний вики-разметки. Но если вам нужна аккуратная вики-страница с таблицами, ссылками и встроенными видео, это можно сделать только в режиме разметки — при помощи кода.
Как создать вики-страницуКнопки «Создать новую страницу» в интерфейсе самого ВКонтакте не существует. Поэтому рассказываем о двух способах, стандартном и продвинутом (при помощи приложения).
СтандартныйДля группы. Зайдите в «Управление сообществом» → «Разделы» → «Материалы» и выберите пункт «Открытые» или «Ограниченные».
Как включить «Материалы» в группе
Теперь на главной странице группы появится раздел «Свежие новости». Это место для предполагаемого меню группы. Чтобы создать новую страницу, можно написать ее название прямо в режиме редактирования страницы «Свежие новости», заключить его в квадратные скобки, нажать на «Предпросмотр» и получить готовую ссылку на новую страницу.
Как создать новую страницу через «Свежие новости»
Для паблика. Чтобы создать новую страницу, нужно узнать id вашего паблика. Для этого зайдите в раздел «Статистика сообщества». В адресной строке браузера вы увидите примерно такой код:
https://vk.com/stats?gid= 123456789
Искомое id группы — это все цифры после «gid=».
Теперь нужно ввести в адресную строку браузера такой код:
https://vk.com/pages?oid=-ХХХ&p=Нaзвание_страницы
Вместо ХХХ подставляем id паблика, вместо «Нaзвание_страницы» — то название, которое вы придумали. В названии можно использовать кириллицу, латиницу и цифры. Специальные символы использовать не запрещено, но лучше не рисковать: из-за них у вас может пропасть возможность редактирования страницы. Вставляем все данные на нужные места, нажимаем Enter, и браузер откроет созданную страницу.
С помощью приложенияРазработчики ВКонтакте рекомендуют к использованию три приложения для работы с вики-разметкой: «Мобивик» , «Исходный код» и «Вики Постер» .
В этом руководстве мы возьмем для примера приложение «Мобивик». В ноябре 2017 года оно получило второй приз в программе ВКонтакте по поддержке стартапов (Start Fellows). Работает без установки и дополнительной регистрации в десктопной, мобильной версии ВКонтакте и в приложении для телефона (разработчик рекомендует использовать версии не ранее Android 5.1, iOS 9 и Windows Phone 8.1).
Чтобы создать новую страницу, на главном экране приложения выберите нужную группу и введите название новой страницы, а затем нажмите «Получить ссылку».
Как создать новую страницу с помощью приложения «Мобивик»
Ссылки на новую вики-страницу в приложении «Мобивик»
А вот лайфхак для тех случаев, когда вы сделали сложную страницу с большим количеством элементов, и боитесь, что верстка поедет на маленьком экране. Скопируйте адрес из пункта «Код для вики-страницы». Зайдите в режим редактирования своей страницы и вставьте его в самое начало кода. Вы получите такое изображение:
Когда пользователь нажмет на него, он попадет в приложение «Мобивик», которое покажет аккуратную мобильную версию вашей страницы.
Слева — страница меню сообщества LIVE, открытая на мобильном,
справа — она же, но открытая через «Мобивик»
Как найти страницу, созданную ранее? Самый простой и надежный метод — заранее скопировать все адреса вики-страниц в отдельный файл, например, в Google Таблицах. Другой способ — через любое приложение для работы с вики-страницами. Например, зайдите в «Мобивик», выберите название сообщества и нужную страницу, кликните «Получить ссылку» и скопируйте адрес из пункта «Ссылка на вики-страницу».
Как получить ссылку на ранее созданную вики-страницу
Скопируйте ссылку на вики-страницу и вставьте в новую запись на своей стене или на стене сообщества. Если все сделано правильно, сайт сгенерирует ссылочный блок под текстовым полем записи. Теперь удалите сам текст ссылки, прикрепите баннер и нажмите «Отправить». В десктопной версии баннер тоже станет ссылкой на вики-страницу, а в мобильной — будет открываться как обычная картинка.
Прикрепленная к посту картинка станет частью ссылки на вики-страницу в десктопной версии
Возможности оформления текста в вики-разметке в целом не отличаются от возможностей рядового текстового редактора. При редактировании непосредственно текста (сделать жирным, выровнять по правому краю и т. д.) используем теги вики-разметки, не забываем их закрывать: Текст по центру .
Для структурирования текста в вики-разметке предусмотрены сочетания типографских знаков. Например, такой код « —- » поставит в тексте горизонтальную разделяющую полосу, а такой « :: » — двойной отступ перед абзацем.
На одну страничку можно поместить около 16 тысяч знаков.
СсылкиЧтобы вместо адреса был виден текст, добавляем название ссылки:
[] — на профиль пользователя
[] — на главную страницу сообщества
[] — на другую вики-страницу
[] — на встречу ВКонтакте
КартинкиПредельная ширина изображения, которое можно использовать в вики-разметке, — 607px, это и есть ширина самой вики-страницы. Высота практически не ограничена (помним, что высота самой страницы — 16 000 знаков). Изображения можно загрузить двумя способами.
С помощью загрузчика в верхнем меню редактора.
С помощью кода. Загружаем картинку в отдельный альбом группы, открываем ее, в адресной строке видим длинный код наподобие этого
https://vk.com/club12345678?z= photo-12345_12345 %2Falbum-12345678_12345678
Копируем из него id картинки (выделено жирным). Дальше обрамляем это двойными квадратными скобками и вставляем в нужные места на странице. Получается примерно так:
[]
Что дальше? Отредактируйте выравнивание, обтекание текстом, размер, привяжите ссылку. Для этого напишите нужные параметры после вертикальной черты и через точку с запятой. Например, в таком коде мы задали для картинки размер 300x100px и обтекание текстом справа:
ВидеоДля начала нужно загрузить видео в видеозаписи сообщества. После загрузки открыть видео и скопировать из адресной строки его id (выделено жирным).
https://vk.com/videos-12345678?z= video-12345_12345 %2Fclub12345678%2Fpl_-12345678_-2.
Обрамляем это квадратными скобками и получаем такой код:
Получаем небольшую картинку со значком play, при нажатии на который разворачивается полноценный видеоплеер. Чтобы видео воспроизводилось на самой странице, разработчики ВК предлагают воспользоваться тегом player .
Но здесь мы получаем непропорциональную черную рамку вокруг видео:
Чтобы ее убрать, нужно подогнать размер плеера под размер самого видео. Например, в нашем случае подошли такие параметры:
Мы получили видео без черных рамок, оно будет воспроизводиться прямо на странице
Если вы хотите красиво структурировать содержимое вики-страницы и обеспечить ей аккуратное отображение на мобильных устройствах, без таблицы не обойтись. Здесь вам понадобятся такие простые знаки:
При работе с таблицами можно использовать 4 тега: noborder (делает рамки таблицы невидимыми), nomargin (делает таблицу во всю ширину вики-страницы), nopadding (убирает отступы в ячейках) и fixed (позволяет создать таблицу фиксированных размеров). Сколько ячеек вы укажете в строке, столько столбцов будет в таблице.
Вот пример таблицы 2×2 без отступов сверху и снизу текста внутри ячеек:
Ширина первого столбца — 200px, ширина второго — 300px.
Вот что из этого получилось:
В ячейки таблицы можно поместить текст, картинки, аудио- и видеозаписи.
Как сделать вики-менюМеню группы ВК — это не какой-то отдельный функционал, а попросту вики-страница с несколькими картинками, в каждую из которых зашита ссылка на определенную страницу. На самом деле здесь все просто.
- Готовим обложку для меню. Можно взять любую подходящую картинку и нанести на нее текст. А можно нанять дизайнера, который отрисует вам красивые блоки и кнопки. У нас будет меню на 6 кнопок. Для этого нам нужна картинка, где будут обозначены эти кнопки. Определимся с ее размером.
При подготовке картинки для меню помните, что ширина вики-страницы — 607 px, Ширина картинки не должна быть больше, иначе изображение ужмется и потеряет в качестве. Для примера мы взяли изображение размером 510х300 px.
- Режем эту картинку на 6 частей (по части на каждую кнопку). Это удобно делать в Adobe Photoshop инструментом «Раскройка». Если не хотите заморачиваться, воспользуйтесь, например, онлайн-сервисом IMGonline (режет картинки на равные части). Мы же сделали все в Photoshop.
При активном инструменте «Раскройка» кликаем правой кнопкой мыши по картинке и выбираем «Разделить фрагмент», указываем нужное количество фрагментов и нажимаем «ОК».
Как разрезать картинку в Photoshop
Наше меню будет оформлено в виде таблицы из 6 ячеек: в три строки и два столбца. Для этого мы нарезали картинку для меню на 6 равных частей размером 255×100 px. Такой же размер нужно будет проставить для каждой ячейки.
- Создаем каркас для таблицы. Заходим в режим редактирования новой страницы и делаем таблицу. Открываем ее тегом {| и сразу задаем три важных параметра:
- nopadding — разрешит картинкам соприкасаться
- noborder — скроет видимые границы таблицы
- fixed — позволит задать точные размеры ячеек.
Указываем фиксированную ширину ячеек — 255px 255px (два раза, потому что столбцов тоже два). Дальше устанавливаем места для начала новых строк тегом |- и новых ячеек (столбцов) тегом | . Закрываем таблицу тегом |} и получаем такой каркас:
- Помещаем картинки в ячейки и задаем для них ссылки . Поочередно открываем в альбоме сообщества нужные части картинки, копируем из строки браузера их id ( photo-12345_12345) , заключаем в двойные квадратные скобки, прописываем размеры 255x100px и тег nopadding для склеивания картинок. После вертикальной черты назначаем ссылку для каждой кнопки. Получаем такой код.
{|noborder nopadding fixed
|~255px 255px
|-
| []
|-
| []
| []
|-
| []
| []
|}
- Готово! Нажимаем «Сохранить страницу» — и получаем удобное меню для сообщества.
Готовое меню группы в десктопной версии
Готовое меню группы в мобильной версии
Если вы делали меню для группы , то оно будет легко доступно по клику на «Свежие новости» (кстати, эту страничку можно переименовать на «Меню» в режиме редактирования).
Если вы делали меню для паблика , то его можно поместить на видное место под названием сообщества при помощи закрепленной записи.
Чтобы закрепить меню в группе , опубликуйте запись с баннером и ссылкой на вики-страницу от имени сообщества (если опубликовать от своего имени, закрепить страницу будет невозможно). В паблике проблем с закреплением не будет: там можно закрепить запись любого автора.
Как сделать пост со ссылкой на меню в паблике
Как закрепить меню сообщества
Администрация ВКонтакте объявила о запуске редактора статей 22 декабря 2017 года и позиционирует его как инструмент для публикации лонгридов.
Некоторые пользователи решили, что он создан взамен вики-разметки. Но пока такие выводы делать рано, ведь функционал редактора еще достаточно скудный. В нем нельзя редактировать медиафайлы (размер и выравнивание) и делать таблицы, а гиперссылки можно присвоить только тексту. Здесь нет тегов и кода, есть только визуальный режим, как в обычном текстовом редакторе.
Из этого видно, что сделать удобное меню для сообщества или вики-лендинг по-прежнему можно только с помощью вики-разметки. Что будет дальше — время покажет.
Так выглядит интерфейс нового редактора статей ВКонтакте
- Стандартный метод создания вики-страниц кропотливый и не очень удобный. Проще всего создать страницу через приложение «Мобивик», «Исходный код» или «Вики Постер».
- Меню сообщества нужно сделать таблицей, чтобы оно аккуратно смотрелось на мобильных устройствах.
- При редактировании вики-страницы в стандартном интерфейсе не стоит переключаться между визуальным режимом редактирования и режимом вики-разметки. Из-за этого может поехать верстка.
Запоминать все теги необязательно, достаточно держать под рукой ссылку на
Для оформления группы в социальной сети есть удобная и простая wiki-разметка для группы В Контакте. Она действует аналогично html коду, но интуитивно более легка и понятна для простого пользователя, владельца группы. Такая разметка применяется в Wikipedia (свободной энциклопедии), и отсюда пошло ее название.
Wiki-разметкой можно оформить группу своеобразно или традиционно, при этом лезть в дебри html, где можно застрять на недели, вам не придется. Разметка wiki настолько проста в изучении, что покорится самому неопытному пользователю всего лишь за один час. Эта разметка справляется и с форматированием рисунка и текста, якорями, спойлерами, ссылками, графическими таблицами и другими элементами, способными качественно изменить внешний вид любой группы.
Меню в контакте возможно создать несколькими способами, и выбор их обусловлен направленностью и тематикой группы ВК. Для социальных и коммерческих групп пользователи предпочитают использовать серьезные текстовые меню, а для развлекательных — графические.
Разметка вики прекрасно подходит для работы с фотографиями или любыми изображениями, но при соблюдении нескольких хитростей. Изображение, вставленное wiki-разметкой, появится только если оно присутствует в альбоме. С помощью простой манипуляции фотография (например: photo55775_55775 ) сразу появится на странице. Для этого надо скопировать ее адрес и добавить к нему двойные квадратные скобки.
Выглядит это так — [] — и применима такая разметка к любому изображению, которое есть в альбомах. Дополнив разметку, можно вместе с изображением вставить и текст, и ссылку, тем самым меняя его внешний вид.
Для этого надо применить такую вики разметку — []. Слово «options» можно заменить другими значениями, каждое из которых изменит вид фотографии. А значения следующие:
- noborder сделает рисунок без рамки;
- nopadding соединит вместе изображения, убрав между ними пробелы;
- plain сделает из рисунка ссылку;
- NNNpx позволит изменить размер картинки;
- box откроет в новом окне.
Работа с таблицами при помощи Вики-разметки?
И меню с графикой, и меню с картинками невозможны без специальных таблиц. Выучив несложный набор кодов и символов, вы научитесь быстро создавать таблицы для своей группы ВКонтакте. Вот так выглядят символы:
- {| без этого первоначального символа невозможно создать таблицу;
- |+ необязательный символ, с помощью которого таблица располагается по центру
- |- с этого символа начинается новая строка;
- | этот символ отвечает за прозрачность ячеек;
- ! с помощью этого символа можно сделать ячейку темного цвета;
- |} этим необязательным символом заканчивается таблица.
Вот такое меню получится из следующего очень простого кода:
{|
|-
|
|-
![]!![]!![]
|-
|
[[Новинки online игр|Новинки]]
[[Головоломки]]
|
[[Шарики]]
[[Квесты]]
[[Аркады]]
[[Обсуждения игр]]
|-
|}
Оформление ссылок с помощью вики
-разметки ?В контакте для оформления группы wiki-разметкой можно использовать три вида ссылок.
- Традиционная ссылка:
- Обычная ссылка + текст:
- Ссылка в виде картинки: []
Работа с графическим меню?
Для его создания используется простой алгоритм действий. Но необходимо знать, хотя бы поверхностно, работу Фотошопа и изучить вики разметку. Но графическое меню в развлекательной группе В Контакте выглядит очень привлекательно, и поэтому не пожалейте времени на его создание. Алгоритм такой:
- Нарежьте в редакторе необходимую графику и «сохраните для web»;
- Загрузите графику как обычные картинки, без использования flash, чтобы не ухудшить их качества;
- Соберите меню с помощью специального тега «nopadding»;
- Пропишите внимательно все ссылки;
- Красивое меню для вашей развлекательной группы готово.
Несколько секретов wiki-разметки
Эта разметка не похожа на html код, и некоторые ее особенности можно испробовать лишь экспериментальным способом. Но если вам не по душе эксперименты, изучите следующие особенности, чтобы не допускать ошибок и гадать, почему тот или иной элемент не подчиняется wiki-разметке. Хитрости разметки:
- Допустимая ширина картинки составляет не больше 610px;
- Изменение ширины автоматически меняет и высоту картинки;
- Рисунки меньше 134px меняют качество в худшую сторону;
- В строчке разметки может присутствовать лишь 7 элементов списка;
- Более 18 незакрытых тегов на одной странице приведут к ее искажению и ошибкам.
Приложения программистов для wiki-разметки
Если вам разметка показалась слишком сложной, воспользуйтесь простыми приложениями, которые сами авторы называют учебными уроками. Это если вы хотите изучить секреты разметки. Если наука вам не дается, оформляйте группы ВК с помощью простого визуального редактора, который сам пишет правильный код.
Как оформить группу в контакте. Как создать и установить красивое графическое меню в ВК.
- Оформить группу в контакте? Да, пожалуйста! 😉
Сегодня я продолжу свой пост-сериал «Погружение в группы ВК». В третей части «сериала», я рассказывала и показывала, как создать меню группы в контакте. Сегодня же, поговорим об оформлении меню группы вконтакте!
В первой статье о создании менюшки, в комментах было много вопросов, поэтому прежде чем начать новую тему, отвечу на частые вопросы.
Вопрос 1: Первый и самый распространенный: «где код в меню?» или «если нет закладки при редактировании «Исходный код» как добавить внутреннюю страницу?» или «Я все равно не понимаю, что сделать, если не появляется код!»
Ответ 1: ВК изменил редактор, теперь для переключения между визуальным редактором и кодом всего один клик (правый верхний угол редактора):
Что бы проверить в каком вы редакторе: подведите мышкой на эту кнопку, напишите какой-нибудь текст и выделите его жирным — если появляются не обычные символы, значит — это код
Вопрос 2: Второй, реально проблематичный: «а как убрать пробелы между картинками??»
Ответ 2: Признаю, сама испугалась, когда впервые у клиента «поехала» менюшка. Сейчас я это быстро правлю, а тогда было не весело. Смотрите:
- Добавь тег nopadding; и все станет на свои места!
Шаблон: [[photoцифры_цифры|ширинаxвысотаpx;nopadding;|ссылка на внутреннюю страницу]]
Пример: [[photo7632142_296911703|370x45px;nopadding;|page-32734125_44298120]]
Обычно картинки меню раздвигаются потому, что из кода выпадает nopadding; — вставляем его на место и все выравнивается. Перед тем как сохранять результат, жмите на кнопку «Предпросмотр», что бы убедиться в том, что все ровно стало.
Вопрос 3: Новость. В октябре 2012г., в принудительном порядке, Вконтакте обрезал автары групп и пабликов. Теперь их размер имеет общий стандарт 200х500 пикселей. Так, что если у вас в группе аватар был больше, то сделайте апдейт (обновите аватар).
Кстати, вмести с обрезкой, ВК ввел еще одно нововведение относительно фотографий групп: теперь кликнув на аватар, мы так же как в аккаунте, сможем увидеть все альбомы сообщества. Это удобно! И из этого рисуется новый функционал в коммуникациях группы.
Та-а-ак, с вопросами закончили… теперь переходим к самому созданию меню!
Шаг 1. Как создать меню в контакте и сделать вложенные страницы:Первым делом убедимся в том, что вы знаете, как создать меню группы в контакте и пробежимся по небольшой инструкции:
- Как вам моя шпаргалка? 🙂
Вот такая шпаргалка у меня получилась! 🙂 Для большей ясности, распишу каждую цифру:
- Управление сообществом. Переходим в настройки группы.
- Включаем материалы. Сохраняем изменения (если еще не включили).
- Теперь на главной страницы группы, появилась дополнительная вкладка «Новости группы». Наведем мышкой в правый угол, нажмем на стрелку «Редактировать».
- Изменим название вкладки. Здесь будет у нас меню, поэтому напишем, что-то соответствующее и привлекающее.
- Эта кнопочки переключения между визуальным редактором и кодом. Мы будем производить все работы с кодом wiki разметки, поэтому перейдите именно в этот режим.
- Создадим внутренние, вложенные страницы. Для этого определимся со списком меню, каждое слово меню, возьмем в двойные квадратные кавычки — [[слово]].
- Нажмем кнопку «Предпросмотр».
- Слова станут ссылками!
- Сохраним результат. Не переключайтесь в другой режим, пока не сохранили результат. Кстати, рекомендую периодически сохранять код меню к себе на компьютер.
- Отступление. Доступ к странице. Для открытых групп, эта функция больше не работает.
- Теперь заполним вложенные страницы контентом. Откроем ссылку меню в новом окне. Убедимся, что мы попали именно на ту страницу. Добавив нужное нам слово в квадратные кавычки, мы уже дали вложенной странице название.
- Наполним содержанием эту страницу. Здесь можно добавить как обычный текст, так и новые вложенные страницы, уводящее посетителя вглубь мини сайта. В любом случае, выбор за вами!
- Добавив нужный контент на страницу, сохраним результат.
- Теперь нам нужно, прописать адрес этой страницы. Иначе, если этого не сделать, в адресе страницы будут кракозябрики и в какой-то момент, вы можете потерять все свои вложенные страницы. Для этого копируем подчеркнутые цифры – от слэша до вопросительного знака…
- …и несем этот адрес страницы в наше меню! Помните, оно открыто у вас в соседней вкладке?! 🙂 Вставляем адрес в нужное место.
Проделайте, эту операцию со всеми вложенными страницами и ваше меню будет готово.
Есть! Меню создали, внутренние страницы сделали, заполнили их, теперь перейдем к созданию красивого графического меню. 🙂
Шаг 2. Как создать красивое графическое меню в контакте и поставить его:Всю теорию о том, как устроена wiki разметка в контакте, я вам давать не буду, у нас сейчас другие цели. Для создания визуального меню в группе ВК, всей вики-разметки знать не нужно. Перейдем к созданию визуального меню!
Для начала покажу вам код и результат своего меню:
Признаюсь, я его сделала специально, что бы написать эту статью. Все «руки не доходили», знаете, как «сапожник без сапог». Но теперь и я с визуальным меню в группе ВК! 🙂
Как рисовать картинку для меню, я рассказывать не буду, это дело дизайнеров, я сама рисую, но не столь профессионально. Здесь, в конце статьи, я давала видео о том, как в фотошопе рисовать простенькое меню, ознакомьтесь, возможно вы справитесь своими силами. Если нет закажите картинку меню у фрилансера.Я покажу вам средний по сложности вариант установки меню. Разница в количестве элементов. Меню, которое разрезается просто на полоски, является самым простым его исполнением. Чем больше кликабельных кнопок в строке, тем более сложно его исполнение. Хотя, зная особенность, все просто! Дело только во времени. Итак, ширина картинки должна быть:
— 370 px – если в строке у вас будет два и более объектов, как у меня кнопочки соц сетей
— и max 388 px – если разрезаем картинку по-простому, только на строки, не разделяя на мелкие объекты. Вот это та особенность, которую нужно знать, при нарезании меню на кнопки. У меня размер картинки всего меню получился 370х456 px.
После того как картинка разрезана на нужное количество объектов и сохранена в отдельный альбом, загружаем этот альбом в ВК. Загружаем в профиль аккаунта, а не в группу! Так как в альбомах группы больше нет возможности скрывать альбомы. Технических альбом в корпоративной (например) группе, совсем не нужен, поэтому прячем элементы меню в альбом аккаунта:
- Технический альбом ВК
После того как вы настроили конфиденциальность «Только Я». Переходим к установке самого меню. Дам вам пример кода, что бы был для вас шаблоном и разберем из чего он состоит:
[[photo7632142_296911699|370x101px;nopadding;|http://frilka.com]]
где, photo7632142_296911699 – это адрес картинки! Его мы смотрим в адресной строке картинки:
- С первой картинки, начнем вставлять меню в группу вконтакте
Вам нужен короткий адрес картинки, для этого перейдите в сам альбом:
- Перейдите в сам альбом, что бы получить нужный адрес картинки!
…и начиная с первой картинки, переносите их в меню группы.
Далее, идет разделительная черта «|» и размер картинки 370x101px; — что бы его узнать, нужно открыть альбом на компьютере, выделить нужную картинку и посмотреть какого она размера:
- Добавляем размер картинки в код меню!
Итак, адрес картинки добавили, размер указали, теперь ставим, тег nopadding; — он нужен для того, что бы наши картинки плотно прилегали друг к другу. И последним этапом ставим ссылочку на страницу, куда будет попадать посетитель, после того как кликнет на картинку.
Здесь небольшое уточнение! Внешние ссылки, ссылки на альбомы ВК и обсуждения пишем полностью, а ссылки на внутренние страницы в формате page-32734125_44298120 . В начале и конце строки, не забываем ставить по две квадратные кавычки и без пробелов.
Уточнение 2: когда мы ссылаемся на внутренние страницы без картинок, то для обсуждений, альбомов и внешних ссылок ставим одинарные квадратные кавычки.
Строчки, в которых у вас два и более элемента, в код вставляем без пробелов. Вставляйте каждую строку картинки друг за другом. Потому, что если вы нажмете Enter после строки с картинкой, то картинка перепрыгнет на новую строку и меню сдвинется. Нам нужно, что бы меню отображалось цельным, поэтому ни каких лишних пробелов и «иртеров» нам не надо! 🙂
После того как вы перенесли все картинки в меню и оформили их (размер, ссылка), сохраняем результат и любуемся своей работой! Все! Готово!
Буду рада, если я смогла вам донести информацию. Расскажите, как у вас получилось с установкой меню! Ответила ли я на ваши вопросы или нет? Может кто, что хочет добавить? Буду рада общению в комментариях. Источник статьи — Копилка Фрилансера Марины Лазаревой http://frilka.com/Создание меню группы в контакте. Меню для группы вКонтакте, шаблоны оформления
Если вы активно занимаетесь продвижением своей группы и хотите сделать её более , то вам наверняка известно, что красиво оформленная группа – это очень важный аспект развития вашего бренда, но перед тем, как задуматься об оформление паблика Вконтакте, следует подумать о предназначении своей группы ВК!
Как правило, SMM специалист после завершения создания группы ВК начинает её наполнение. Именно контент способен задерживать людей в группе. Но только необходимо сделать это качественно и грамотно! После того, как в группе будут присутствовать: описания, записи на стену, альбомы с фото и видео, аудио записи, следует приступить к внедрению функционального меню. И пусть в начале пути меню будет не суперски красивым, как мы привыкли наблюдать в начале работы, а довольно простеньким. В первую очередь важна полезность имеющегося контента!
В данной статье вы найдете информацию о том, как создать меню группы вк самостоятельно! Поэтому если вы озадачены вопросом: как сделать меню группы вконтакте, этот обзор для вас!
Быстрая навигация:
Что такое меню группы
Меню можно считать перечнем всех имеющихся функций паблика. Посредством меню вы сможете выставить все важные элементы в одном аккуратном и красивом списке, задать для определенной ссылке индивидуальную иконку или изображение, выслать оповещения для посетителей о намеченных изменениях быстро и доступно. В меню можно отображать такие элементы: всевозможные ссылки на сторонние сайты, выноски на обсуждения, музыку, альбомы и другие подразделы внутри сайта ВК, изображения и обычная структура вашего паблика. Исходя из инструкций ниже, вы сможете собственными усилиями сделать меню для своего сообщества Вконтакте.
Создание меню группы Вконтакте онлайн
Если раньше для создания меню приходилось утруждать себя внесением различных кодов, что достаточно сложно для людей, которые не имеют навыков в программировании, то теперь создать качественное и красивое меню группы в контакте онлайн можно с использованием специализированных серисов.
Итак, сейчас подробней рассмотрим, как работают подобные конструкторы. Стоит заметить, что все они имеют идентичный функционал, поэтому разобравшись в одном вы сможете свободно работать в любом из них.
Принцип создания меню можно разделить на несколько шагов:
Шаг 1. Определитесь с шаблоном для оформления.
На сайтах, позволяющих создавать группу по шаблонам работают дизайнеры-профессионалы, которые качественно рисуют десятки шаблонов разного стиля и цвета. Вы сможете выбрать тот, который подойдет именно для вашей группы. В последующем у вас будет возможность в любое время изменить шаблон.
Шаг 2. Определите количество кнопок.
Примите решение о том, сколько кнопок-ссылок на различные страницы будет присутствовать в вашем меню.
Шаг 3. Укажите ссылки и надписи.
Шаг 4. Проверка и экспорт.
Удостоверьтесь в том, что выполненное меню работает так как вы этого хотели и потом выгрузите его в свое сообщество. Сервисы самостоятельно произведут все нужные картинки, сформируют код, и с вашего позволения, загрузят всё в ваш паблик.
Шаг 5. Внесений изменений.
Если у вас возникнет необходимость внесения правок, допустим, добавить новых кнопок, исправления ссылок и надписей, изменить оформление, просто перейдите в свой аккаунт, сделайте изменения и произведите экспорт меню заново.
Как вы уже сами убедились, сформировать качественное, доступное и красивое меню с помощью специальных серверов – это лучший вариант для администраторов ВК. Стоит заметить, что подобные серверы предлагают бесплатные услуги только на один раз – пробный. Последующее использование ресурсов подобного рода необходимо оплачивать. Но, не смотря, на это результат использования функционала несомненно оправдает ваши вложения.
Баннер для группы Вконтакте, создать бесплатно!
Есть специализированные сайты, где без особых усилий и программного обеспечения, Вы сможете сделать себе красивый баннер для группы Вконтакте. Например https://bannermakers.ru/banners-vk/ .
Кроме создания меню таким образом есть так же способы сделать меню в группе вк и другим образом. Об этом читайте ниже.
Меню ВК вики разметка
Вики-разметка — отличный помощник в создании красивого и эффективного сообщества! Это очень удобный и эффективный способ оформления паблика в популярной сети «ВКонтакте». Эта разметка по схеме своего действия очень схожа с html кодом. Но для тех, кто не связан с программированием,
она будет достаточно понятней за счет простоты реализации. Своё название данная разметка обрела благодаря «Википедии», где многочисленные пользователи в первый раз получили возможность ознакомиться с главными особенностями её функций. Вики-разметка дает возможность людям без навыков в программировании легко и быстро оформлять группу:
· Создавать спойлеры и таблицы графическим способом.
· Форматировать изображения и текст.
Итак, перейдем к разбору как же сделать меню сообществу ВК?
Конечно, в процессе оформления меню группы дополнительные рекомендации могут потребоваться, но в целом с принципом создания, можно разобраться и используя данное руководство. Если рассматривать html, то для его исследования и работы с ним нужны провести несколько суток или около недели. Работа же с Вики-разметкой при хорошей памяти потребует только некоторое время. Как же её нужно создавать? Какие нужно применять подходы?
Немного остановимся на ее истории, а затем уже поговорим о технологии. Уорд Каннингем впервые познакомил людей с понятием «вики», которое в переводе с гавайского языка означает «быстрый». Таким образом, он выразил простоту и скорость в использовании разметки.
Быстрое оформление
Теперь мы рассмотрим вопросы: «Как сделать меню в группе в ВК», и уточним, как его эффективно реализовать. В процессе можно пойти несколькими путями, каждый из которых имеет свое направление и приводит к конечной цели – наличие качественного меню группы.
Будем разбираться по порядку. Если группа несет в себе смысл социального направления, то можно внедрить текстовое меню. Его преимущества заключаются в серьезном внешнем виде. Сообществам коммерческого и развлекательного типа желательно определить ставку на меню — графику. Не стоит забывать о том, что существуют уже готовые шаблоны для меню группы вк. Использование изображений обратит внимание посетителей на то, что должно присутствовать на виду. Использование такого подхода даст вам возможность сделать нахождение в группе более увлекательным и расслабляющим. Вики – разметка позволяет сделать меню группы с картинками и фотографиями, делать таблицы, внедрять и открывать ссылки, и многое другое. Конечно, это далеко не весь перечень функций, но и оформлять меню своего сообщества легко и с довольно внушительным размахом.
Основы Wiki-разметки в создании меню для группы ВК
Создать меню группы ВК, красивым и интересным вам позволят тематические картинки и фотографии. Важно знать, что «ВКонтакте» вставить необходимую фотографию или картинку с использованием вики-разметки предоставляется возможным только тогда, когда они уже загружены в альбомы сайта. Итак, заходим в альбом, определяемся с нужной фотографией и копируем её адрес. Допустим, пускай он будет таким: photo14523_90678. Теперь нужно его захватить в двойные квадратные скобки. Должен быть такой итоге: []. А что, если к картинке или фотографии нужно прикрепить ссылку или тект? А может, есть необходимость отредактировать внешний образ? Тогда здесь поможет следующее действие: нужно, чтобы файл имел такой вид — [[ photo14523_90678|options|text/link]], и вместо трех последних слов нужно подставить то, что надо. Text — вписываем то, что нужно. Здесь наверняка дополнительные объяснения будут неуместны. Link в переводе с английского — «ссылка». Обозначается для того, чтобы машина посетителя понимала, куда ей необходимо идти. Options — здесь устанавливаются такие значения:
Noborder — удаляется рамка, расположенная около фотографии. Box — изображение расположено в окне.
Nopadding — пробелы между картинками не отображаются.
NNNxYYYpx или NNNpx — указывают на размер картинки (в пикселя).
Как правило, к текстовому и графическому меню группы вк необходимо встраивать элемент, позволяющий представить информацию в удобном для посетителя виде, а именно таблицы. Без нее обходится мало какое сообщество в «ВКонтакте». Чтобы создать таблицу используя вики-разметку, нужно применять определённый перечень символов. Далее вы ознакомитесь, за какой функционал отвечает тот или иной символ:
{| — обозначение начала таблицы. Обойтись без этого символа при создании таблицы невозможно, он обязательный атрибут.
| — применяется, для придания ячейкам эффекта прозрачности.
|+ — с помощью такого набора символов название таблицы располагают по центру. Это вовсе не обязательный атрибут, но он должен размещаться непосредственно после знаков, что характеризуют начало.
|- — так обозначаются новые строки (также и для ячеек).
Оформляет тёмный цвет. При отсутствии этого символа необходимо применять знак из пункта №2.
|} — набор символов, обозначающий конец таблицы. Это необязательный атрибут. Но применять его всё же рекомендуется, для предотвращения возникновения ошибки.
Теперь рассмотрим, как же выполняется заполнение ячейки. Вся информация, которая должна быть внесена в них, помещается после знаков |. При необходимости отделить ячейки одну от другой нужно просто продублировать таким образом: ||.
Теперь вы поэтапно изучили информацию как сделать меню в группе вк посредством вики – разметки. На примере составления меню для своего паблика вам станет еще все более понятней.
Как сделать меню в группе ВК с новым дизайном 2018
Новый дизайн Вк не только внес удобства в функционал сайта, но и некоторые неразберихи для администраторов пабликов. В данном разделе мы поэтапно рассмотрим, как создавать меню для группы в новом дизайне.
Итак, пособие как сделать меню в новой версии ВК быстро и что самое важное без ошибок в коде перед вами. Точно следуя указаниям, вы сможете создать меню сами, правильно и быстро! Начнем!
1. Открываем изображение меню в фотошопе или другом графическом редакторе.
2. Исследуем размер картинки и если он превышает 600пикс по ширине — меняем размер на 600, высота картинки изменяется пропорционально, вручную ее не задаем!
3. Используем инструмент «раскройка» и кроим наше изображение на кнопки.
4. Сохраняем картинку в параметре «для WEB». Теперь работа по фотошоп закончена. Переходим в сообщество.
5. Переходим в настройки сообщества в «Материалы», выбираем «Ограниченные» и жмем «Сохранить».
6. Переходим на главную страницу, во подраздел «свежие новости» кликаем «редактировать».
7. Так мы оказались в Вики редакторе, теперь начнется самая основная деятельность. Изменяем графу «свежие новости» на «меню» или любое иное и кликаем значок фотокамеры, внедряем все нарезанные кусочки из сохраненной папки.
Если вместо кода появляются сразу картинки после входа в редактор вики разметка меню необходимо переключить режим вики разметки!
Теперь перед нами код нашего меню, но его необходимо немного доработать, чтобы удалить пробелы между изображениями. Сейчас наш код выглядит таким образом: [][-][-][-][-]
Перейдя на предосмотр мы заметим, что изображения находятся е там, где должны, и, кроме этого, между ними есть пробелы.
8. Правим код: По умолчанию в вк встроено разрешение на максимальный размер изображения по ширине 400пикс, первая кнопка получается 600, меняем параметры первой кнопки 400x89px на 600рх, высоту указывать не нужен. Так же вписываем в каждую строку такой тег: nopadding обязательно через точку с запятой.
Важно! Не кликайте на ENTER после строк кода если желаете, чтобы у вас две кнопки находились рядом, в одной строке меню. Редактор автоматически перенесет на новую строку те параметры, которые не влазят! Такой код должен быть после правки:
[][-][-][-][-]
Теперь, перейдя в «предпросмотр» мы видим что все находится на своих местах. Добавляем в код необходимые ссылки на каждую из кнопок, для наглядного примера ссылка на первую кнопку здесь некликабельна! Не забывайте убрать лишний пробел между | и ].
[][-][-][-][-]
Убедившись что все сделано, как было задумано, кликаем «сохранить» и возвращаемся к странице. Обратите внимание что в новой версии 2018 отсутствует кнопка «вернуться к странице», поэтому нужно просто кликать на имя страницы вверху.
9. Теперь необходимо закрепить наше меню. Для этого скопируем ссылку на страницу с нашего меню и возвратимся на главную страницу группы.
10. В поле нового сообщения нужно вставить скопированную ссылку. После того как отобразиться кусочек меню ссылку нужно удалить! И посредством значка фотокамеры нужно добавить заранее подготовленное изображение для баннера. Ставим «от имени сообщества», кликая на кружок слева от кнопки «отправить», и жмем на «отправить»
11. Теперь закрепим меню, обновим страницу и оцениваем наш результат. На всю работу, не спеша, затрачивается примерно 15-20 минут.
Как сделать меню в группе ВК с переходами
Теперь рассмотрим, как можно сделать меню группы ВК с переходами.
Итак, как же сделать одно вики меню внутри другого? В первую очередь, должно быть готово первое меню. Будем отталкиваться от уже нарезанной на кнопки картинку. Добавляем раскроенные кусочки изображения через заначек фотокамеры в редакторе вики. Если вместо кода появляются картинки, значит не включен режим вики разметки, перед добавлением изображения нажмите
Не забываем кликать на «Сохранить» внизу страницы! При необходимости можно изменить размер изображения и дописать в код тег nopadding, по умолчанию он отсутствует, а размер картинки должен быть максимум 400 пикселей по ширине, если изображение больше нужно исправить его на нужный размер!
1. После правки кода, сохраняем и кликаем «вернуться».
2. Проверяем в правильности отображения первого меню.
3. Если все как надо, снова кликаем «редактировать».
Теперь нужно создать новую страницу вики где будет расположено второе меню. В самом конце кода пишем значение меню для паблика вк 2, ну или любой нужный вам текст. Сохраняем и возвращаемся обратно. Внизу должна образоваться активная ссылка с новым названием. Для наибольшего удобства открываем ее в другой вкладке браузера.
Пока ваша только что сформированная страница еще пуста, кликаем «редактировать» либо «наполнить содержанием»
Так же как мы действовали в самом начале, прибавляем отрезки второго меню, сохраняем и смотрим как выглядит новое меню.
Если все так как надо — копируем ссылочку на страницу нового меню в адресной строке вашего браузера.
Допустим, новое меню должно открываться при клике на кнопку «Отзывы» первого меню. Нужно пройти во вкладку где мы формировали первое меню и найти третью строку и вставить ссылку из буфера, сохранится и возвратиться.
Таким образом, при клике на кнопку «Отзывы» будет открываться наше второе меню.
Как сделать меню группы ВК с телефона
Если вам «посчастливилось» работать администратором групп ВК или создавать собственную группу имея в наличие лишь телефон, то если приспособиться, вполне можно сделать меню группы с телефона не испытывая при этом больших усилий.
Всем и каждому известно, что создатели ВК предлагают своему пользователю достаточно удобную мобильную версию, и ранее вы уже узнали о разных способах создания меню. Но, вводить вручную коды используя вики разметку возможно, но не совсем удобно. А вот скачать шаблон с сайтов специализированных услуг и вставить в необходимые графы достаточно проще и удобней, причем займет у вас не очень много времени. Таким образом, вы сможете осуществлять администрирование групп Вконтакте просто и удобно.
Меню группы Вконтакте шаблоны
Все вышеописанные методы создать меню группы ВК достаточно просты, и если применить их на практике, можно убедиться в том, что сложного в этом абсолютно ни чего нет. Приспособиться к внедрению картинок и таблиц при помощи вики – разметки достаточно просто и быстро. Но еще быстрей и удобней использовать готовые шаблоны для меню групп, найти которые можно либо на ресурсах, о которых было сказано выше, либо скачать на блогах и сайтах таких же пользователей.
Стоит заметить, что шаблоны подразумевают наличие картинок и изображений различных тематик. Также они имеют разносторонний дизайн. Если у вас нет времени на поиск изображений, или не достаточно фантазии для создания яркого меню, вам лучше использовать уже готовые меню
Приветствую, дорогие друзья и гости блога. Сегодня поговорим про создание менюшек в ВК и как это делать в новом дизайне социальной сети. Есть реально существенные изменения, о которых надо знать так как если меню сделано в старом дизайне, о котором я писал , то картинки могут покоситься.
Меню группы Вконтакте – это ее лицо. Именно его пользователь видит, когда только заходит в сообщество, и от того, насколько все доступно и привлекательно оформлено, во многом зависит, станет ли он постоянным участником группы.
ВАЖНО: После смены общего дизайна в ВК, сменились и размеры картинок для меню в соц.сети. Проверьте свои работы и внесите изменения в группах о которых пойдет речь далее.
Виды меню и их особенности
Первым делом при создании сообщества стоит определиться с его главной целью. Именно от этого зависит будущий дизайн меню и его функциональные особенности.
В зависимости от целей группы, меню может быть:
- для информационной площадки;
- ;
- для обучающей площадки.
Основная часть относится к информационным. Это те сообщества, где пользователю предоставляется какой-либо развлекательный или познавательный контент. Для такой группы целесообразнее всего использовать меню с отображением главных тем. Так, популярные паблики создают разделы: новости, последние публикации, популярные публикации, а также разделы конкретно по тематике группы.
Меню торговой и обучающей пабликов могут быть схожими. Цель и того, и другого – помочь своему пользователю сориентироваться в ассортименте товаров или услуг. Меню для продаж, как правило, включает такие разделы, как Каталог товаров, Оплата, Доставка, Акции и скидки, а для обучения может ограничиться разделами с описанием услуг, так как здесь главное – чтобы пользователь нашел нужную ему обучающую программу или материал.
Как создать меню в группе Вконтакте: пошаговая инструкция
Весь процесс можно разделить на 2 этапа:
- Работа в фотошопе;
- Добавление разделов и картинок в самой группе.
Чтобы точно ответить на вопрос, как создать меню в группе Вконтакте, стоит визуально представить себе будущий дизайн со всеми разделами, а затем, уже в процессе можно добавлять пункты, которые еще приходят в голову.
На первом этапе создается аватарка группы и непосредственно изображения для самого меню. Гармоничнее будет смотреться единое изображение и для аватарки, и для меню.
К выбору или созданию аватарки следует отнестись со всей серьезностью, так как многие пользователь обращают на нее особое внимание. Подходящую картинку можно найти в Интернете и добавить к ней надпись или какие-либо элементы в Фотошопе, а можно самому сделать абсолютно уникальное изображение.
Так как нам необходимо сделать еще и выпадающее меню, ищем или создаем картинку, которая лучше всего подойдет по тематике группы или берем просто красивый фон. Работа с изображением будет происходить в Adobe Photoshop, так как функционала обычных фоторедакторов не хватит на все нужные операции. Все размеры установлены самой социальной сетью Вконтакте и значительные отклонения в большую или меньшую сторону приведут к тому, что аватарка или вообще не загрузится, или не будет единым целым с меню.
Алгоритм действий:
- Открываем Фотошоп и заходим в «файл» — «создать» и устанавливаем ширину и высоту: 760X500 соответственно.
- Выбираем инструмент «раскройка», а затем – «разделить фрагмент». Делим изображение на 3 части по горизонтали. Для фрагмента с левого или правого края в выпадающем окне (в зависимости от того, какую часть хотите видеть на аватарке) пишем значения ширины и высоты – 200XXи Y) – 560 и 0. Это будет аватарка группы.
- Для следующего фрагмента устанавливаем значения ширины и высоты – 50X500, а в координатах пишем 510 и 0. Это пространство между аватаркой группы и меню. Данная часть в дальнейшем не понадобится.
- Снова выбираем «разделить фрагмент» и делим по вертикали на 2 части. Для фрагмента сверху устанавливаем значения: ширина – 510, высота – 182, координаты – 0. Это пространство над меню. Данную часть также не будет видно в группе.
- Теперь копируем на созданный и разделенный объект выбранную или созданную картинку. Если горячие клавиши CTRL+V не поддаются, просто откройте место на компьютере, где сохранено изображение, и перетащите его в Фотошоп.
- Оставшееся пространство делим по вертикали на такое количество фрагментов, сколько разделов будет в меню. Для них значения можно не устанавливать.
Пишем название каждого раздела.
- Последний шаг – сохранение изображений. Необходимо сохранить картинки так: файл – сохранить для Web. Этот способ подойдет для более поздних версий Фотошоп. Если в разделе «файл» надписи «сохранить для Web» нет, значит, поступаем следующим образом:
Заходим в пункт «файл», выбираем «экспортировать» — «сохранить для Web». Все параметры оставляем как есть. Снова жмем «сохранить».
Выбираем папку на компьютере и сохраняем туда изображения. Они должны выглядеть в итоге вот таким образом:
Теперь приступаем ко второму этапу, чтобы точно разобраться, как создать меню в группе Вконтакте – непосредственно добавлению меню в паблик. Для этого:
- В первую очередь нужно подключить Материалы, так как добавлять какие-либо разделы на главной странице можно только так. Чтобы сделать это заходим в Управление сообществом и в самом низу страницы выбираем «Материалы», а затем – «открытые». Сохраняем изменения.
- Загружаем все фотографии в группу, кроме аватарки и тех частей, которые не понадобятся. Чтобы фотографии отобразились на главной странице нужно зайти снова в Управление сообществом и нажать напротив вкладки «фотографии» — «открытые».
- Загружаем аватарку.
- Следующий шаг- включение режима wiki-разметки. Сделать это можно, нажав иконку с ромбиками в правой части страницы в разделе «редактировать».
- Здесь же вставляем код для разметки: [], где [] — ссылка на раздел или страницу, куда будет осуществляться переход путем нажатия на фотографию. Можно добавлять, как ссылки на разделы в самом Вконтакте, так и на внешние ресурсы.
- Данный код дублируется столько раз, сколько разделов в меню, каждый раз вставляя ссылки.
При желании меняем также вкладку «свежую новости», например, на «меню.
- Жмем «сохранить страницу», возвращаемся в главный раздел группы и обновляем страницу. Меню по умолчанию закрытое, но пользователь, нажав на соответствующее название, сможет открыть его разделы и перемещаться по ним.
На этом весь процесс закончен, но обязательно стоит проверить, работают ли ссылки и совпадают ли границы фото.
Сервисы для создания меню группы
Если вы так и не поняли, как создать меню в группе Вконтакте и пошаговая инструкция вам не помогла, можно воспользоваться специальными сервисами, которые создадут и даже добавят красиво
оформленное меню в группу.
Одним из наиболее популярных сервисов является MenuMake. После подачи заявки заказ будет готов уже через 5 минут, а затем по желанию меню будет добавлено в группу. При этом учитываются все пожелания заказчика по дизайну и количеству разделов.
С уважением, Галиулин Руслан.
Итак, для создания открытого меню, нам понадобится изображение, которое будет играть роль открытого меню. Изображения, которые мы добавляли в статье о создании графического меню не подойдут, так как необходимо изображение развернутого меню, а не каждого пункта в отдельности. Кроме того, можно использовать абсолютно любое изображение, которое будет указывать, что оно скрывает меню группы. Например, изображение с надписью: «Меню группы». Или что-то в этом роде.
После того, как мы подобрали изображение, которое будем использовать. При этом размер изображения может быть практически любой, который возможно загрузить в фотоальбом. (UPD: Это не совсем точная информация. Точнее о размерах можно прочитать в комментарии ниже. Для этого, просто нажмите на ссылку: /otkrytoe-menyu-gruppy-vkontakte/#comment-7633)
Переходим в группу вконтакте. И правой кнопкой мыши открываем меню, если оно уже создано, в новой вкладке.
После этого, на странице с меню, нужно нажать на ссылку «Редактирование».
Но при этом не нужно изменять код. Просто нажимаем на ссылку «Вернуться к странице». Это нужно, для получения ссылки на страницу с меню.
Теперь, когда мы вернулись обратно на страницу с меню. В адресной строке мы увидим ссылку на эту страницу, без различным дополнений в адресе. Иначе говоря — чистую ссылку. Она-то нам и нужна.
Оставляем эту страницу открытой и возвращаемся в группу Вконтакте. Здесь нам необходимо создать запись, в которую добавить изображение, которое будет играть роль открытого . Для этого, внизу выберем «прикрепить фотографию». И выбираем изображение либо из альбома, либо загружаем с компьютера.
Когда изображение добавлено в запись, мы ее пока не публикуем.
А возвращаемся на страницу меню и из адресной строки копируем адрес страницы меню группы вконтакте. И вставляем скопированный адрес меню, в запись, которую мы еще не сохранили. Выглядеть конечный результат должен примерно так:
После того, как мы добавили ссылку, внизу появилось название страницы и адрес на нее. Когда внизу появилась страница, мы можем удалить ссылку, которую только что вставили в запись. После чего, нажимаем на кнопку «Отправить». Тем самым, мы опубликовали нашу запись на стене группы.
Теперь нажимаем на дату новости.
После чего, закрываем запись и обновляем страницу группы вконтакте. Теперь в самом верху, если все сделано правильно, у вас появится изображение меню, которое играет роль открытого меню вконтакте. При этом, ссылки в меню неактивны. А активна одна ссылка на данную запись.
Теперь, когда пользователь окажется в нашей группе он увидит имитацию меню. А после нажатия на открытое меню группы вконтакте, он окажется в самом меню, которое будет функционировать, как и должно.
Других способов, как сделать открытое меню контакте, я к сожалению не знаю. Но все же такой вариант намного лучше, чем просто ссылка, для раскрытия полного меню.
Надеюсь, данная статья поможет Вам разобраться, как сделать открытое меню вконтакте. А у меня на этом все.
Как выглядит отрытое меню группы можно посмотреть в моей группе.
Сегодня мы опять возвращаемся к теме оформления групп В Контакте. Ранее мы уже научились . Сегодня мы будем учиться делать графическое меню с закрепленным верхним баннером и ссылкой на внутреннюю страницу с пунктам расширенного меню. В общем то, на внутренней странице может быть любая информация. Особенно удобно там располагать, например каталоги с ассортиментом продукции. И у раскрывающегося меню и у закрепленного меню есть свои плюсы и минусы. Основной минус раскрывающегося меню — то, что он по умолчанию находится в закрытом состоянии. Но зато на нем можно разместить сразу несколько ссылок.
Закрепленное меню смотрится более эффектно за счет общего впечатления, но у него может быть только одна ссылка, ведущая либо на внутреннюю страницу Вконтакта, либо на внешний сайт (причем на внешний сайт ссылка будет идти не с картинки а с текстовой ссылки под картинкой). Также из очевидных минусов то, что на мобильных устройствах графическое меню представлено в виде обычной записи в ленте, стоящей сверху, а не в виде закрепленной рядом с аватаром. В общем, при выборе оформления стоит учитывать эти нюансы. Итак, давайте посмотрим, как создается закрепленное верхнее меню со ссылкой на внутреннюю страницу.
Оформляю группы Вконтакте
Качественный дизайн групп и пабликов ВК, закрепленное меню, раскрывающееся меню, внутреннее графическое меню, каталоги, внутренняя навигация — цены и портфолио .
Шаг 1
Создаем в фотошопе новый документ размером примерно 900х700 пикселей, заливаем его белым цветом. Теперь нам надо вырезать в слое два окна, через которые будет проглядывать собственно само графическое оформление. Сначала выделяем прямоугольник размером 200х500 пикселя (аватар) и нажимаем Del. Потом выделяем прямоугольник размером 510х352 (выравниваем по нижней линии аватара и делаем расстояние между фигурами 50 пикселей) и также нажимаем Del.
После очередного апдейта дизайна ВКонтактом (31.10.2016) размеры баннера стали 510х307 (а не 510х352).
Шаг 2
Теперь ниже белого слоя кладем какую-нибудь единую картинку, которая и будет составлять основу оформления.
Шаг 3
После этого дополняем картинку различными элементами — логотипом, текстовыми надписями и кнопкой, призывающей кликнуть по меню. Затем сохраняем на компьютере две отдельных картинки — одна аватар (справа), вторая меню с кнопкой кликнуть (слева).
Шаг 4
Также в фотошопе создаем графическое меню, состоящее из нескольких пунктов. Ширина этого меню должна быть 600 пикселей, высота по усмотрению, в зависимости от количества пунктов. В помощь используйте урок « «.
Шаг 5
Нарезаем наше меню на несколько горизонтальных полосок в соответствии с количеством пунктов меню. Сохраняем в виде отдельных файлов.
Шаг 6
Заходим в нашу группу Вконтакте, нажимаем «Управление сообществом» (при нажатии на три точки под автаром открывается выпадающее меню) и проверяем правильность установок. Группа должна быть открытая и материалы тоже открыты.
Шаг 7
Теперь загружаем новый аватар. Подводим мышкой к месту аватара и на всплывающем меню выбираем «Обновить фотографию». Загружаем правую фотографию из Шага 3, растягиваем область выделения вверх и вниз до краев картинки, нажимаем «Сохранить» и потом выбираем область для круглой миниатюры.
Шаг 8
Теперь нужно создать внутреннюю страницу. О том, как это сделать, подробно расписано в уроке . Еще один альтернативный способ создания внутренней страницы расписан в уроке « » в Шаге 5 и 6.
Шаг 9
После того, как мы создали внутреннюю страницу, можно перейти на нее. Для этого нужно нажать на раскрывающееся меню группы (по умолчанию этот пункт называется «Свежие новости» — я переименовала в «Меню») и там нажать на ссылку «Меню». После этого мы перейдем на вновь созданную пустую страницу.
Шаг 10
Теперь нам надо создать графическое меню из пяти пунктов. Для этого мы загружаем в альбом группы наши пять картинок из Шага 5. Мы нажимаем на значок фотоаппарата и загружаем нарезанные картинки с компьютера. Хранится картинки будут где-то на серверах ВКонтакта с привязкой к группе, поэтому создавать отдельный альбом для картинок-нарезок не обязательно. Загружать картинки нужно в режими Вики-разметки.
Шаг 11
Теперь в режиме вики-разметки мы будем создавать графическое меню. Очень важно создавать именно в режиме вики-разметки (иконка в правом верхнем углу из двух треугольных скобочек), а не в визуальном режиме редактирования. Подробнее о создании кода в вики-разметке рассказано в Шаге 4 и Шаге 5 урока « «. Там же приведен шаблон кода для вставки. Если все сделано правильно, то должно получиться готовое графическое меню, как на рисунке ниже.
Шаг 12
Теперь возвращаемся на главную страницу группы, берем урл нашей внутренней страницы (он должен быть такого вида https://vk.com/page-78320145_49821289) и вставляем в окошко, где создаются новости. Автоматически должно прикрепиться окошко со ссылкой на эту самую внутреннюю страницу. После этого мы подводим курсор к надписи «Прикрепить» и прикрепляем к записи фотографию, а именно нашу картинку слева из Шага 3. После этого стираем строку с урл внутренней страницы, оставив пустое место. Важно! На данном шаге надо поставить галочку (если есть такие права, в основном это касается групп с открытой стеной) в чекбоксе «От имени группы». Если эту галочку не поставить, то запись невозможно будет закрепить. В конце нажимаем «Отправить».
Шаг 13
Подводим курсор к трем точкам рядом с заголовком поста и в выпадающем окошке выбираем пункт «Закрепить». Соответственно также новость и открепляется, если необходимо.
Шаг 14
Есть один нюанс. Иногда, после того, как открепляешь новость, она уходит далеко вниз ленты, согласно дате создания, и бывает достаточно трудно вновь ее отыскать. Поэтому лучше сразу где-нибудь записать урл закрепленной новости. Для этого надо подвести курсор ко времени создания новости и нажать на ссылку.
Шаг 15
Теперь обновляем главную страницу группы. Наше графическое меню будет вверху соседствовать рядом с аватаром. А при нажатии на картинку, мы попадаем на внутреннюю страницу с меню из пяти пунктов.
Приветствую дорогие друзья. В сегодняшнем посте я хочу рассказать о том, как создать меню для группы Вконтакте. Сделать это не так сложно, как может казаться на первый взгляд, и если Вы обладаете хотя бы начальными знаниями программы Photoshop или Paint, то у Вас все обязательно получиться. Итак, давайте приступим.
При правильно составленной структуре, меню может увеличить количество продаж или поток клиентов для Вашего бизнеса, это уже зависит от того, какую направленность имеет группа. В качестве примера рассмотрим оформление интернет магазина одежды:
Структура сформирована очень четко, практически в несколько кликов пользователь может найти все что нужно: телефоны, адреса, информацию о заказах, каталог товаров и т.д. На мой взгляд, такое оформление помогает увеличить продажи как минимум в 2 раза.
В этом варианте меню представляет собой разбитый на разделы каталог товаров, что делает очень удобным их поиск. На аватарке сообщества размещены контактные телефоны нескольких операторов, что позволит клиентам быстро выйти на связь с продавцом.
А вот пример неудачного решения:
Каталог оформлен в виде обычных ссылок, которые ведут непонятно куда. Согласитесь, что переходить по ним нет особого желания, наоборот хочется покинуть группу.
В этих примерах мы разобрали варианты оформления интернет магазинов, Вы же можете использовать нечто подобное в других тематиках. Формула проста: четкая структура + графическое оформление = приток клиентов и увеличение продаж.
Теперь давайте посмотрим на все это с технической точки зрения.
Создаем меню для группы Вконтакте
Первым делом создадим графический макет будущей менюшки. Для этой цели мы будем использовать программу Photoshop (для простенькой картинки вполне сгодится стандартный Paint). Откройте программу и создайте новый документ:
Я буду создавать картинку размером 500×500 пикселей, однако, в зависимости от количества и расположения разделов размер картинки может быть другим.
Теперь скачайте изображение, которое хотели бы использовать в качестве фона и перенесите его на холст. Если Вы профессионально владеете программой, то можно нарисовать фон самостоятельно.
Затем напишите на фоновой картинке заранее продуманные разделы, кнопки и телефоны. Их мы в последующем превратим в ссылки:
Чтобы сделать разрезы как можно точнее, нужно задействовать вспомогательные линии, нажав CTRL+R. Наведите курсор мыши на верхнюю линию и перетяните ее на изображение примерно таким образом:
Последним шагом будет разрез объектов. Чтобы это сделать кликните по кнопке “фрагменты по направляющим” (Slices From Guides) на верхней панели инструментов:
Сохраняем каркас для web устройств. Формат картинки ставим JPG, выбираем максимальное качество и сохраняем, например, на рабочий стол:
На рабочем столе появилась папка с каркасом будущего меню, который нам нужно перенести в группу.
Вывод меню с помощью Wiki разметки
В своей группе зайдите в “управление сообществом” и проверьте, подключен ли раздел “материалы”. Если раздел выключен, то подключите его:
После этого в группе появиться вкладка “свежие новости”. Нажмите на кнопку “редактировать”, Вас перебросит в текстовый редактор:
Вместо стандартного заголовка, пропишите свой, а также включите режим wiki разметки, нажав на пиктограмму ромба:
Теперь откройте группу в новой вкладке и загрузите в фотоальбом заготовленный каркас, а в текстовый редактор вставьте следующий код, столько раз, на сколько частей разбит каркас:
| [ [ photo133337_133701019|370px;nopadding;|page- 13333337 _13333337] ] |
Вместо значения “photo133337_133701019” нужно вставить ссылку на фотографию
Вместо значения “page-13333337_13333337” нужно вставить ссылку на нужную страницу или раздел группы
Вместо 370px можно подобрать свои размеры, а параметр nopadding позволяет выводить полноценную картинку, без него наше меню выводилось бы разрезанными кусками.
Нажав на кнопку “Просмотр” можно посмотреть, как меню будет смотреться в группе. Если все устраивает, то жмем “Сохранить результаты” и радуемся проделанной работе.
Как создать графическое меню в группе ВКонтакте. Как составить меню для группы Вконтакте
В этой статье мы поговорим о том, как установить меню ВКонтакте. В предыдущих статьях я рассказывал вам о том, как и как правильно сделать меню в Photoshop, а теперь пришло время интегрировать его в нашу группу.
Но для того, чтобы начать процесс введения в контакт наших меню, нам сначала нужно разрезать его на составные части. Для этого воспользуемся инструментом «Раскрой».
Выберите этот инструмент и начните резку. Досталось 7 частей.
Далее заходим в «Файл» — «Сохранить для Интернета» — выбираем расширение jpeg и качество 100%, нажимаем «Сохранить». У нас должно получиться 7 файлов. Все! Фотошоп закончился! Все необходимые работы по созданию меню выполнены. Приступим к установке меню ВКонтакте. Для этого:
1) Заходим в созданную вами группу. Там находим «Альбомы» — «Добавить» (выделено красным прямоугольником на рисунке 1). Ищем кнопку «Выбрать файл».Щелкните и загрузите созданные 7 файлов.
Добавление фото в альбом группы ВКонтакте
Изображение 1
Добавление фото в альбом группы ВКонтакте
2) Внимание! Для тех, у кого не включены «Свежие новости», и по умолчанию они не включены, вам нужно выбрать «Управление сообществом», найти «Материалы» и включить их (Рисунок 2).
Рисунок 2
3. Наведите указатель мыши на «Свежие новости», справа появится ссылка «Редактировать», щелкните по ней (рис. 3).
Рисунок 3
4. Появится окно как на рисунке 4. Нас интересует кнопка «Режим макета Wiki» (выделена красным прямоугольником. «Нажмите на нее.
Рисунок 4
После этого в пустую область ниже вводим вики — код, который будет отображать наше будущее меню. Получил так (рисунок 5):
Рисунок 5
Wiki — код нужно вводить точно так, как показано на рисунке 5. Тогда вы можете экспериментировать сами.
Пример синтаксиса для добавления изображения следующий:
[], где
photo-41875814_286789280 — ID загруженного изображения, которое можно просмотреть в адресной строке браузера (рисунок 6).
Рисунок 6
Тег «nopadding» удаляет пробелы между изображениями, то есть помогает «закрепить» их близко друг к другу.
370px — ширина изображения, смотрите это значение в свойствах файла.
https: // www .. То есть, нажав на эту кнопку, пользователь перейдет из группы в контакте на этот сайт.
Чтобы картинка не кликабельна, я использовал тег nolink:
Вот и все! Создано мое первое меню! Вот как это выглядит в группе (рисунок 7).
Создаю Меню в palbik Вконтакте своими руками
Здравствуйте уважаемые читатели, как и обещал, продолжаю осваивать азы создания меню для сообществ Вконтакте. И сегодня я решил сделать красивое меню у себя в паблике Вконтакте. Также вы можете прочитать в одной из моих предыдущих статей — где вы можете изучить вики-разметку и некоторые основы создания страниц в сообществах Вконтакте, без которых ни группу, ни паблик Вконтакте невозможно сделать привлекательными для посетителей.
Вот такое простое графическое меню я создал в одной из своих групп Вконтакте. А теперь я начну создавать меню для моей публики!
С чего начать создание меню в паблике Вконтакте? Это, пожалуй, самый главный вопрос, который задает большинство владельцев паблика Вконтакте, думая — а как же сделать меню? Ответ, как часто бывает простой, заключается в том, что «Вконтакте» предоставляет возможность создания общедоступных вики-страниц с использованием вики-разметки (я писал об учебнике по вики-разметке в предыдущей статье).Для начала, чтобы создать паблик меню Вконтакте, я создам новую страницу в своём паблике с использованием вики-разметки.
http://vk.com/pages?oid=-XXX&p=Page_name
где XXX — это ID моего паблика, который можно узнать, нажав на цифру с количеством записей в паблике Вконтакте.
После нажатия на количество записей в строке браузера вижу следующую ссылку:
http://vk.com/wall-46864771?own=1
Где числа 46864771 — это ID моего паблика Вконтакте, поэтому делаю ссылку на создание страницы меню:
http: // vk.com / pages? oid = -46864771 & p = Menu
Я запускаю эту строку в своем браузере. И вот передо мной новая страничка моего паблика Вконтакте, которую я буду использовать для создания меню для паблика.
Далее, нажимаю -> заполнить контентом, и начинаю создавать собственное публичное меню Вконтакте. Также я не забываю сделать один важный шаг, чтобы ограничить доступ всех подписчиков паблика к редактированию этой страницы (на всякий случай). В правом нижнем углу нажимаю -> захожу на страницу, ставлю нужные галки и сохраняю.
Теперь самая сложная часть остается для меня — создание публичного меню Вконтакте — фактически, используя знания Photoshop и вики-разметку, чтобы сделать меню для моего публичного. И когда я закончу редактировать страницу меню, я могу сохранить ее и нажать -> Вернуться на страницу в правом верхнем углу редактора. В строке браузера появится ссылка, которая нужна для вставки меню в шапку паблика Вконтакте.
Вы помните, я сделал в своем паблике Вконтакте красивую шапку, которая до сегодняшнего дня выглядела так:
В связи с созданием меню в паблике Вконтатки центральная картинка с моим изображением в шапке моего паблика уступила небольшие изменения, и теперь это выглядит так:
После нажатия на нее происходит чудо! Открывается новая, пока пустая страница моего паблика — Меню.На этой странице скоро родится еще один шедевр — меню моего паблика Вконтакте, о котором возможно, напишу еще одну статью — Как сделать меню в паблике Вконтакте.
— читайте в моей статье, а вот как я сделал картинку, представленную выше, кликабельной, я вам сейчас расскажу! Все как всегда просто, для этого достаточно в посте, который я закреплю в виде центрального изображения в шапке моего palblick, в первую очередь вставлю ту самую ссылку моего Меню:
Http: // вк.com / page-46864771_44676832
После этого можно удалить текст самой ссылки и вставить екатерину центральной части шапки паблика Вконтакте, ссылка останется там, а вся картинка станет кнопку для этой ссылки. Теперь осталось поработать на странице Меню по созданию публичного меню Вконтакте, и все будет готово!
О том, как завершить работу по созданию публичного меню Вконтакте, вы можете узнать в следующей статье —
Посмотреть, какое публичное меню Вконтакте мне попалось, можно посмотреть на
Здравствуйте, мои любимые!
Сегодня я подробно расскажу, как сделать меню для группы ВКонтакте … По моему опыту меню в группе в контакте увеличивает количество звонков и приложений на 20%. Важно ответственно подойти к вопросу создания группового меню. Поэтому я подготовил для вас шаблон меню PSD, чтобы облегчить вашу работу.
Начнем с того, что сегодня есть два пункта меню:
Вариант 1: Меню закрытой группы
Закрытое меню, открывается при нажатии на ссылку. В приведенном ниже примере меню открывается при нажатии на ссылку «ОТКРЫТЬ МЕНЮ ГРУПП!»
Вариант 2: Открыть групповое меню (закрепленный пост)
Открытое меню — это закрепленный пост с активной ссылкой.
Вторая версия меню появилась сравнительно недавно, когда появилась возможность прикреплять посты со стены к шапке группы или паблика. Он сейчас самый эффективный.
Оба варианта используют разметку вики. Разметка Wiki позволяет быстро и легко настроить внешний вид группы, создавая графические таблицы и спойлеры, форматируя текст и работая с изображениями, ссылками и якорями. Я не буду подробно останавливаться на разметке, потому что ВКонтакте имеет встроенный визуальный редактор, который автоматически переводит ваш контент в вики-разметку.Здесь я приведу только основные коды, без которых невозможно составить меню.
Как сделать открытое меню ВКонтакте
Разберем процесс создания меню на примере Варианта 2, т.е. открытого меню.
Чтобы вам было легче ориентироваться, я подготовил для вас PSD шаблон меню : [Внимание. Изменился дизайн ВКонтакте. Новый макет и другая соответствующая информация в]
PSD шаблон группового меню
Для создания внешнего меню необходимы 2 картинки: аватар (справа) и центральная (картинка действия).
Размеры аватара: 200 x 332 пикселей
Размеры центрального изображения: 395 x 282 пикселей
Шаг 1.
Используя скачанный выше шаблон группового меню PSD, сделайте две картинки желаемых размеров.
Шаг 2.
Зайдите в свою группу в «Управление сообществом» (справа под аватаркой). Найдите пункт «Материалы» (на вкладке «Информация») и сделайте их «Ограниченными».
Шаг 3.
Теперь вернитесь на главную страницу своей группы и нажмите «Редактировать» в появившемся блоке «Материалы» (я уже переименовал его в меню «Группа»).
При редактировании страницы задайте заголовок, вы можете создавать разделы или любую другую информацию с помощью панели инструментов. Нажмите «Сохранить страницу» и «Вернуться на страницу»
Шаг 4.
В моем примере https://vk.com/page-42211349_47355854,
Первые цифры 42211349 — это идентификатор вашей группы
Вторые цифры 47355854 — это идентификатор страницы
Особенность: вы можете создавать дополнительные страницы вручную. Для этого перейдите по ссылке формы:
https: // vk.com / pages? oid = -хххххххх & p = pagename
где
xxxxxxxxx — id вашей группы
pagename — имя вашей страницы
Шаг 5.
И опубликуйте пост.
Шаг 6.
Теперь загрузите аватар группы (рисунок справа). На стене появится дубликат изображения аватара — удалите его.
Шаг 7.
А теперь внимание. Нажмите ЗАПИСАТЬ ВРЕМЯ ПУБЛИКАЦИИ (нижний левый угол сообщения).
И нажмите «Исправить».Закрываем это окно и обновляем страницу вашей группы (F5).
Шаг 8.
Пишем статус группы (используем только 1 строку) для выравнивания картинок, если рисунок на вашем аватаре не начинается с самого верха (в моем шаблоне аватар — вариант 2). И вот что у нас получилось:
ИТОГО.
Меню готово! Теперь, когда вы нажимаете на центральную картинку, открывается ваше меню:
Здесь можно редактировать, перемешивать фото, видео, создавать новые разделы, размещать ссылки.
В главном меню можно также создать графическое меню (подменю). Его ширина не должна превышать 600 пикселей. Размер неограничен по высоте. Это позволяет создавать отличные лендинги ВКонтакте.
Но об этом я расскажу подробнее в следующих статьях. Подпишитесь на обновления блога, чтобы быть в курсе новых функций. Поставьте лайк и поделитесь статьей с друзьями.
Напишите свои вопросы или мнения в комментариях ниже.
Для того, чтобы ваша группа была популярной среди пользователей, вам необходимо регулярно добавлять новые публикации, загружать фото, видео и прочее.А чтобы людям было проще ориентироваться при переходе на страницу группы, лучше создать меню, в котором будут указаны основные моменты.
Например, у вас есть собственная компания, которая предлагает определенный продукт или услугу. Также есть веб-сайт в Интернете. Тогда группа Вконтакте для этой компании поможет привлечь новых клиентов и увеличить продажи. В меню могут быть следующие пункты: Окна, Двери, Ворота, Системы безопасности, Дополнительные материалы, Акции и скидки.Мы делаем ссылки таким образом, что, нажав на одну из точек, человек переходит в соответствующий раздел на сайте.
Меню можно сделать без обращения к сторонним страницам в Интернете. Например, у вас есть группа, посвященная музыке. В абзацах можно указать жанры: классика, рок, рэп, из индийских фильмов, для новорожденных, из мультфильмов. Когда человек нажимает на один из элементов, он должен открыть альбом с соответствующими песнями. В этом случае элемент представляет собой ссылку на конкретный альбом в группе.
Есть много примеров создания навигации в группе. А теперь приступим к практике.
Создать меню
Обязательные настройки в группе
Перед тем, как приступить к созданию самого меню, необходимо проверить некоторые настройки в группе. Вы должны быть создателем группы, иначе у вас может просто не хватить прав для создания навигации.
На своей странице Вконтакте в левом столбце нажмите на пункт «Группы» и выберите свою группу из списка.Затем под аватаром нажмите на три вертикальные точки и выберите из списка «Управление сообществом».
Теперь в меню справа перейдите на вкладку «Разделы» и в полях «Обсуждения» и «Материалы» выберите «Публичный» или «Ограниченный». Щелкните «Сохранить».
Подготовка изображений для меню и аватаров в Photoshop
После проверки и изменения настроек в группе можно приступать к созданию изображений для аватара и меню. Здесь может быть несколько вариантов:
Меню может быть продолжением изображения на аватарке;
Это можно сделать на отдельном изображении или на простом фоне, аватар не будет с ним ассоциироваться, может отображать, например, логотип компании.
Рассмотрим подробнее первый вариант. Наш аватар и навигация будут состоять из одного изображения, которое нужно грамотно разрезать на части.
Откройте Photoshop и создайте в нем новый файл — Ctrl + N. Установите ширину 760 и высоту 500 пикселей.
Теперь, используя инструмент Slice Tool, вам нужно разрезать лист на несколько частей. Выберите область справа с помощью инструмента и дважды щелкните по ней, чтобы открыть окно с меню. Установите ширину 200 и высоту 500.Это будет аватар нашей группы.
Тем же инструментом выберите другую область слева от предыдущей. Для нее ширина 50, высота 500. Это расстояние между будущими предметами и аватаркой, эта часть изображения нам не понадобится.
Выберите область вверху слева. Для него ширина 510, высота 182. Эта область нашего изображения соответствует в группе той области, в которой написано название группы, статус, показаны некоторые вкладки.То есть нам это тоже не нужно.
В результате должно получиться следующее — изображение разделено на 4 области. Область справа — это аватар группы, слева внизу будут пункты меню и еще 2 области, которые не понадобятся.
Чтобы было полностью понятно. Вырезаем чистый лист. Затем добавьте к нему выбранное изображение. После сохранения у нас будет столько маленьких изображений нужной формы, сколько мы вырезали. Далее на странице в группе мы будем вставлять определенные части картинки в нужные места.
Затем откройте изображение, которое вы выбрали для аватара и меню в Photoshop. Используя инструмент «Перемещение», перетащите изображение на ранее вырезанный лист. Вы можете переместить картинку так, чтобы была видна желаемая область.
Например, мое изображение больше, чем то, которое мы выбрали для белого листа. Поэтому я переместил его так, чтобы пальмы были слегка видны, а небо над ним было не так много.
После добавления изображения снова возьмите инструмент Slice Tool и разрежьте область в левом нижнем углу, которую мы оставили для точек, на желаемое количество частей.Будет столько деталей, сколько вы захотите обозначить.
Теперь возьмем текстовый инструмент и напишем пункты меню в каждой части.
Это все сделано. Справа наш аватар, слева внизу — элементы навигации. Две другие части изображения не понадобятся.
На этом этапе вы можете добавить логотип компании в область справа (аватар) или красиво написать ее название.
Сохраняем сделанное изображение: Файл — Сохранить для Web и устройств, либо воспользуемся сочетанием клавиш Alt + Shift + Ctrl + S.
Вот что у меня получилось: папка «меню» на рабочем столе. В нем выбранные изображения нарезаются на кусочки нужного размера. Самый большой из них — аватар, множество мелких одинаковых — пункты меню, а два ненужных — удали их из папки.
Теперь вам нужно загрузить изображения, соответствующие точкам, на вашу страницу Вконтакте. Выберите «Фото» и создайте новый альбом, я назвал его «для группового меню». Сделайте альбом частным, чтобы его могли просматривать только вы — «Редактировать альбом».Добавьте в альбом изображения, соответствующие вашим пунктам меню.
Затем вернитесь на главную страницу группы и выберите аватарку — «Загрузить фото». Это одно из тех изображений, которые мы только что сделали в Photoshop.
Итак, на данном этапе вы должны были создать на странице закрытый альбом с изображениями элементов навигации и загрузить аватар для группы.
Создание меню с помощью вики-разметки
Приступим к созданию самого меню. Заходим в группу и переходим во вкладку «Свежие новости».Затем нажмите кнопку «Редактировать».
Вы можете переименовать название самой вкладки. Так я пишу «МЕНЮ». Теперь сюда нужно добавить изображения, соответствующие абзацам. Для этого щелкните значок камеры.
Нажмите на одно из изображений, которое вы только что добавили в свой профиль.
После этого он появится на странице редактирования.
Таким образом, сложите все остальные изображения, чтобы получить желаемое изображение меню.
Когда все элементы добавлены, щелкните две стрелки в правом верхнем углу, чтобы переключиться в режим макета вики.
Здесь удалите все ненужные теги, такие как
, и удалите пробелы между всеми строками. Теперь посмотрите на верхний снимок экрана — у нас есть пробелы между добавленными изображениями. Чтобы удалить их, напишите nopadding перед размером изображения и поставьте «;».После значений размера изображения и вертикальной ручки вставьте ссылку на страницу, на которую будет переходить человек, щелкнув соответствующий пункт меню. Как я уже писал, ссылка может быть на какую-то страницу Вконтакте или на сторонний ресурс в Интернете.
Вот как будет выглядеть код после добавления «nopadding;» и ссылку.
В результате должно получиться так: изменено название вкладки (МЕНЮ), убраны пробелы между строками, убраны пробелы между изображениями (nopadding;), добавлены ссылки. Нажмите «Сохранить страницу» и вернитесь на главную страницу группы.
На этом процесс создания навигации для группы Вконтакте завершен. Получил вот так. Изображение аватара и меню составляют единое целое.Нажав на вкладку «МЕНЮ», пользователь может выбрать то, что ему интересно, и перейти по указанной мной ссылке.
Если вас беспокоит, что меню в группе может не отображаться, то исправьте фото, на котором, например, стрелками обозначьте наличие вкладки. Если есть вопросы, задавайте их в комментариях.
Учитывая, что это меню находится не в группе, а на странице ВКонтакте (паблик), я решил показать вам, как все это делается! Уже давно меня трепещут вопросы: как сделать меню публичным, как сделать меню открытым, как исправить и т. Д.Вот вам инструкция!
Так как вообще можно сделать меню на публичной странице в контакте ? Все мы знаем, что возможность добавить встроенное вики-меню есть только в группе , я об этом и писал. Но как сделать публичное меню, если в настройках нет такой функции? Для пытливого ума ограничений нет! Вот так выглядит меню в нашем корпоративном паблике:
Открытое меню? Проще простого!
Просмотрите статьи еще раз: и теперь эти знания нам пригодятся!
3 шага к красивому публичному меню!Вы, наверное, уже догадались, что в основе такого меню лежит… закрепил пост с внутренней страницей! Лично мне этот способ очень нравится, даже в группе своего блога я отказался от встраивания и использования «меню в клипе». А теперь дам четкую инструкцию «как это сделать»!
Шаг 1: создайте внутреннюю страницу менюИтак, чтобы меню появилось в нашей группе, его нужно создать на отдельной внутренней странице. И как вы помните, публично у нас нет возможности добавить меню, но мы пойдем другим путем и создадим внутреннюю страницу.Для того, чтобы его создать, мы должны правильно прописать адрес в строке браузера. Вот вам шаблон ссылки:
Вариант 1: (нормальный)
http://vk.com/pages?oid=- XXX & p = Page_name
, где XXX — идентификатор вашей публичной страницы,
, а «Имя_страницы» — любое слово, которое будет использоваться для наименования страницы
Вариант 2: (облегченный, но)
Итак, мы создаем вики-страницу и заполняем ее так же, как если бы мы заполняли меню для группы.То есть регистрируем там все изображения и переходы. У нас должно получиться что-то вроде этого:
Это код вики для меню
Внимание! Если вы до сих пор не умеете создавать визуальные меню в контакте, то снова статья! Если все в порядке. то у вас получится аналогичная картинка:
А это уже готовая страница меню
Шаг 2: создайте сообщение на стенеТеперь нам нужно добавить наше меню на стену сообщества ВКонтакте.Для этого скопируйте ссылку на внутреннюю страницу и добавьте ее в пост, например:
Вы, наверное, уже знаете, что ссылка на сообщение прикрепляется автоматически и после того, как ссылка прикрепляется из самого сообщения, адрес страницы может быть удален. Если вы опубликуете ссылку, то меню на стене не появится, а будет просто ссылка, нажав на которую человек попадет в наше меню. Это только полдела! Нам нужно, чтобы меню было видно и висело на застежке, т.е.е. на самом видном месте.
Итак, теперь мы должны удалить ссылку из «тела» сообщения (прикрепленная страница останется) и добавить к сообщению изображение , которое увидят подписчики. Хитрость в том, что если ссылка и изображение присутствуют в одной записи, то при нажатии на изображение переходит по ссылке ! Все гениальное просто!
Картинка может частично или полностью повторять само меню, здесь вам решать. Если вы заказываете меню для паблика, то вам также понадобится баннер, т.е.е. картинка, которая будет висеть в клипе. Вот что мы получаем, когда публикуем пост:
Картинка повторяет меню и привлекает внимание посетителей страницы
Наконец-то у нас все готово и на стене висит пост с картинкой и ссылкой! Теперь нам нужно переместить его в шапку группы, закрепить пост на главной странице, сделать блокировку … Для этого нажимаем на дату / время поста (под каждым постом есть дата публикации), мы перейдите на внутреннюю страницу сообщения, прокрутите вниз и найдите кнопку «закрепить» ».На картинке показано, что вам нужно найти:
Щелкните по этой кнопке и обновите страницу. Вуаля, готово! Наслаждаемся красивым меню!
vk.com/frilkacom
Вы даже можете выбрать картинку, которая будет продолжением вашего аватара — такой дизайн выглядит очень красиво.
Итак, за три простых шага нам удалось создать красивое меню, которое можно использовать в любом сообществе ВКонтакте!
У меня все есть! Делитесь статьей с друзьями, добавляйте в избранное и следите за обновлениями блога, чтобы не пропустить новые интересные статьи!
Графическое меню ВКонтакте.Как сделать красивое меню для группы ВКонтакте
Сегодня продолжу свое «Погружение в группы ВК». В третьей части «сериала» я рассказал и показал. Сегодня поговорим о дизайне группового меню ВКонтакте!
В первой статье по созданию меню в комментариях было много вопросов, поэтому перед тем как начать новую тему, отвечу на часто задаваемые вопросы.
Вопрос 1: Первый и самый распространенный: «Где в меню код?» или «Если нет закладки при редактировании» Исходника «как добавить внутреннюю страницу?» или «Я все еще не понимаю, что делать, если код не появляется!»
Ответ 1: ВК поменял редактор, теперь переключаться между визуальным редактором и кодом можно всего одним кликом (правый верхний угол редактора):
Чтобы проверить, в каком редакторе вы находитесь: наведите указатель мыши на эту кнопку, напишите текст и выделите его жирным шрифтом — если появляются не обычные символы, то это код
Вопрос 2: Второй, действительно проблемный: « а как убрать пробелы между картинками ?? »
Ответ 2: Признаюсь, я сам испугался, когда впервые «пошло» клиентское меню.Сейчас исправляю быстро, а тогда было не весело. См .:
Добавить тег nopadding; и все встанет на свои места!
Между картинками появляется пробел, и меню выглядит разбитым. Для неосведомленных, может быть, это ненормально, но, по крайней мере, не профессионально. Так в чем же дело? Ах, все очень просто! В ВК постоянно происходят какие-то обновления, внедряются новые алгоритмы … да еще редактор криво … это происходит ни с того ни с сего, из кода выпадают важные теги и тут мы видим такую картинку.Чтобы это исправить, вам нужно заглянуть в код и внести необходимые изменения. Формат кода должен быть таким:
Шаблон: [] Пример: []
Обычно изображения меню раздвигаются, потому что выпадает код nopadding ; — вставляем на место и все выравнивается. Перед сохранением результата нажмите кнопку «Предварительный просмотр», чтобы убедиться, что все гладко.
Вопрос 3: Новости. В октябре 2012 года Вконтакте принудительно отключили авто групп и пабликов.Теперь их размер имеет общепринятый стандарт 200х500 пикселей. Итак, если в вашей группе было больше аватаров, сделайте обновление (обновите свой аватар).
Кстати, помимо кадрирования, ВК ввел еще одно нововведение, касающееся групповых фото: теперь, нажав на аватарку, мы, как и в аккаунте, сможем увидеть все альбомы сообщества. Удобно! Из этого вытекает новый функционал в сообщениях группы.
So-a-ak, мы закончили с вопросами… А теперь переходим к самому созданию меню!
Шаг 1. Как создать меню в контакте и сделать вложенные страницы:Для начала убедимся, что вы умеете создавать групповое меню в контакте и пройдемся по короткой инструкции:
Как вам моя шпаргалка?
Вот шпаргалка, которую я получил! Для наглядности запишу каждую цифру:
Сделайте это со всеми вложенными страницами, и ваше меню будет готово.
Есть! Мы создали меню, сделали внутренние страницы, заполнили их, теперь перейдем к созданию красивого графического меню.
Шаг 2. Как создать красивое графическое меню в контакте и поставить:Я не буду рассказывать вам всю теорию того, как работает разметка вики в контакте, теперь у нас другие цели. Для создания визуального меню в группе ВК не обязательно знать всю разметку вики. Переходим к созданию визуального меню!
Сначала я покажу вам код и результат моего меню:
Признаюсь, я сделал это специально, чтобы написать эту статью.Все «руки не доходили», понимаете, как «сапожник без сапог». Но теперь я с визуальным меню в группе ВК!
Не буду рассказывать, как рисовать картинку для меню, это дело дизайнеров, рисую сам, но не очень профессионально. , в конце статьи я привел видео, как нарисовать простое меню в фотошопе, посмотрите, может быть, у вас получится сделать это самостоятельно. Если нет, закажите картинку меню у.
Я покажу вам средний вариант настройки меню.Разница в количестве предметов. Меню, которое просто нарезано на полоски, — простейшее его исполнение. Чем больше в строке нажимаемых кнопок, тем сложнее выполнять их. Хотя, зная фичу, все просто! Это только вопрос времени. Итак, ширина изображения должна быть:
370 пикселей — если у вас два и более объекта в строке, например, у меня есть кнопки для социальных сетей
И максимум 388 пикселей — если разрезать картинку по-простому, только на линии, без разделения на мелкие объекты.Это особенность, которую вам нужно знать при разрезании меню на кнопки. Размер моей картинки всего меню оказался 370х456 пикселей.
После того, как картинка была разрезана на необходимое количество объектов и сохранена в отдельный альбом, загрузите этот альбом в ВК. Загружайте в профиль своей учетной записи, а не в группу! Поскольку больше нет возможности скрывать альбомы в альбомах группы. Технический альбом в корпоративной (например) группе вообще не нужен, поэтому пункты меню в аккаунте скрываем:
Технический альбом ВК
После того, как вы настроили приватность «Только я».Приступаем к установке самого меню. Я дам вам пример кода, который будет для вас шаблоном, и мы проанализируем, из чего он состоит:
[]
где, фото7632142_296
9 — это адрес картинки! Смотрим на него в адресной строке картинки:
С первой картинки начнем вставлять меню в группу ВКонтакте
Вам нужен краткий адрес фотографии, для этого перейдите в сам альбом:
Зайдите в сам альбом, чтобы получить желаемый адрес изображения!
… и, начиная с первого изображения, перетащите их в групповое меню.
Добавьте размер картинки в код меню!
Итак, адрес картинки добавился, размер указали, теперь ставим тег nopadding; — это нужно, чтобы наши картинки плотно прилегали друг к другу. И последний шаг — поставить ссылку на страницу, на которую посетитель перейдет после того, как кликнет по картинке.
Вот небольшое уточнение! Пишем внешние ссылки, ссылки на альбомы ВК и обсуждения в полном объеме, а ссылки на внутренние страницы в формате страница-32734125_44298120 … В начале и в конце строки не забудьте поставить две квадратные кавычки и без пробелов.
Пояснение 2: Когда мы ссылаемся на внутренние страницы без изображений, мы используем одинарные квадратные кавычки для обсуждений, альбомов и внешних ссылок.
Строки, содержащие два и более элемента, вставляются в код без пробелов. Вставляйте каждую строчку рисунка одну за другой. Потому что, если вы нажмете Enter после строки с изображением, картинка перейдет на новую строку и меню переместится.Нам нужно, чтобы меню отображалось как единое целое, поэтому нам не нужны лишние пробелы и «символы»!
После того, как вы перенесли все картинки в меню и оформили их (размер, ссылка), сохраните результат и любуйтесь нашей работой! Все! Готовый!
Если да, то вы попали в нужную статью. Здесь мы обсудим, как создать группу [хм, улучшить сообщество] в социальной сети ВКонтакте, и вы получите хорошее впечатление от пользователей. Времена меняются, люди становятся умнее и сразу могут понять
Как вы, наверное, уже знаете, ВК предоставляет 3 варианта создания групп [сообществ]:
Исходя из ваших целей и задач определите для себя, какой вариант вам больше подходит.Естественно, события созданы под любые события. Давайте разберемся — что выбрать — группу или паблик?
На самом деле возможности группы и паблика ВКонтакте не слишком различаются.
Создавайте паблик, а не группу.Публикация вместо группы дает ряд преимуществ. Паблик проще в разработке и использовании, он также находится в блоке интересных пользовательских страниц. Исходя из этого, можно узнать интересы пользователя.В данном случае это фотография и все, что с ней связано.
Что касается группы, то потенциальные клиенты могут задать вопросы на ее стене. Поначалу это выглядит преимуществом, но только если у вас нет плана контента и ваша цель — только чтобы люди начали спрашивать. Но в таких группах вовлеченность очень низкая.
Также в группах есть возможность приглашать друзей. Публично эта функция урезана. Но вряд ли ваши друзья будут вашей целевой аудиторией, которой вы собираетесь продавать услуги или товары.Следовательно, нет смысла сосредотачиваться и на приглашении.
Еще одним преимуществом группы является возможность добавить приложение интернет-магазина по защищенному протоколу https через приложение iframe, что позволит пользователю разместить заказ, не выходя из социальной сети.
А теперь коснемся темы шапки нашего сообщества. Как правильно сделать заголовок, чтобы он работал на наш бизнес и начинал генерировать трафик.Например, вы продаете женскую одежду в Нижнем Новгороде.
Зайдя на Яндекс видно, что …
Группа попала в топ результатов поиска по этому запросу и каким-то образом ранжируется по этому запросу. Соответственно, было бы разумно назвать свою группу именно так, чтобы попадать в результаты поиска как Яндекс, так и Вконтакте.
Род занятий — это ключевое слово, по которому пользователи потенциально могут искать вас — если ваша профессия привязана к городу, то в самой группе вы также можете указать город, в котором вы находитесь, поисковые системы будут определять вашу группу по геолокации.
В идеале формат заголовка выглядит так:
Интернет-магазин женской одежды | Lovandzzoo
где «Интернет-магазин женской одежды» — ключевой запрос
Lovandzzoo — ваш бренд
Аватар и обложкаДизайн не является важным механизмом в механизме Интернет-бизнеса, но красиво оформленная группа без подозрительного и дешевого дизайна внушает больше доверия. И дизайн сообщества начинается с хорошо продуманного аватара и обложки сообщества.
Аватар сообщества — это лицо вашей компании, и он должен отражать как позиционирование компании, так и контактную информацию.
- род занятий
- логотип и торговая марка
- телефон
- призыв к действию — например, «Зарегистрируйтесь, чтобы позаботиться о своем здоровье и внешнем виде».
- стрелка, указывающая на подписку.
- , также указывают адрес и внешний ресурс — сайт.
Пример хорошей авы:
А теперь поговорим о дизайне обложки, которая сейчас приобрела популярность после нововведений Вконтакте. В принципе подход такой же, как и к дизайну аватара, только теперь переводим все в горизонтальное положение. Вот несколько примеров хороших обложек с разными стилями оформления. Их объединяет то, что ясно, куда пришел человек и что он видит. Обложка должна отвечать на вопросы «Что это?».
Обратите внимание на последнюю крышку и указывающие стрелки на:
- логотип
- марка
- о чем говорит публика
- чем полезен контент для подписчиков
- и что получит пользователь, если подпишется на
Можно сделать то же самое — это стандартная рабочая структура для грамотного оформления обложки сообщества.
Вики-менюВы можете включить популярные вики-меню в дизайн своего сообщества. Главное — продумать структуру меню, потому что в некотором смысле, создавая меню с использованием вики-разметки, вы создаете мини-сайт в социальной сети, и пользователь не должен в нем теряться. Посмотрите на это меню вики и понять, что означает грамотная структура вики-меню.
Пример хорошего и привлекательного меню.
В зависимости от ниши вики-меню может содержать следующие разделы
- если это продажа нац.товары и услуги — условия доставки, категории товаров, прайс-листы, как заказать, описание и др.
- , если продажа информационных продуктов
Является базой структурированного контента, например
Еще один пример хорошего меню:
В ссылках укажите все свои внешние ресурсы — лид-магниты, основные сайты, каналы в других социальных сетях, куда пойдет аудитория. Это поможет увеличить посещаемость вашего ресурса из социальных сетей.
Читайте также >>>>
Контент — корольContent is King
Билл Гейтс однажды сказал, и он был прав. Социальные сети существуют и популяризируются благодаря наличию постоянно генерируемого контента. Без него группа выгорает и забывается. Поэтому необходимо регулярно публиковать сообщения, чтобы напоминать о себе.
Но как правильно оформлять посты, чтобы им нравились и делились?
Здесь все очень просто — не нужно использовать в постах картинки с дешевым оформлением и унылым копирайтингом — дело не в том, что они не нравятся пользователям, сама соцсеть игнорирует этот формат контента.Вот так примерно должна выглядеть картинка.
Никто не требует от вас дизайнерской работы, а только приятный и не раздражающий дизайн. Если контент визуально воспринимается хорошо, то вероятность его распространения высока.
NPV (Human UnderstandableLinks) в сообщенияхСтарайтесь не указывать оригинальные ссылки, либо ссылки с UTM-тегами, а сокращайте их с помощью сервиса vk.com/cc в заголовке под заголовком сообщения. Пользователи ВК игнорируют посты с длинными ссылками (особенно в начале).Их интересует контент. Термоусадочные ссылки в постах с вк . ком / куб.см
Здесь на конкретном примере вы можете увидеть, как выглядит такая ссылка в посте:
Также постарайтесь не использовать очевидные и банальные заголовки. Заголовки предназначены для привлечения внимания подписчиков сообщества в ленте новостей. Например, заголовок «16 + 1 Эффективные и целебные свойства тыквенного масла, о которых не догадываются 95% людей на планете» будет лучше работать для внимания аудитории, чем невзрачный «Свойства тыквенного масла».Попробуйте добавить в заголовок цифры и конкретику. Тогда пост привлечет внимание.
Готовы ли вы бросить вызов своей мечте и реализовать свои идеи и идеи в Интернете, начать зарабатывать серьезные деньги в Интернете?
Разнообразьте свой контентОпределите не менее 30 тем (потребностей), которые могут иметь непосредственное отношение к вашему направлению, и используйте таймер, чтобы начать публикацию.
Создавайте интересный контент для своей ниши. Например, в теме спорта — можно писать мотивационный, образовательный и экспертный контент.Список потребностей можно сделать бесконечным, и проблема заключается в выборе формата, который больше не будет публиковаться сам по себе. В каждом посте используйте разные призывы к действию с обоснованием причины — «Нравится, если это было полезно», «Сделайте репост, если вы думаете, что все ваши друзья должны знать об этом».
Добавляйте смайлы к сообщениям, чтобы сделать их более красочными и привлекательными. Но не спамите слишком много.
Узнай,
ВидеоВо все видео, загруженные на YouTube, вставьте обложку, чтобы была упаковка и обертка, привлекающие внимание пользователя.Ролики без обертки выглядят очень сыро, в которых уже понятно, что будет и нет никакого интереса их выкладывать.
Вот пример того, как должна выглядеть обложка видео:
CTR видео с обложкой в разы выше, потому что есть упаковка — обертка, привлекающая аудиторию. Картинка должна сыграть свою роль — заинтересовать, что внутри.
Орудие!
ТоварыРаздел «Товары» — цены указаны в порядке возрастания — в витрине должны быть самые низкие цены.
Подробное описание в самой карточке товара. А если есть сайт — перед ссылкой на карточку товара. Кнопка «Написать продавцу» привязана к личным сообщениям человека, который ведет группу, или к менеджеру, который подписан на группу
Заполняем раздел обсуждения и создаем в нем подразделы — «Ваши вопросы», «Как заказать», «Вакансии». Вы также можете создать анкету для разнообразия.
Контакты — тоже не забудьте заполнить. Чтобы человек понимал, к кому обращаться — по поводу заказа товаров, рекламы или ваших услуг.
Чтобы понять, кому задать вопрос — напишите должность — руководителя и обязанности человека. Так вы быстро дадите понять пользователю, к кому он должен обратиться со своим вопросом.
Самое главное, чуть не забыл 🙂 — заполняем описание группы необходимой информацией со всеми исходящими ссылками.Обязательно разделяйте описание блоками по 3-4 строки, чтобы текст был читабельным — правила копирайтинга для читабельности текста еще не отменены.
Вот пример того, насколько хорошо описание должно быть в сообществе:
Ну что скажешь? Был ли контент полезен?
Вы понимаете, как нужно оформить группу Вконтакте?
Если да — то жду отзывов в комментариях — отвечу моментально.У тебя не будет времени моргнуть. Люблю обсуждать тему продвижения в социальных сетях. Если нет времени — пиши
Прежде всего, нужно красиво оформить. Ведь мы, как известно, все оцениваем «по одежде». Эта статья поможет вам красиво оформить группу Вконтакте самостоятельно.
Как оформить название группы Вконтакте?
Первое, на что нужно обратить внимание при оформлении группы Вконтакте — это заголовок … При выборе имени необходимо учитывать три основных параметра:
Поиск социальной сети Вконтакте работает следующим образом: есть две группы с названиями «Работа в Интернете» и «Работа в Интернете без вложений». Когда пользователь Вконтакте вводит запрос «работа в Интернете», то группа с соответствующим названием будет выше, даже если количество подписчиков будет равным или вторая группа немного перевесит.
Подведем итоги: владельцам известного интернет-магазина Ali Express, создавая для него группу, необязательно указывать его тематику в названии, большинство это уже знает.Для менее популярного сайта, интернет-магазина, форума при создании группы лучше указать тему в заголовке, как мы это делали выше ..
Как оформить статус группе Вконтакте?
Статус группы Вконтакте менее важен, чем ее название, но на него стоит обратить внимание. Давайте разберемся, как правильно сделать , выдать статус для группы Вконтакте ? Главное, не перегружать его слишком сильно, он должен содержать только самую важную информацию:
Если на данный момент вы не знаете, как прописать статус группы Вконтакте, то лучше отложите это.Вы не должны ничего класть в него. Отсутствие статуса не повредит оформлению вашей группы, а бессмысленная информация в нем может сбить с толку посетителей. Кстати, для публичных страниц важнее статус , так как он отображается в меню «Интересующие страницы» в качестве описания.
Как оформить описание группы Вконтакте?
Сейчас разберемся как заполнить описание группы Вконтакте , а точнее текст, который можно ввести в настройках сообщества.Для этого есть несколько решений:
Кроме того, ВКонтакте имеет ограничение на размер текста в описании группы, который будет отображаться без сворачивания — 600 знаков с пробелами. После превышения этого лимита описание будет свернуто, что сделает его неэстетичным. Вы можете увидеть эту ситуацию на картинке ниже.
В связи с этим рекомендую при заполнении описания группы Вконтакте использовать фиксированные сообщения в шапке, создать для них картинку с описанием, смайликами, текстом и даже меню.Все это добавит красок вашему сообществу.
Как сделать аватарку для группы Вконтакте?
Теперь попробуем разобраться в одном из важнейших аспектов дизайна группы Вконтакте — как сделать аватарку? Для тех, у кого есть свои деньги, вы можете зарегистрироваться на бирже фрилансеров и заказать аватарку и другие элементы для группы (баннер, меню и т. Д.) У опытного веб-дизайнера. Но можно пойти другим путем, сделать аватарку для группы Вконтакте самому .
В первую очередь нужно определиться, какого размера вам потребуется для создания аватара для группы Вконтакте. Максимальная ширина группового аватара составляет 200 букв (далее просто пикселей), а максимальная высота — 500 пикселей. Большие аватары будут уменьшены, чтобы соответствовать указанным пропорциям. Аватары, размер которых меньше указанного, напротив, будут увеличиваться и искажаться на экране. Поэтому создайте аватар для группы Вконтакте шириной 200 пикселей и высотой от 200 до 500 пикселей.
Создавая аватарку для группы Вконтакте, помните о ее миниатюре, которая составляет 200 пикселей по ширине и высоте. Поэтому основную информативную нагрузку аватара (название или описание группы, девиз, призыв к действию и т. Д.) Следует размещать в одной области, которая будет соответствовать заданным размерам.
Самый простой способ сделать аватарку для группы Вконтакте в фотошопе … И совсем не обязательно знать и уметь пользоваться всеми функциями. Достаточно научиться пользоваться основными инструментами (выделение элементов, работа со слоями и т. Д.).). Ниже вы можете увидеть пример аватара, который я сделал для группы Вконтакте.
Этот аватар состоит из двух комбинированных изображений, текстового элемента и фона. На его создание ушло не так уж много времени и сил. С подобной задачей при желании сможет справиться каждый владелец группы.
А если вы хотите создать сложные и красивые аватарки для группы Вконтакте, прорисовывая каждую деталь с нуля, то изучите фотошоп, научитесь пользоваться им профессионально. Это можно сделать несколькими способами:
- Попробуйте все сами, методом проб и ошибок.
- Прочтите статьи об этой программе и посмотрите видео.
- Прочтите книгу или посмотрите учебное пособие.
Первый вариант малоэффективен, так как мало у кого хватит терпения добиться результата таким способом. Второй вариант имеет место. В Интернете есть множество сайтов и каналов YouTube, посвященных изучению Photoshop.
Однако структурировать полученную информацию таким образом будет сложно. К тому же постоянный поиск информации займет много времени.Но это бесплатно, как и первый способ.
Самым простым способом освоить Photoshop будет видеокурс. Так как в нем вся информация будет представлена от простого к сложному, подробно описывая и обучая всем основам работы с программой. И могу порекомендовать вам аналогичный видеокурс.
«» — обучающий видеокурс для начинающих пользователей. С его помощью в любое удобное для вас время, дома за компьютером, вы можете приступить к изучению Photoshop.
В этом курсе вы подробно узнаете, как использовать все возможности Photoshop.Тогда вы сможете легко создавать аватарки с нуля и красиво оформлять группы Вконтакте. Если вам была интересна эта статья, для того, чтобы первыми получать новую информацию.
Мы придумали, как нарисовать красивое меню для вашей группы. А сегодня мы научимся размещать меню прямо на странице ВКонтакте и создавать для него внутренние страницы. Итак, начнем!
Шаг 1. Загрузите пункты меню на сайт vk.com
Заходим в группу и создаем в ней альбом, в который будем загружать пункты меню, полученные при выполнении задания предыдущего урока.Для этого нажмите Альбомы в блоке фотографий на главной странице и в открывшемся окне выберите Создать альбом … Назовем его Альбом для администратора .
Примечание : если у вас на главной странице нет блока фотографий, то перейдите в пункт Управление сообществом (мы это уже делали на первом и втором уроках) и там напротив пункта Фото выберите Откройте или Limited (подробнее об альбомах и о том, что они из себя представляют, мы расскажем в одном из следующих уроков).
Вам будет представлен только что созданный пустой альбом. Нажмите Добавить фото в альбом и загрузите нарисованные вами части меню.
Осталось собрать из этих деталей групповое меню.
Шаг 2. Сборка меню из элементов
Перейти на страницу редактирования меню (как это сделать). Проверяем, включен ли режим редактирования Wiki markup mode … Теперь у вас здесь (если вы выполнили задания второго урока) написаны ваши пункты меню, заключенные в квадратные скобки.Мы их пока не трогаем, а пишем ниже:
unique_number — номер фотографии, которая присваивается ему при загрузке на сайт vk.com. Чтобы просмотреть его, откройте загруженное фото, щелкнув по нему, и посмотрите в адресной строке своего браузера:
388px — ширина вашего меню
Noborder — означает, что к вашим пунктам меню не добавляется черная обводка
Nopadding — означает, что между картинками не будет расстояния (это то, что нам нужно, чтобы меню было сплошным).
Требуется конечный пробел, иначе ничего работать не будет.
У вас должно быть столько строк, сколько пунктов в вашем меню (и, соответственно, сколько картинок вы нарисовали):
Будьте осторожны, чтобы не перепутать порядок изображений.
Заходим на главную страницу группы, обновляем ее (в браузере нажимаем кнопку Обновить или просто F5 ). Восхищаюсь результатом!
Шаг 3. Прикрепите внутренние страницы к меню
При создании меню для группы в режиме редактирования материала на втором занятии мы написали его пункты, заключенные в квадратные скобки.Теперь вы видите их над своим красиво оформленным меню в виде ссылок: в нашем примере это ссылки Как заказать , Как заплатить и т. Д.
Нажав кнопку Заполнить контентом , попадаем на уже знакомую страницу редактирования материалов.
Сразу проверяем, какой у нас доступ к странице (напомним, что доступ к просмотру страницы нужно настроить — Все пользователи , а доступ на редактирование — Только редакторы и администраторы ), и заполняем его информацией.
При заполнении страницы информацией вы можете использовать панель форматирования текста, чтобы выделить акценты, сделать текст полужирным, курсивом, добавить выравнивание или список:
Форматировать текст с помощью этой панели не сложнее, чем работать в Word: вы просто выделяете текст мышью и нажимаете нужную кнопку.
Поскольку вы находитесь в режиме разметки вики, определенные символы будут добавлены к вашему тексту при применении команд форматирования. Например, когда вы выбираете курсивную команду, слово, которое вы хотите выделить курсивом, будет заключено в кавычки.Эти символы являются элементами языка разметки вики. Чтобы увидеть, как текст будет выглядеть на странице, щелкните Preview :
И вот что происходит:
Примечание : мы рекомендуем научиться редактировать текст в режиме вики-разметки, потому что он дает предсказуемый результат, в отличие от режима визуального редактирования, который нестабилен в разных браузерах. Иногда даже один раз переключение в режим визуального редактирования нарушает дизайн страницы.
С помощью полученных знаний расставляем акценты на нашей странице и нажимаем Сохранить страницу … Вот что у нас получилось (помните, это всего лишь пример):
Повторяем этот шаг для каждой из наших страниц (у нас это Как заказать , Как оплатить , Как выбрать правильный размер и Сколько времени занимает доставка ) кроме страницы
Думаю, каждый, кто активно пользуется социальной сетью Вконтакте, уже встречал красиво оформленные группы и паблики. Многие из них, помимо меню, также имеют множество стилизованных вложенных страниц, каталогов и так далее, что фактически создает небольшой сайт прямо внутри социальной сети.
Вот несколько примеров, чтобы каждый понял, о чем идет речь.
Такие группы позволяют выделиться среди конкурентов и привлечь больше пользователей. Тем более, если контент тоже интересный 🙂
В рамках этой статьи мы поговорим о том, как это делается. Чтобы более подробно все разобрать и вникнуть во все тонкости, возьмем конкретный пример. Будет небольшой мастер-класс по групповому дизайну.
Самый первый этап нашей работы — это идея. Нам нужно понимать, что мы хотим сказать и кому. В контакте существует несколько форматов сообщества и выбирать стоит исходя из поставленных задач. Хотя в будущем группу можно преобразовать в публичный формат и наоборот.
Объясняю на пальцах. Public — это что-то для сравнения с блогом. Лента новостей. Другими словами, мы рассказываем нашим подписчикам о некоторых вещах, и они не смогут написать на стене нашего сообщества.Максимум комментировать.
Группа позволяет создать сообщество, более открытое для разговоров и обсуждений, где люди могут публиковать сообщения в ленте от своего имени. Вы также можете добавлять в него друзей из своего списка. Публично такой возможности нет. Кроме того, в группе есть еще немного возможностей для интеграции вики-разметки (есть раздел «Новости», в который можно интегрировать меню).
Глобально можно рассуждать так: если нам нужно создать сообщество для магазина, то я бы выбрал «публичный» формат.Если речь идет, например, об энтузиастах рыбалки, то лучше брать «группу». Хотя каждый волен поступать так, как считает нужным. Ведь формат можно изменить в любой момент. Однако имейте в виду, что Вконтакте вводит ограничение на повторное изменение формата сообщества и после первого раза вам нужно будет подождать несколько дней, прежде чем вы сможете вернуть все обратно в случае необходимости. Поэтому лучше проверить работоспособность до того, как группа начнет наполняться контентом.
В рамках этого мастер-класса я возьму игру «Безумный Макс» по мотивам одноименного фильма, вышедшего всего пару недель назад, за отправную точку и создам сообщество для игроков с различными материалами по этому поводу. игра. Основная цель — снизить посещаемость вашего игрового сайта.
Формат будет «Групповой», так как вам нужно создать естественный поток аудитории и максимизировать общение внутри сообщества. Сразу уточню, что буду использовать универсальную методику, которую можно применять как в групповом формате, так и в публичном.Работает везде.
Контента очень много, начинаем воплощать идею в жизнь!
Создание группы
Для создания группы зайдите в «Мои группы» в правом меню своей учетной записи Вконтакте и нажмите на синюю кнопку вверху «Создать сообщество».
Должно появиться это окно, в котором мы вводим название нашей группы и выбираем формат.
После ввода необходимой информации перед нами открывается панель управления нашим сообществом.В моем случае это выглядит так.
Как видите, я добавил несколько параметров: включил видео, аудиозаписи, обсуждения и ряд других функций, которые мне пригодятся в дальнейшей работе при сборе контента. Все это в дальнейшем можно изменять без каких-либо ограничений. Я также зарегистрировал адрес своего сайта. Если у вас нет сайта или его тематика не соответствует формату сообщества (они о разных вещах и никак не связаны друг с другом), то эту строку можно оставить пустой.
В данном случае я установил возрастные ограничения от 18, по аналогии с теми, которые разработчики выставили для игры. Хотя почти не сомневаюсь, что дети тоже играют.
Все. Группа создана!
Теперь вы можете приступить к его проектированию.
Дизайн группы Вконтакте
Этот этап можно разделить на 2 части: графическую и техническую. Для работы нам понадобится шаблон для создания группового аватара и меню, а также немного фантазии и базовые знания Photoshop (он же Adobe Photoshop).
Шаблон разметки
Что такое шаблон и что это вообще такое? Шаблон — это своего рода заготовка. В данном случае в формате * .psd мы отметили области для изображения под меню и аватаров группы.
Как вы можете видеть во втором примере в начале этой статьи, мы можем сделать дизайн в том же стиле для аватара и изображения меню. При этом визуально разрезает его на 2 части. Таким образом, шаблон позволяет сформировать изображение таким образом, чтобы исключить смещение графики и максимально подогнать изображения к одному уровню.
Для наглядности приведу пример.
Мы видим, что по обеим сторонам картины есть полоса с видом на жилую зону. Сделать ровно с первого раза без шаблона практически невозможно. Вам нужно будет скорректировать изображения, уменьшив расхождения до 1 пикселя. Тогда как при использовании шаблона мы просто добавляем к нему графику в разметке и сразу получаем желаемый результат.
Хочу отметить, что этот шаблон рассчитан на 1 строчку в пояснении.На скриншоте примера есть телефоны. Если появится вторая строка, то вам нужно будет использовать другой шаблон или исправить дизайн вручную.
А пока переходим непосредственно к графическому оформлению нашей новой группы. Здесь я выбираю путь наименьшего сопротивления и захожу в Google Images, чтобы найти элементы дизайна. Вы также можете использовать Яндекс. Кому что больше нравится.
Дизайнерского образования у меня нет, поэтому подробно останавливаться на подборе шрифтов и прочих мелочах не будем.После некоторого волшебства в фотошопе я получил следующий результат.
На левом фрагменте (там, где надпись «Меню») также можно добавить несколько триггеров. В этом случае я решил обойтись без них. Все. Дизайн аватара готов. Нажмите горячие клавиши Shift + Ctrl + Alt + S в Photoshop и сохраните наши фрагменты в папку на жестком диске.
Завершен первый этап работы с графикой. Возвращаемся к контакту.
Установка аватара и меню для группы
Нажимаем на два типа вместо авы нашей группы и загружаем туда наше изображение.Эти ребята, под ними тоже написано «Загрузить фото».
Добавьте изображение. Укажите поля и выберите эскиз. Здесь все просто и проблем быть не должно.
Как мы видим, вам нужно знать идентификатор сообщества. Узнать это очень легко. Находим меню в нашей группе (прямо под аватаркой) и открываем «Статистика сообщества». В этом случае в адресной строке браузера появится нечто похожее (цифры будут другими).
Эти числа после «? Gid =» являются идентификатором желаемой группы. Вставляем полученное значение в форму скрипта и пишем имя страницы, которую хотим создать. В этом случае я вбиваю «Меню».
Следует отметить, что страница будет создана только в том случае, если на соседней вкладке открыто окно с группой. Проще говоря, вы должны быть авторизованы в ВК в том же браузере. Действительно, доступ к таким манипуляциям имеют только администратор группы и назначенные им люди.Случайный прохожий не может легко взять и изменить настройки группы, в админке которой у него нет доступа.
Если все сделано правильно, откроется эта страница.
Это то самое окно, в котором мы позже сделаем разметку вики и создадим внутреннее меню для нашей группы. А пока нам достаточно написать что-нибудь здесь. Затем нажмите синюю кнопку «Сохранить страницу» и вверху нажмите ссылку «Вернуться на страницу».
Написал себе «Меню» и моя страничка после сохранения стала выглядеть вот так.
Пока нет дизайна, но теперь нам нужна только ссылка на эту страницу. Поднимаем его в адресной строке браузера и возвращаемся на главную страницу нашей группы. В ленту.
Здесь мы создаем пост со следующим содержанием: вставляем туда картинку и ссылку на страницу меню для группы.
Щелкните «Отправить». Затем мы нажимаем на время отправки сообщения и выбираем пункт «Закрепить» среди всех вариантов. Обновляем страницу (клавиша F5 на клавиатуре) и, если все сделано правильно, получаем первый результат: группа обзавелась аватаркой и ссылкой для перехода в раздел меню.
Wiki-разметка меню группы Вконтакте
Теперь приступим к проектированию самого меню. Вернитесь в Photoshop и создайте дизайн для нашего меню. При разработке интерфейса нужно помнить о тех людях, которые будут заходить в ВК через приложение с мобильных телефонов. Другими словами, у нас не должно быть мелких элементов, а кроме того, мы должны постараться сделать все максимально понятным. Чтобы не приходилось гадать, как здесь все устроено и где нужно щелкнуть… а просто ткните в нужную точку и изучите нужную информацию.
Сейчас не буду подробно останавливаться на том, как именно собрал меню. Вот что я сделал.
Минимум полей. Вертикальная планировка. Идеальный формат для адаптивного меню. То есть на мобилках ничего никуда не денется. Все будет в точности как на экранах компьютеров и планшетов. Я беру ширину 500 пикселей, чтобы потом ничего не сжалось и не потеряло качество изображения вдвое.Высота не важна.
Разрежьте изображение на фрагменты и сохраните их.
Все. Пора для финального аккорда — собираем меню уже в самой группе.
Для этого мы возвращаемся на главную страницу группы (где находится лента и наша ссылка-картинка, ведущая в меню). Щелкаем мышкой по изображению меню и попадаем на ту самую страницу, которую мы создали ранее для меню.
Если вы являетесь администратором или создателем группы (в нашем случае это так), то вверху страницы будет ссылка «Редактировать».Щелкаем по нему.
Далее переходим в режим вики-разметки (под кнопкой закрытия в правом верхнем углу страницы такой фрейм рисуется внутри). Когда желаемый режим активирован, эта кнопка выделяется серым цветом.
Потом тыкаем в иконку камеры и добавляем сразу все фрагменты нашего меню. В режиме вики мы не увидим сами картинки, а только код этих изображений с размерами и параметрами.
Я хочу расположить меню по центру, чтобы между фрагментами не было промежутков.Поэтому мы оборачиваем каждый из элементов в тег
и к уже вложенному параметру «noborder» добавляю второй параметр «nopadding». Первый отключает обводку фрагментов и границ ячеек таблицы. Второй убирает отступ с края.Первый и последний пункты меню не должны быть кнопками — на моем рисунке это просто графический элемент без ссылки на внутреннюю страницу, поэтому мы добавляем к ним параметр «nolink». Это уберет возможность щелкнуть по этому элементу, чтобы открыть часть изображения в отдельном окне.Теперь по щелчку мыши ничего не произойдет. Это нормальный фон страницы. Неактивный.
В моем случае код меню выглядит так.
Отдельно хочу отметить тот факт, что после импорта изображений в ВК встроенная система иногда некорректно указывает размер изображений. Поэтому нужно внимательно следить за этим и выставлять именно те, которые мы планировали еще на этапе проектирования дизайна. В противном случае все может пойти не так, и головоломка в итоге не получится.
Когда мы написали код и выровняли все элементы, сохраняем страницу и видим то же, что и в Photoshop.
Остается последний штрих — нужно создать те самые страницы, куда наше меню будет отправлять людей. Для этого снова обратимся к скрипту генерации вики-страниц и на этот раз заказываем сразу три страницы. В этом случае также нужно что-то написать на каждом и не забыть где-то сохранить их адреса из адресной строки браузера.
Затем мы вставляем ссылки на новые страницы в вики-код меню в виде page-102302049_51013384, где первое число — это идентификатор группы, а второе — номер страницы. Хотя, это вообще не важно. В конце концов, нам просто нужно скопировать этот фрагмент URL-адреса и вставить его в разметку.
В результате код меню принимает следующий вид.
Внешне ничего не изменилось. Но когда мы нажимаем на пункты меню, мы видим, что теперь это работает!
Что касается самой разметки и правил, по которым написан код, советую прочитать специально посвященную этому делу группу Вконтакте.Ребята описали все ключевые моменты, и в их каталоге вы легко найдете нужный элемент и придумаете, как добавить его на свою вики-страницу.
Почему ВК лучше Facebook? — MyKeyToRussian
Многие россияне не используют Facebook, хотя у них есть доступ к этой платформе. Причина в том, что у них есть местная программа — ВКонтакте или ВКонтакте (что означает «в контакте»), что намного лучше, чем Facebook.
Лично у меня есть учетная запись в обеих социальных сетях, но ВКонтакте мне гораздо удобнее и удобнее.С этим согласны более 95 миллионов человек. Так что же делает ВК таким хорошим?
Vk лучше, чем Facebook, потому что он намного удобнее, интуитивно понятен и понятен. В отличие от FB, это больше, чем социальная сеть. Он предлагает гораздо лучшие развлечения, такие как просмотр сериалов и фильмов и прослушивание музыки. Встроенные приложения ВКонтакте расширяют возможности пользователей. : с ними, вы можете найти то, что в кинотеатре, или даже заплатить за новые джинсы.
Без сомнения, Facebook — потрясающая глобальная социальная сеть, и я использую ее с большим удовольствием.Однако есть моменты, когда местный русский Вконтакте превосходит мирового гиганта.
ВК намного проще, чем Facebook
Когда я впервые зашел на Facebook, я не мог поверить своим глазам. Как социальная сеть может быть настолько перегружена информацией?
В качестве примера сравним боковые панели. Когда ВК содержит только 15 вариантов, написанных большими буквами с широкими пробелами, на Facebook мне нужно найти 26 вариантов, написанных мелким шрифтом с крошечными пробелами между строками.
Я понимаю, что FB хочет показать мне разнообразие своих предложений, но зачем мне среди самых важных вещей видеть «Игровое видео», если я не геймер, «Кризисный ответ», если я не живу в зоне кризиса и «фандрайзеров», если это не я?
Это огромное количество ненужных вещей выглядит беспорядком, когда я ожидаю чего-то ясного и рационального.
Большое количество красочных иконок и кнопок на FB создают визуальный шум, когда минимализм ВКонтакте выглядит намного привлекательнее.
ВК попроще
В ВК вы не найдете повторяющихся кнопок, которые сбивают с толку, тогда как в FB вы видите одну и ту же кнопку «Сообщение» несколько раз на одной странице вместе с «сообщениями с моей страницы» и всплывающим окном, когда кто-то пишет мне.
Другой пример — Facebook, вы можете повторно подключиться к тем, от кого вы отписались, используя настройки слева или напрямую через их страницу. В ВК одна кнопка приводит к одному действию — не более, что значительно упрощает взаимодействие с системой.
Меньше выбора ВКонтакте — лучше
Давайте возьмем настройку ленты новостей. В ВК у вас есть одна крошечная кнопка «сначала интересное», и система в первую очередь покажет вам самые понравившиеся посты. Вот и все.
На Facebook так много возможностей, что вы можете потратить час на создание идеальной ленты новостей. Да, в конце концов, это будет идеально, но готовы ли вы потратить на это столько времени?
Можно смотреть сериалы и слушать любимую музыку в ВК
В Vk вы можете найти свою любимую музыку, составить плейлисты и поделиться треками с друзьями.
За использование этих опций Вконтакте просит совсем небольшие деньги: всего 2,50 доллара в месяц. Конечно, библиотека не такая большая, как в iTunes или Netflix, но вы наверняка сможете найти самые популярные треки, сериалы и фильмы. Из-за строгих законов об авторском праве эта опция недоступна на Facebook.
Что еще более важно, вы можете отправлять эти видео и аудио файлы своим друзьям. Слышали классную песню? Поделитесь им с другом в один клик. Нашли новый ситком? Отправь его своей маме, чтобы она могла посмотреть это прямо здесь.На Facebook вы очень упускаете эту возможность.
ВК — отличная площадка для бизнеса
VK — это социальная сеть для 95 миллионов человек, поэтому это огромная потенциальная аудитория для вашего рекламного контента и покупок.
Создание сообществ в ВК — действительно интуитивно понятный процесс. У меня есть общедоступная страница в Facebook и группа в VK, и мой пользовательский опыт говорит, что поддерживать группу в VK намного проще, тогда как для создания общедоступной страницы в Facebook мне пришлось посмотреть несколько руководств на YouTube.Если вы новичок, со встроенным приложением ВКонтакте вы можете провести полный SMM-анализ своей группы, что в конечном итоге может привести к большей прибыли.
Профессионалы говорят, что у ВК более точные возможности таргетинга. Во время первичной регистрации сайт предлагает вам поделиться различными данными о себе. Это означает, что, если вы хорошо знаете своих клиентов (их возраст, социальный статус и т. Д.), Вам будет легче связаться с потенциальным покупателем.
ВКонтакте есть встроенные приложения
Встроенные приложенияVK выглядят как обычное приложение, но созданы специально для улучшения и добавления дополнительных функций в VK.Руководство платформы создало правила для разработчиков, и каждый школьник может создать свое приложение.
Представляете, насколько это расширяет ваши возможности для пользователей? С помощью встроенных приложений вы можете делать покупки и покупать на AliExpress, читать любимые книги, подписывать петиции, подбирать лучшее место для получения кредита или даже найти работу, не выходя из ВК. Я использовал встроенные приложения для управления своей группой в ВК, и мне это очень удобно.
Оплатить можно ВК
VK также разработала систему предоставления платежей без комиссии.Представьте себе PayPal внутри Facebook — так выглядит оплата ВКонтакте. Позволяет хранить деньги, передавать между друзьями и оплачивать товары.
УFacebook была попытка продвинуться дальше и создать свою криптовалюту, но по политическим причинам это решение было заблокировано. В России такой шаг тоже невозможен, так как виртуальные деньги полностью незаконны.
Является ли vk.com безопасным сайтом?
Vk.com — безопасный сайт. Во время регистрации он попросит только ваше имя и номер телефона (например, Facebook или LinkedIn).При этом не требуются номера банковских карт. Он был одобрен компаниями, занимающимися веб-безопасностью, поэтому присоединиться к нему абсолютно безопасно.
В отличие от Facebook, Vk никогда не просит предоставить паспортные данные, и многие пользователи говорят, что восстановить страницу, если она была взломана, было намного проще.
Как и в любой другой социальной сети, существует вероятность мошенничества, но это зависит не от платформы, а от людей, которые ее используют. Как правило, если вы ведете себя разумно, не вводите пароль 123456, не входите в систему на других устройствах, не разглашаете свою личную информацию посторонним, все будет в порядке.
Разница между ВК и Facebook
Прежде всего, главное отличие — это аудитория. Когда Facebook предназначен для людей с Запада, VK создается для русскоязычных пользователей и в основном используется в Восточной Европе.
Во-вторых, основное различие между двумя веб-сайтами заключается в их содержании. Facebook — это огромная сеть для общения людей и обмена новостями, тогда как ВКонтакте содержит массу музыки, фильмов, сериалов и вирусных видеороликов.
Найдете ли вы фан-сообщество «Теории большого взрыва» на Facebook? С легкостью.Эпизоды шоу? Никогда. Законодательство об авторском праве в США находится под большой защитой. По этой причине FB не добавляет параметры, которые кажутся настолько привлекательными для пользователей.
В России все совсем иначе. Лет пять назад трудно было представить, чего нельзя было найти в ВКонтакте. Кто угодно мог разместить там что угодно, это была местная «Пиратская бухта». Однако правила становятся более строгими, и появились алгоритмы работы, которые автоматически блокируют нелегальный контент.
В этот период тотальной анархии авторских прав российские пользователи настолько привыкли к доступности музыки и видео, что сегодня «ВКонтакте» приходится разрабатывать правовые стратегии для удовлетворения этих потребностей.Если не будет этой сильной развлекательной составляющей, люди, скорее всего, переключатся на мессенджеры или другие социальные сети.
И, наконец, Facebook и VK придерживаются разных стратегий. Facebook — это в первую очередь социальная сеть, а руководство «Вконтакте» старается сделать пространство сайта, где человек делает все: от общения до просмотра фильмов и покупки товаров.
Популярен ли Facebook в России?
Facebook не очень распространен в России, занимает всего 7 место.Его используют 37% россиян, когда ВКонтакте — основной соцсеть используют 83%. Facebook даже оставил далеко позади такие мессенджеры, как What’sApp и Viber.
Почему Facebook не приобрел такой популярности? За исключением причин, упомянутых выше, Россия — моноязычная страна, и не многим людям действительно нужно использовать эту глобальную платформу. Лично я использую Facebook в основном, чтобы общаться со своими студентами и друзьями из-за границы, и ВКонтакте, чтобы поддерживать связь с моими русскими друзьями.
Vk стал золотым стандартом социальных сетей в России, поэтому многим довольно сложно привыкнуть к чему-то в среде другого пользователя.Общие цели платформ совпадают друг с другом, поэтому россиянам не нужно менять платформу, которая соответствует их потребностям, на что-то другое.
ВКонтакте принадлежит Facebook?
Нет, Vk не принадлежит Facebook. Он принадлежит компании Mail.ru Group, зарегистрированной в России. Кроме Вконтакте, у него есть интернет-портал, еще две российские социальные сети и другие интернет-продукты. Конечным бенефициаром компании считается миллиардер Алишер Усманов.
Заключение
Как средний пользователь, я предпочитаю ВКонтакте. Я считаю его дизайн и интерфейс более логичным и понятным. Да, ему не хватает некоторых опций, которые предлагает Facebook, но они несущественны. Вместо этого он обеспечивает большую функциональность: вы можете смотреть фильмы, слушать любимую музыку и покупать вещи в одном месте.
Вы пользователь ВКонтакте? Что вы думаете об этой платформе? Какие преимущества и недостатки вы видите по сравнению с Facebook? Делитесь в комментариях ниже!
Графическое меню группы ВКонтакте.Как оформить группу в контакте и создать выпадающее графическое меню
Цель создателя группы в соц. сети привлекают больше посетителей. Важно, чтобы гость захотел присоединиться, подписаться, прочитать информацию, оставить комментарий или заказать товар. Потребность в конечном результате отличается от направления деятельности.
Первые секунды пребывания формируют дальнейшие действия гостя. Вот почему интерфейс играет большую роль.
Факторы ухода гостей:
- аватар;
- описание;
- титул;
- красивое и практичное меню;
- красочности;
- содержания.
Создать практичное меню, побуждающее не только к действию, — легко. Но для начала нужно разобраться, какой он должен быть.
Какое должно быть меню
Используя хорошо продуманное меню, посетитель может легко перемещаться по нему и быстро получать ответы на свои вопросы. Также навигация позволяет создать правильное впечатление о проекте.
Три основные цели групп:
- продаж;
- увеличился трафик;
- рост активных посетителей.
Для продаж групповая навигация заменяет витрину магазина.
Здесь должны быть самые важные кнопки:
Каталог- ; Цена
- ;
- доставка;
- акционных предложения;
- отзыва.
Чтобы увеличить посещаемость, упор делается на содержание и особенности сайта или блога.
Примерный вариант набора кнопок:
- интересных статьи;
- полезная информация;
- подписаться;
- отзыва.
Для повышения активности участников следует стимулировать их акциями, опросами и интересным и необычным контентом.
Предлагаем следующие кнопки:
- подписаться на новости;
- задайте интересный тематический вопрос;
- сток; Анкета
- ;
- голоса.
Рассмотрим, как создать меню для группы в контакте, все технические моменты, требующие минимальных знаний графического редактора и основ работы с ВКонтакте.
Создаем поэтапно
Создание навигации — процесс интересный, сложный и длительный. Но результат стоит .
Весь процесс условно разделен на 2 этапа:
- работа с фотошопом;
- техническое дополнение.
видео: меню для общественности
Работаем с фотошопом
Прежде чем продолжить, необходимо наглядно представить конструкцию или общий вид, а также его составляющие.Никаких специальных знаний не требуется, просто следуйте инструкциям в инструкции.
Алгоритм действий:
Это делается с помощью инструмента «Прямоугольная область»:
Работа с графикой:
Должно получиться так:
Сохраните прямоугольник справа как отдельное изображение, установив размер 200×500 пикселей. Это готовый аватар, загружаемый через кнопку «Загрузить фото» в группе ВК.
Второй снимок еще нужно разделить по количеству точек. Это сделано для того, чтобы каждой кнопке присвоить ссылку.
Сначала нужно сделать разметку:
Создать фрагменты:
Сохранение изображений:
Как очистить компьютер от ненужных программ? Инструкция здесь.
Техническая часть
Готовые изображения необходимо передать в группу.С этой задачей легко справиться, выполнив следующие шаги.
Важно! Заполнение меню отличается от обычной загрузки фотографий или картинок.
Все по порядку:
Теперь самое главное, собственно, для чего все это было сделано. Добавить функциональность меню. Отдельной картинке должна быть присвоена «ваша» ссылка.
- найдите нужную запись;
- щелкните по нему левой кнопкой мыши;
- скопируйте URL-адрес в адресную строку.
- перейти к источнику, куда нужно отправить посетителя;
- скопируйте требуемый адрес.
Сохраните изменения, нажав соответствующую кнопку внизу окна.
Внимание! Изменения могут появиться не сразу. Рекомендуется выйти из своего основного профиля, а затем снова войти в группу.
Как создать меню в вики-разметке группы Вконтакте
РазметкаWiki — это специальный язык, используемый для разработки веб-страниц в группах социальных сетей.
Этот инструмент позволяет создавать:
- эффектов;
- необычных меню;
- тарелки;
- элемента навигации;
- формат текста.
Одним словом, эта разметка позволяет создать мини-сайт ВКонтакте. Это особенно удобно для продаж и набора подписчиков.
Такой дизайн интуитивно заставляет посетителя остаться, нажав на кнопку. То есть затягивает и побуждает к действию — а это как раз то, что нужно.
Визуально такая система очень похожа на верстку HTML. Но для этого не нужны долгие тренировки и особый настрой.
Видео: меню с поиском по категории
Нюансы создания
Собственно то, что было сделано выше (разделение и загрузка изображения), уже является элементами разметки. В этом преимущество данного инструмента. Автоматическое преобразование в теги при простой загрузке изображений.
Однако важно знать отдельные теги, чтобы помочь вам сделать больше.больше возможностей и красоты. Например, при нашей заливке между изображениями могут появляться белые полосы между изображениями. Вы можете удалить их, просто добавив тег noborder.
Как это: []
Основные теги представлены в таблице ниже:
Работа с картинками
[] .
Где опции заменяются на:
- noborder — удаление рамки вокруг изображения;
- nopadding — удаление пробелов между изображениями;
- plain — вставить ссылку на картинку.Оформлено в виде текста, без графики;
- nolink — удаление ссылки на картинку;
- поле — открытие изображения в окне;
- NNNxYYYpx или NNNpx — устанавливает размер фотографии в пикселях.
Создание таблицы
Вне зависимости от того, какое меню (текстовое или графическое) вы создаете, вы вряд ли сможете обойтись без вставки таблицы. В противном случае вы можете просто вставить текст в поле новостей и не форматировать его, теряя столько времени.
Таблица создается с использованием специального набора символов, каждый из которых отвечает за определенную часть таблицы:
Группа Вконтакте, красивая по дизайну, удобная в навигации и наполненная полезным материалом, всегда вызывает уважение и огромное желание «пройтись» по ее страницам, внимательнее прочитать материал, сделать лайки и даже репостить.
Поэтому на первом этапе его оформления и наполнения у создателей сообществ всегда возникает вопрос, какое дизайнерское решение подойдет его группе, из каких «кнопок» будет состоять меню и каким контентом будут заполняться страницы мини-сайт? Ведь все это в совокупности позволит группе Вконтакте быть более привлекательной, понятной, рабочей и живой.И сегодня я расскажу, как создать красивое меню Вконтакте и на что обратить внимание.
Подготовка к созданию меню Вконтакте
Для того, чтобы составить меню, сначала нужно определиться с его содержанием и внешним видом … Вам нужно знать, из каких разделов будет состоять ваше меню. Это первое. А во-вторых, какую картинку вы будете использовать в ее оформлении и подготовите ее.
Для этого возьмите обычный лист бумаги и начертите (напишите) на нем макет своего меню. А именно названия ваших «кнопок», которые будут вести на страницы, заполненные любым контентом.Имея этот набросок перед глазами, вам будет легче достичь намеченной цели.
В последней статье видео-урока я наглядно показал, как создать текстовое меню. И в этой статье я расскажу и покажу вам еще раз на своем примере. Итак, приступим. Моя тестовая группа называется «Здоровье».
Мое меню будет состоять из трех кнопок:
- Секреты здоровья (перейти на страницу с рекомендациями и советами по здоровью)
- Здоровая шея (перейти на страницу, где будет описание и ссылка на платный курс лечения остеохондроза шеи)
- Здоровая спина (перейдите на страницу, где будет описание и ссылка на бесплатный курс лечения спины).
Создание меню
- Чтобы создать меню, перейдите в «Управление сообществом» на вкладке «Информация», найдите «Материалы», установите «Ограничено» и сохраните.
- Затем возвращаемся на главную страницу группы и вверху видим надпись «Свежие новости», в этот раздел переходим через «Редактировать».
- В открывшемся окне поменяйте, например, надпись «Свежие новости» на «Меню». В пустое поле вводим названия наших страниц — кнопок, слова должны быть закрыты двойными квадратными скобками без пробелов.Каждое имя стоит на новой строке.
- Внизу страницы нажмите «Предварительный просмотр» и просмотрите названия «кнопок», которые стали активными.
- Немедленно исправьте настройки в разделе «Доступ к странице». Страницу могут просматривать все пользователи, редактировать ее могут только администраторы, иначе их завалит спамом. Сохраните изменения.
- Возвращаемся на главную страницу группы, нажимаем на «Меню» и видим кликабельные названия страниц. Щелкните сбоку на «Редактировать».
- Наш следующий шаг — узнать адреса наших страниц — «кнопок». Нажмите в меню на «Здоровая спина» и на странице «Здоровая спина» нажмите «Изменить»
- Далее в окне браузера мы видим такой адрес и берем из него только то, что выделено синим цветом. Адрес нашей страницы «Здоровая спина» должен выглядеть так: page-116040065_52123446, а не так: https://vk.com/page-116040065_52123446?act=edit
- Открываем все три страницы через «редактирование» и копируем три адреса в нашу текстовую записную книжку.В моем случае это выглядит так:
страница-116040065_52123446
страница-116040065_52123461
страница-116040065_52123485 - Далее нам нужны адреса наших картинок, которые будут действовать как кнопки. Для этого загрузите подготовленные картинки в альбом своего личного кабинета и закройте его от просмотра в настройках, чтобы эти вырезанные картинки никто, кроме вас, не видел. Если вы загрузите их в альбом группы, то все, что, на мой взгляд, не совсем эстетично, их увидит.
- Когда вы загружаете все изображения в альбом, предварительно придумав для него имя и отредактировав его в целях конфиденциальности, затем щелкните все изображения по очереди и перезапишите адреса этих фотографий.
- Для этого смотрим в адресную строку браузера. Копируем нужную нам часть и вставляем в нашу рабочую текстовую тетрадь. Адреса изображений должны выглядеть так:
В моем случае адрес верхнего изображения выглядит так:
photo1815_337249677
- Заходим в меню через «Правка», перемещаемся вниз по текстовому меню и вверху пишем адреса наших страниц — кнопок.Это будет выглядеть так, пример моей страницы:
[]
Для наглядности фото:
Я цифрами указал за что отвечает и означает:
1 — это адрес нашей картинки;
2 — это ширина картинки, значит ширина нашего меню, этот показатель можно менять, но идеальный размер — 388 пикселей. Этот номер должен быть одинаковым во всех трех строках;
3 — это текст « noborder; nopadding » отвечает за то, чтобы между изображениями не было промежутков, так что меню представляет собой сплошное изображение;
4 Это адрес страницы нашего меню.
Чтобы не ошибиться, вы можете скопировать мой образец и ввести туда адреса своих картинок и страниц. - Удалите (сотрите) нижнее текстовое меню под цифрой 5 и нажмите «Предварительный просмотр» внизу. Видим наше красивое меню — сохраняем страницу.
- Зайдите на главную страницу группы, обновите ее и нажмите «Меню». Все! Наше меню готово! Нажимая на ярлыки, мы попадаем на страницы. Пока они пустые, но всему свое время.
Полезная информация по теме группы Вконтакте:
Оставайтесь на связи и подпишитесь на последние новости.
Удачи и удачи!
Приветствую вас, дорогие друзья и гости блога. Сегодня мы поговорим о создании меню в ВК и о том, как это сделать в новом дизайне социальной сети. Есть действительно существенные изменения, о которых нужно знать, так как если меню выполнено в старом дизайне, о котором я писал, то картинки могут выглядеть перекосами.
Групповое меню Вконтакте Это ее лицо. Именно его пользователь видит, когда он впервые входит в сообщество, и все ли доступно и красиво оформлено, во многом зависит от того, станет ли он постоянным членом группы.
ВАЖНО: После изменения общего дизайна в ВК изменились и размеры картинок для меню в соцсети. Проверьте свою работу и внесите изменения в группы, описанные ниже.
Типы меню и их особенности
Первым шагом в создании сообщества является определение его главной цели. От этого зависит будущий дизайн меню и его функциональные особенности.
В зависимости от целей группы меню может быть:
- для информационной площадки;
- ;
- для учебной площадки.
Основная часть информационная. Это сообщества, в которых пользователю предоставляется любой развлекательный или образовательный контент. Для такой группы желательно использовать меню с отображением основных тем. Итак, популярные паблики создают разделы: новости, свежие публикации, популярные публикации, а также разделы специально по тематике группы.
Меню для торговли и обучения публики могут быть похожими. Их цель — помочь пользователю ориентироваться в ассортименте продуктов или услуг.В меню продаж, как правило, входят такие разделы, как Каталог товаров, Оплата, Доставка, Акции и скидки, а для обучения его можно ограничить разделами с описанием услуг, так как здесь главное, чтобы пользователь нашел программу обучения. или материал, который ему нужен.
Как создать меню в группе Вконтакте: пошаговая инструкция
Весь процесс можно разделить на 2 этапа:
- Работа в Фотошопе;
- Добавление разделов и картинок в саму группу.
Чтобы точно ответить на вопрос, как создать меню в группе Вконтакте, следует визуально представить будущий дизайн со всеми разделами, а потом, в процессе, можно добавлять элементы, которые еще приходят в голову.
На первом этапе создается аватар группы и изображения для самого меню. Единое изображение будет гармоничнее смотреться как для аватара, так и для меню.
К выбору или созданию аватара нужно отнестись очень серьезно, так как многие пользователи уделяют ему особое внимание… Вы можете найти в Интернете подходящую картинку и добавить к ней надпись или какие-то элементы в Photoshop, а можете сделать абсолютно уникальное изображение самостоятельно.
Так как нам также нужно сделать выпадающее меню, мы ищем или создаем картинку, которая лучше всего соответствует теме группы, или просто берем красивый фон. Работа с изображением будет происходить в Adobe Photoshop, так как функционала обычных фоторедакторов не хватит на все необходимые операции. Все размеры задаются самой социальной сетью Вконтакте и существенные отклонения вверх или вниз приведут к тому, что аватарка либо вообще не загрузится, либо не будет единым целым с меню.
Алгоритм действий:
- Откройте Photoshop и перейдите в «файл» — «создать» и установите ширину и высоту: 760X500 соответственно.
- Выбираем инструмент «резка», а затем — «расколоть фрагмент». Разделите изображение на 3 части по горизонтали. Для фрагмента с левого или правого края в выпадающем окне (в зависимости от того, какую часть вы хотите видеть на аватаре) укажите значения ширины и высоты — 200XX и Y) — 560 и 0. Это будет аватар группы.
- Для следующего фрагмента задаем значения ширины и высоты — 50X500, а в координатах пишем 510 и 0. Это пространство между аватаркой группы и меню. Эта деталь в будущем не понадобится.
- Снова выберите «разбить фрагмент» и разделить по вертикали на 2 части. Для фрагмента сверху установите следующие значения: ширина — 510, высота — 182, координаты — 0. Это пространство над меню. Эта часть также не будет видна в группе.
- Теперь скопируйте выделенное или созданное изображение на созданный и разделенный объект. Если горячие клавиши CTRL + V не работают, просто откройте папку на своем компьютере, где сохранено изображение, и перетащите его в Photoshop.
- Разделите оставшееся пространство по вертикали на столько фрагментов, сколько разделов в меню. Для них значения можно не указывать.
Пишем название каждого раздела.
- Последний шаг — сохранение изображений.Сохранять картинки нужно так: файл — сохранить для Интернета. Этот метод подходит для более поздних версий Photoshop. Если в разделе «файл» нет надписи «сохранить для Интернета», то действуем следующим образом:
Зайти в пункт «файл», выбрать «экспорт» — «сохранить для Интернета». Все параметры оставляем как есть. Снова нажмите «Сохранить».
Выберите папку на вашем компьютере и сохраните в ней изображения. В итоге они должны выглядеть так:
Теперь переходим ко второму этапу, чтобы разобраться, как именно создать меню в группе Вконтакте — напрямую добавить меню в паблик.Для этого:
- В первую очередь необходимо подключить Материалы, так как только таким образом можно добавлять любые разделы на главной странице. Для этого зайдите в Управление сообществом и в самом низу страницы выберите «Материалы», а затем — «Открыть». Сохраняем изменения.
- Загружаем в группу все фото, кроме аватара и тех частей, которые не нужны. Чтобы фотографии отображались на главной странице, вам нужно вернуться в Управление сообществом и щелкнуть напротив вкладки «Фото» — «Открыть».
- Загружаем аватарку.
- Следующий шаг — включить режим разметки вики. Это можно сделать, щелкнув значок ромба в правой части страницы в разделе «Редактировать».
- Здесь мы вставляем код для разметки: [], где [] — это ссылка на раздел или страницу, на которую можно перейти, нажав на фотографию. Вы можете добавлять как ссылки на разделы в самом Вконтакте, так и на внешние ресурсы.
- Этот код дублируется столько раз, сколько разделов в меню, каждый раз вставляя ссылки.
При желании также меняем вкладку «свежие новости», например, на «меню.
- Нажмите «сохранить страницу», вернитесь в основной раздел группы и обновите страницу. По умолчанию меню закрыто, но пользователь, нажав на соответствующее имя, сможет открывать его разделы и перемещаться по ним.
На этом весь процесс завершен, но вы обязательно должны проверить, работают ли ссылки и совпадают ли границы фотографии.
Услуги по созданию группового меню
Если вы все еще не понимаете, как создать меню в группе Вконтакте и пошаговая инструкция вам не помогла, можно воспользоваться специальными сервисами, которые создадут и даже добавят в группу красиво оформленное меню
.
Один из самых популярных сервисов — MenuMake. После подачи заявки заказ будет готов через 5 минут, а затем при желании меню будет добавлено в группу. При этом учитываются все пожелания заказчика относительно дизайна и количества секций.
С уважением, Галиулин Руслан.
Чтобы сделать общий вид сообщества более эстетичным и комфортным в работе, лучшим решением будет создание группового меню. Таким образом, вы можете поместить все важные элементы в один аккуратный список, установить собственный значок или изображение для каждой ссылки, быстро и эффективно уведомлять посетителей о любых изменениях. Меню может включать в себя следующие элементы: различные ссылки на внешние сайты, выноски для обсуждений, альбомы, музыку и другие разделы на сайте Вконтакте, изображения и просто структуру вашей группы.Следуя приведенным ниже инструкциям, попробуйте создать собственное меню для сообщества Вконтакте.
Как создать простое меню в группе Вконтакте
Если вы хотите, чтобы каждая строка меню приводила к той или иной теме обсуждения, в первую очередь, вам нужно создать эти самые обсуждения и дать им имена. Оставлять их закрытыми или открытыми для комментариев — личное дело каждого, так как этот параметр не влияет на отображение страницы в меню.
Постарайтесь составить простое меню, которое будет представлять структуру вашей группы и содержать все наиболее важные разделы.
- Имейте в виду, что меню в группе и в сообществе будут выглядеть немного по-разному. Поэтому, если вы хотите передать группу в сообщество, нажмите на значок в трех точках рядом с названием группы и выберите строку «Преобразовать в страницу». Учтите, что вы не сможете снова превратить сообщество в группу.
- Теперь перейдите по ссылке «Управление сообществом» в том же меню.
Вы увидите блок со всеми настройками вашей группы, здесь вы можете изменить имя, контактную информацию, конфиденциальность, управлять участниками.Перейдите в категорию «Разделы».
- В строке «Материалы» установите значение «Отключено» или «Ограничено», чтобы члены группы не могли случайно повредить ваши файлы, необходимые для проектирования. Не забудьте сохранить свой выбор.
- Зайдите в группу и перейдите в окно «Свежие новости», из которого вы создадите меню.
- Прежде всего, вам нужно изменить заголовок «Свежие новости» на «Меню» или любое другое имя, которое дает понять участникам, что здесь они могут быстро переходить по нужным им ссылкам.
Переключите режим редактирования сообщения на «редактировать разметку Wiki» с помощью маленькой стрелки в правом углу.
Теперь создайте структуру:
- Важно, чтобы у вас в группе были обсуждения, материалы или альбомы, название которых вы будете использовать в меню.
- Напишите все заголовки основных разделов в строке, дважды заключив их в квадратные скобки.
- Чтобы текст выглядел как список, поставьте звездочки перед абзацами.
На этом снимке экрана мы можем предположить, что у группы есть материал под названием «Раздел 1», обсуждение «Раздел 2» и альбом «Раздел 3». Нажмите «Предварительный просмотр» или «Сохранить изменения».
- Ваш раздел изменится на «Меню», и там будут активные ссылки на основные категории группы, аккуратно организованные в виде списка.
Как вставить ссылки в меню группы Вконтакте
Чтобы ускорить доступ к вашему официальному сайту или разделам непосредственно внутри группы, лучше вставлять активные ссылки.
- Вернитесь к редактированию раздела меню. Скопируйте нужную ссылку и просто вставьте ее в окно в режиме разметки Wiki. После сохранения он станет активным.
- Так выглядят все ссылки, которые вы можете вставить в свое групповое меню.
Как создать меню ВКонтакте с картинками
Если вы хотите, чтобы меню состояло из красивых значков, ведущих к определенному разделу, просто следуйте приведенным ниже инструкциям.
- Для начала создайте специальный альбом, который будет содержать только технические картинки по дизайну группы.
- Загружать изображения в формате jpeg не более 500 пикселей на 500 пикселей.
- Скопируйте URL-адрес загруженного изображения.
- Теперь скопируйте ссылку на обсуждение, контент или другой внешний сайт.
- [[Ссылка на изображение в вашем альбоме | размер в пикселях; nopadding | Ссылка на обсуждение или сайт]]
Пример показан на скриншоте.
Щелкните «Сохранить страницу».
- Теперь в вашем меню появится аккуратная ссылка. Вы можете установить значение пикселя по своему усмотрению.
Чтобы добавить несколько изображений, просто введите новые ссылки в новой строке.
В этой статье я расскажу, как красиво оформить группу в контакте. Согласитесь, чем красивее группа, тем приятнее на нее подписываться. При этом у группы будет удобное меню, в которое нужно просто зайти и просмотреть его содержимое.
Поменьше разговоров, приступим меню для группы во Вконтакте .
Во-первых, вам нужно создать саму группу, о чем я писал в предыдущей статье.
Итак, все начинается в фотошопе, мы создаем картинку того меню, которое вам нужно. По сути, это какой-то фон с названиями заголовков. Друг просто попросил меня сделать красивую группу для его компании aero-Stomadent, он занимается промышленной вентиляцией, так что я позабочусь об этом.
Нашла чудесный фон природы Аляски, собственно говоря, все сделаю на нем.
В фоновом режиме пишем само меню. Например, я пишу, чем занимается фирма. Это будут кнопки, которые я затем буду использовать для создания дополнительных страниц. Каждое слово будет тогда кнопкой меню.
Справа сделайте в этой части аватарку группы в будущем.
Теперь режим картинки для маленьких картинок. Выберите в меню функцию «Вырезание», затем щелкните правой кнопкой мыши на холсте и вырежьте так, чтобы каждое слово было отдельным.
Желательно нарезать примерно так.
После нарезки сохраните файл, не только через «Сохранить для Интернета и устройств …» (или Alt + Shift + Ctrl + S), он создаст папку со всеми уже нарезанными файлами.
Сейчас мы еще не собираемся в группу, нам еще нужно создать вики-разметку. Или, другими словами, создайте страницу.
Как создать вики-страницу Вконтакте?
Откройте новую вкладку браузера и вставьте туда следующую ссылку: http://vk.com/pages?oid=-XXX&p=Page_name, где XXX — идентификатор вашей группы.Например, у меня было так.
http://vk.com/pages?oid=-
Затем нажмите Заполнить содержимым … Здесь мы видим очень простой редактор, выберите функцию камеры, чтобы добавить все наши фотографии в меню. Должно получиться что-то вроде моего.
Но между картинками есть пробелы, чтобы убрать пробелы — мы входим в режим вики-разметки (это кавычка вверху в правом углу) вводим следующий тег «option; nopadding;» перед размерами фото.Например []
А оказалось все вместе.
И так, осталось теперь вбить ссылки в каждую кнопку. Опять же в вики-разметке все сделано. Вбиваем заранее подготовленные ссылки на статьи, которые вы считаете необходимыми.
Нажимаем сохранить, смотрим, что получилось, у меня все сошлось, если щелкнуть переходит по ссылкам «https://vk.com/page-542_49969122″
Потом захожу в группу и перед этим делаю изображение, которое будет отображаться для людей в группе.
А я вобще пост. Я вставляю ссылку в меню и добавляю только что сделанное фото.
Узнайте статистику страницы в ВК. Как посмотреть статистику страницы в ВК. Как расшифровать статистику
В этой интересной для пользователей статье я помогу вам с объяснением того, что такое статистика страницы ВКонтакте … Дело в том, что эта функция появилась совсем недавно, и по этой причине многие пользователи не понимают, как ее использовать. Это.
Многие завсегдатаи и некоторые продавцы этой сети задают себе следующие вопросы:
- Как можно и нужно правильно просматривать статистику страницы ВКонтакте?
- Как увидеть уникальных посетителей на своей странице?
- Как включить статистику страницы?
- Могу ли я узнать статистику посещений страниц?
Это далеко не все вопросы, но некоторые из самых популярных, на которые пользователи ВК хотят знать ответ.
Итак, чтобы узнать статистику страницы ВКонтакте, вам нужно нажать на кнопку, расположенную в одном из столбцов (вторая левая) для управления своей страницей ВКонтакте, которая находится там же, где и ваши фотоальбомы, видео и аудиозаписи. И эта кнопка называется «Статистика страницы». Вот как это выглядит:
Как посмотреть статистику страницы ВКонтакте?Но для того, чтобы воспользоваться той функцией, которую сайт контактов может предоставить вам для самостоятельного просмотра данных статистики страницы ВКонтакте, вам понадобится.Что вам нужно сделать, чтобы на вашей странице появилась кнопка статистики, которая, заметьте, появлялась там сама по себе, автоматически? — У вас должно быть не менее 100 подписчиков, которые следят за вами. В противном случае на период 2013 года у вас не будет этой кнопки. И соответственно вы не сможете просматривать статистику в контакте на своей странице. Но со временем все меняется. Или получите 100 подписчиков.
Подписчики никогда не будут лишними, так что это возможность «убить двух зайцев одним выстрелом».«И подписчики появятся, и можно будет просматривать, но только вашу статистику, знайте.
Как включить статистику страницы ВК? Включить статистику страницы, чтобы видеть уникальных посетителей, очень просто. Для этого вам просто нужно нажать на знакомую кнопку статистики.
Вверху вы увидите меню для управления статистикой в контакте, которое состоит из четырех функций:
Вы можете посмотреть статистику ВКонтакте по географии.В этом интересном разделе вы узнаете, сколько у вас было посетителей, из каких стран и городов. Для некоторых пользователей это очень и очень важно.
Теперь вы точно знаете, как и как пользоваться статистикой страницы ВКонтакте.
В новой версии ВК пункт «Настройки» находится в выпадающем меню вверху сайта. Вам нужно нажать вверху справа, где ваше имя написано рядом с аватаркой. Также есть треугольник, направленный вниз. При нажатии там появится небольшое меню — в нем будет пункт настроек.Чтобы открыть настройки, нужно второй раз нажать на слово «Настройки».
Где настройки в мобильном приложении ВК?
- Пятая кнопка в нижнем ряду.
- Кнопка переключения передач вверху справа.
Где выход ВКонтакте?
Выход — там же, в выпадающем меню. В новой версии ВК появилась кнопка выхода с сайта:
Где мои ответы (уведомления) в новой версии ВКонтакте?
В новой версии ВК пункт «Мои ответы» находится в новом разделе уведомлений под знаком колокольчика (вверху сайта на синей полосе слева).Там появляются все новые лайки, ответы, упоминания, предложения дружбы, дни рождения и все другие события. Когда появится что-то новое, на знаке колокольчика появится красный кружок.
Рядом с колоколом вверху сайта есть значок «ноты» — это музыка. Нажмите на нее, и плеер откроется — вот где он находится. А после включения музыки на месте значка «заметки» появятся кнопки управления: назад, пауза, вперед, назад.
Где дни рождения друзей в новой версии ВКонтакте?
Уведомления (уведомления, напоминания) о днях рождения друзей в новой версии ВКонтакте появляются в разделе уведомлений — там же, что и отметки «Нравится», запросы на добавление в друзья и так далее.Как найти раздел уведомлений, мы рассказали здесь чуть выше. Это кнопка со знаком звонка:
Вы можете увидеть дни рождения всех своих друзей. Сначала откройте раздел «Друзья» (через меню в левом столбце), а затем в правом столбце вверху найдите значок календаря рядом со словами «Мои друзья». Откроется календарь, и все дни рождения будут там. Месяцы можно перелистывать кнопками «влево» и «вправо». Вы можете открыть свой календарь еще быстрее, перейдя по этой ссылке: календарь.
Для получения дополнительной информации см. Это руководство:
Поиск людей в новой версии ВКонтакте находится вверху экрана на синей полосе. Просто нажмите ВКонтакте на поле с надписью «Поиск» и начните вводить имя человека, которого хотите найти:
Сайт предложит вам людей (первыми будут показаны друзья). Затем нажмите «Показать все результаты» или нажмите «Ввод», чтобы просмотреть результаты поиска более подробно. После этого в правом столбце можно переключить режим поиска на «Люди», чтобы указать город, возраст, дату рождения.
Еще проще искать людей ВКонтакте вот так:
См. Также эти полезные инструкции по поиску:
Кнопка статистики в новой версии ВКонтакте находится на вашей странице под фото (аватаркой), но только при наличии более 100 подписчиков. Если подписчиков меньше 100, то кнопки нет. В статистике вы можете увидеть посещаемость вашей страницы, пол и возраст гостей, из каких они городов и тому подобное. Чтобы открыть статистику, нажмите на кнопку с изображением в виде графиков под вашей основной фотографией:
А если у вас нет 100 подписчиков, то статистику тоже можно посмотреть, но более ограниченно.Посмотреть его можно по этой ссылке.
Добрый день, друзья.
Каждый день мы заходим на нашу страничку в социальной сети ВКонтакте, просматриваем новости друзей и интересных сообществ, делимся мыслями, фото, видео. Количество наших друзей и подписчиков постепенно увеличивается.
И, конечно же, нам интересно узнать, сколько разных людей прочитали посты на стене и заинтересованы в опубликованных материалах. Поэтому сегодня мы говорим о том, как посмотреть статистику страницы в ВК.Для тех, кто продвигается в этой социальной сети, это не просто любопытство, а важная информация для заработка.
Для новичков, которые недавно зарегистрировались во ВКонтакте, этот раздел недоступен. Видимо, разработчики подумали, что анализ посетителей нужен только активным и популярным лицам. Следовательно, для доступа к статистике у вас должно быть не менее 100 подписчиков. Это люди, которые подали заявку в друзья, но не были приняты в ваш близкий круг общения.
Остальные параметры значения не имеют, важно только то, насколько вы интересны обитателям соцсети. В этом случае не имеет значения, работает страница человека, заблокирована она или удалена. Пока ты сам, он остается там.
Итак, если у вас 100 подписчиков, вы можете узнать посещаемость вашего профиля в ВК. Еще одна особенность — этот раздел закрыт для всех, кроме владельца аккаунта. Ни друзья, ни случайные гости не смогут просматривать данные на странице.
Как открывать и изучать статистику
Чтобы получить интересующую вас информацию, зайдите во ВКонтакте и авторизуйтесь. Нажмите на иконку диаграммы под вашей основной фотографией профиля.
Если под фотографией нет желанной кнопки, введите в адресную строку браузера следующий URL «http://vk.com/stats?mid=id», где. И еще один немаловажный нюанс: если вы еще не получили желаемой популярности, то вы можете посмотреть урезанную версию статистики, перейдя по ссылке «vk.com / feed? section = notifications & w = stats ».
На телефоне перейдите в свой профиль и нажмите на 3 точки в верхнем углу … Выберите в списке Просмотр статистики.
Мы зашли в нужный раздел, и перед нами открылось новое окно с данными. Они представлены в виде графиков и диаграмм. Посмотрим, какую информацию мы сможем получить.
Покрытие
Это первая вкладка, которая доступна сразу после открытия раздела. А на первом графике показано, сколько людей просмотрели посты на стене и в новостях за последнее время.
Сначала мы видим по вертикальной шкале, сколько просмотров было за каждый день, отмеченных по горизонтали. Прокручивая колесико мыши, вы можете изменить расстояние на временной шкале, чтобы увидеть больше данных.
На картинке две кривые, одна показывает всех охваченных пользователей, а вторая показывает только подписчиков. Вы также можете перейти к просмотру информации по месяцам. Здесь мы видим только данные для всех просмотров.
Спустимся ниже к диаграмме, показывающей распределение наших читателей по возрасту и полу.Здесь вы можете получить еженедельную и ежемесячную информацию.
Данные могут быть получены за день, неделю или месяц. Круговые диаграммы очень наглядны, к тому же статистика представлена в процентах. Но если вам неудобен такой формат, то вы можете увидеть те же числа, отмеченные на графике.
Посещаемость
Перейти на следующую вкладку. Первый график показывает количество уникальных посетителей и просмотров. Сиреневая кривая представляет количество просмотров, а синяя кривая — уникальных гостей.Что это значит? Если кто-то посещает вашу страницу несколько раз в день, они учитываются в статистике только один раз.
Ниже вы можете найти данные о поле и возрасте людей, которые заходили к вам. Голубые полосы показывают количество женщин, а синие полосы показывают количество мужчин.
И последний график показывает количество подписанных и отписавшихся пользователей ВКонтакте. Если переключиться на отображение информации «За все время» и повернуть колесико мыши, то мы увидим динамику за последний год.Эта кривая дает нам представление о скорости увеличения или уменьшения нашей аудитории.
Охват отличается от посещаемости тем, что первый относится к тем, кто просматривал сообщения на стене и в новостях. То есть не все из них посетили страницу. Во втором случае это пользователи, которые вводили и просматривали информацию в нашем профиле.
Activity
Это третья и последняя вкладка в разделе статистики. В самом верху мы видим количество людей, которые подписались на уведомления о новых постах.У меня здесь стабильный 0. И твой?
Возможно дело в том, что не все знают, что есть такая возможность и как ее реализовать. А для этого нужно нажать на 3 точки под основной фотографией профиля и выбрать «Уведомлять о записях».
Чтобы увеличить этот показатель, расскажите об этой возможности друзьям и подписчикам.
И последний график показывает, как посетители реагируют на наши сообщения. Здесь мы видим количество лайков, комментариев и репостов.Более того, если ваш друг поделился записью на своей стене, и это понравилось его товарищам, то эти данные также учитываются в вашей статистике.
Если у вас более 10 000 подписчиков, появится четвертый блок статистики — «Рекорды». Он будет содержать данные для каждого отдельного сообщения на стене.
Примечание: проверка активности в настройках безопасности показывает, какие входы в вашу учетную запись были выполнены недавно. Причем это нужно не для анализа аудитории, а в тех случаях, когда есть подозрение во взломе страницы.
Чтобы узнать, сколько лет вы зарегистрированы во ВКонтакте, перейдите по ссылке: «vk.com/feed?w=vk10_years0». Кроме того, будет информация о первых друзьях, статусе, количестве поставленных лайков за все время и т. Д.
Как загрузить статистику на свой компьютер
Можно получить историю активности и другие показатели за любой период путем загрузки информации в файл. Для этого нужно нажать на кнопку в правом верхнем углу.
Здесь вы можете выбрать интересующую информацию и даты.
Статистика сообщества
Данные о посещаемости и активности пользователей доступны не только для личной страницы, но и для групп в ВК. Чтобы получить их, нужно быть владельцем или администратором. Да, есть сообщества, где статистика находится в свободном доступе, но, по моему опыту, это очень редко.
Если у вас есть доступ к информации об аудитории группы, вы увидите соответствующий раздел на странице справа.
Открываем окно и видим те же вкладки, что и в личном профиле, плюс подраздел «Сообщения сообщества». Разберем дополнительную информацию, которую можно получить из статистики паблика:
- на первом графике добавлен вирусный охват — это количество людей, которые просмотрели посты, но не являются участниками и подписчиками группы;
- в блоке «Посещаемость» получаем дополнительную информацию об источниках переходов, динамике участников и просмотрах разделов;
- активность учитывает лайки, переходы по ссылке «Рассказать друзьям» и скрытие новостей сообщества, также есть информация о нажатиях на кнопку действия;
- в разделе «Сообщения сообщества» отображается информация о переписке с пользователями через раздел «Беседы».
При достижении отметки в 5 000 участников в статистику группы добавляется еще одна вкладка — «Записи». Отображает информацию о последних 150 постах на стене. В этом разница между групповой статистикой и личной страницей. В целом данных для анализа аудитории больше, что очень важно для владельцев и администраторов.
Как получить данные о чужих страницах
В самой социальной сети мы видим информацию только об аудитории личного кабинета и публичных страниц, в которых нам даны широкие полномочия.Но есть сторонние приложения и онлайн-сервисы, позволяющие заглянуть в «чужой огород». Один из таких ресурсов — Popsters.
Заходим на сайт и нажимаем кнопку «Попробовать». Далее авторизуемся через ВК и вводим адрес интересующей нас страницы. Вы можете бесплатно пользоваться программой 7 дней и сделать до 10 проверок. Дальнейшее использование и получение инструментов аналитики оплачивается.
Заключение
Посмотрели, как узнать статистику вашей личной странички и сообществ ВКонтакте, разобрали по каждому показателю посещаемости и активности.Этого достаточно, чтобы удовлетворить любопытство. Но для продвижения статистическая информация сама по себе всего лишь инструмент.
После сбора и анализа данных важно сделать вывод о том, кто ваши читатели и поклонники, какой контент им больше всего интересен, что делать для увеличения аудитории. Также большое значение имеет вовлеченность: лайки, репосты, новые подписки, комментарии. Для продвижения страницы их нужно увеличивать естественным образом и с помощью качественного продвижения.
Если есть вопросы, пишите в комментариях.
Всего доброго, друзья. До новых встреч на страницах нашего блога.
Часто задумываешься — насколько ты популярен во Вконтакте? Сколько пользователей интересуются вашей личной жизнью или опубликованными постами? Позволю себе ответить за вас — часто. Поскольку вы сейчас просматриваете эту страницу не случайно, а в надежде получить конкретные номера и даже имена.
Сразу обсудим один нюанс — есть один способ просмотра статистики страницы в ВК.Он официальный, предусмотрен штатным функционалом социальной сети.
Использование сторонних методов, найденных в интернете — неминуемо ведет к потере доступа к вашей странице или банальному разводу на деньги .
Официальный способ посмотреть статистику страницы Вконтакте
В администрации предусмотрена возможность просмотра статистики для всех пользователей, у которых на аккаунте более 100 подписчиков. Преодолеть этот «порог популярности» можно тривиально — накапливая их количество.Я не имею права рекомендовать конкретные услуги, самостоятельно их найти не составит труда.
Большинство сервисов предлагают два варианта накрутки:
- Боты автоматически регистрируются учетными записями. Спустя короткое время они становятся так называемыми «Собаками», но не пропадают с подписчиков.
- Предложения — страницы реальных людей, выполняющих задания за деньги. Выбирая этот вариант, вы рискуете потерять доступ к статистике из-за постепенного роста отписок.
Чтобы узнать недостающее количество, откройте профиль главной страницы, обратив внимание на этот раздел.
Вы заметили? Я использовал этот метод. Как только вы это сделаете, переходите к следующему шагу.
Чтобы открыть раздел статистики — нажмите кнопку с тремя горизонтальными точками под своим аватаром.
Откроется интерфейс искомого инструмента.
На мобильных телефонах — Android и Iphone
Пользователи мобильных телефонов могут получить доступ к статистике с помощью мобильной версии сайта.
Авторизуйтесь на m.vk.com, выберите — «Версия для компьютеров» (ссылку нужно открывать с помощью браузера), повторите шаги, описанные выше.
Официальное приложение, доступное для загрузки в Google Play и App Store, не содержит требуемой функциональности.
Правильный анализ данных статистики
Открыв страницу со статистикой вашего профиля, вы встретите множество графиков и непонятных понятий. Поэтому предлагаю совершить небольшую экскурсию, а потом разобрать все числа на моем примере.
Первая вкладка — покрытие , показывает, насколько популярен опубликованный контент. Учитывается не только прямой охват — друзья и подписчики, но и вирусных (полный) — полученных благодаря репостам, просмотрам в ленте.
Скачки диаграммы четко указывают на публикацию контента. Как видите, я не очень популярен.
Ниже приведены графики, показывающие некоторые характеристики вашей аудитории:
- Пол и возраст;
- Местоположение;
- Устройство, с которого пользователь был авторизован во время просмотра.
Вконтакте отображает местонахождение человека не по IP-адресу, а по городу, указанному в настройках. Учтите это при анализе.
Вкладка вторая (самая интересная) — посещаемость , , отображается количество людей, которые посетили профиль, без указания Имени, Фамилии и даже id. По ту сторону мониторов есть небольшое разочарование, но с этим ничего не поделать.
Еще раз предупреждаю — никакие программы, например, «Мои гости» — не дадут вам указанного выше списка.
На графиках ниже представлена дополнительная информация о посетителях.
Рассмотрим небольшую особенность — возраст посетителя отображается не по дате рождения, а по наступлению нового календарного года.
Вкладка — активность , отображает сводную информацию о количестве лайков, комментариев за определенный период времени.
При достижении 10 000 подписчиков информация о каждой публикации будет доступна отдельно.
Вместо вывода
Выше я постарался максимально подробно описать все тонкости при работе с этим инструментом, упустив три важных вопроса:
- Загрузка статистики аккаунта. Вы можете скачать файл со всеми данными на свой компьютер (для работы вам понадобится Microsoft Excel или Google Docs), но гораздо удобнее использовать веб-интерфейс.
- Просмотр статистики чужого аккаунта. В таких статьях часто упоминается сервис Popsters, созданный для работы с группами ВКонтакте, а не с личными страницами.Кроме обобщенной информации о количестве постов, лайков и комментариев вы ничего не найдете.
- Дополнительным источником информации станет сервис, созданный командой ВКонтакте за десятилетие. Он расположен по адресу
Два важных результата запрета Украиной российской социальной сети ВКонтактеEuromaidan Press
Источник: Appleapple
Гибридная война
В мае 2017 года Президент Украины ввел в действие решение Совета национальной безопасности и обороны (РНБО) о введении экономических санкций в отношении 468 российских компаний.Забанена, в том числе, крупнейшая российская социальная сеть Вконтакте (ВК). В прошлом году украинские аналитики, работающие в НАТО StratCom, проанализировали более 300 000 украинских профилей пользователей ВКонтакте, чтобы определить результаты и эффективность блокировки. На фоне трехкратного сокращения числа активных пользователей аналитики также пришли к еще одному удивительному выводу в своем отчете: оставшиеся пользователи ВК стали более взаимосвязанными, радикальными и антиукраинскими. Дело важно для разработки другой более эффективной политики противодействия российской пропаганде и дезинформации.В Законе Украины «О санкциях» говорится, что санкции были введены с целью «защиты национальной безопасности и территориальной целостности Украины, противодействия терроризму, а также предотвращения нарушений прав, свобод и интересов граждан, общества, и государство Украина ».К крупнейшим запрещенным интернет-компаниям относятся российские социальные сети ВКонтакте (ВК) и Одноклассники, поисковая система Яндекс (включая ее сайты с доменом .ua) и почтовый сервис Mail.ru. По данным SimilarWeb, аудитория ВК в Украине из-за бана уменьшилась более чем на 60%.
Рейтинг лучших сайтов во всех категориях в Украине. Источник: здесь и ниже все изображения из отчета
Поскольку запрет не распространяется на территории, оккупированные Россией, в исследовании были определены два целевых региона: подконтрольные правительству районы (ППТ), на которые распространяется запрет, и неподконтрольные правительству районы (НППТ), на которые запрет не вводился ( Крым, ДНР и ЛНР).
Динамика разноски во времени
Запрет был эффективен в некоторых аспектах, в частности, для уменьшения количества активно вовлеченных пользователей. Это хорошо видно по количеству постов в день. До запрета общее количество сообщений достигало 101 000 постов в день. После запрета среднее количество постов снизилось в среднем до 38000. С апреля 2018 года трафик снова снизился на 10 000 и стабилизировался на этом уровне. Таким образом, период исследования (с 1 мая 2016 г. по 14 июня 2018 г.) был разделен на три интервала: до запрета, первый «исход пользователей» и второй «исход пользователей».
Динамика проводок за период исследования
Первый исход пользователей можно объяснить отказом законопослушных граждан от ВКонтакте и неспособностью остальных использовать виртуальные частные сети [VPN]. Вторая волна могла быть вызвана теми, кто по-прежнему осознавал, что потерял свою аудиторию, что сделало активность в ВК менее интересной для них.
Исход пользователя не обязательно означает, что пользователи удалили свои учетные записи, но перестали публиковать что-либо в сети.Обе волны ухода пользователей из ВК сопровождались пиками активности в других социальных сетях. В середине мая 2017 года наблюдался значительный всплеск использования поисковых запросов Facebook и два всплеска использования поисковых запросов Telegram в мае 2017 года и апреле 2018 года.
Относительная частота поисковых запросов, связанных с Вконтакте, Facebook и Telegram в Украине
Средний возраст пользователей (указанный в их профилях) не изменился в занятых областях, в то время как средний возраст пользователей в GCA снизился на 1.В среднем 7 лет. Это могло быть результатом того, что молодые люди использовали мобильные телефоны для просмотра веб-страниц в Интернете и доступа к социальной сети, усугубляется тем, что пожилые люди могут быть менее знакомы с VPN, что может помочь им обойти запрет.
Связи между выборкой из 2000 случайных пользователей из GCA
Социальный график выше, отображающий связи между ~ 2000 случайными пользователями из GCA, был создан для более детального анализа исхода пользователей. В выборку были включены только активные пользователи.Как показано на диаграмме, наиболее подключенные пользователи, расположенные в центральной части графика, в основном продолжали использовать ВК (отмечены красным), в то время как менее подключенные
пользователей, расположенные на периферии, покинули социальную сеть во время первый исход (отмечен зеленым) или второй исход (отмечен желтым). Кроме того, пользователи, которые публиковали сообщения чаще, также с большей вероятностью остались (большинство крупных узлов отмечены красным).
Распределение количества друзей на пользователя до и после блокировки
Несмотря на то, что большое количество пользователей покинуло сеть, те, кто остались, стали более тесно связаны, приобретая больше друзей и подписываясь на большее количество групп.Это тенденция как для GCA, так и для NGCA, но для GCA она сильнее.
Доминирующая идеология в Сети до и после запрета
Из весьма разнообразных идеологических постов с сильным российским присутствием до запрета инфосфера ВК изменилась на преимущественно русскую или пророссийскую.
Чтобы выявить идеологически окрашенный трафик, исследователи создали две случайные выборки из примерно 300 000 сообщений до и после запрета. Выбранные сообщения были написаны только на русском или украинском языке, были длиннее 140 символов и не были помечены как спам.Количество уникальных пользователей составило 75 089 в первой выборке и 48 766 во второй выборке. Из них 91,6% профилей до запрета находились на GCA, но только 84,6% остались после запрета.
В выборках до и после запрета было выявлено несколько основных кластеров идеологических постов, а также их доля в каждой определенной выборке. Количество идеологических постов после запрета увеличилось в 1,22 раза по сравнению с периодом до запрета.
Кластерная дендрограмма с основными кластерами идеологических постов до и после бана
Основные группы идеологических постов изображены на схеме выше.Понятно, что после бана аудитория ВК уходит в пророссийскую инфосферу. Некоторые проукраинские кластеры («Проукраинская риторика», «Патрульная полиция») вообще исчезли, а у других уменьшилось количество постов («Новости Украины»). Пророссийские кластеры, наоборот, увеличились в размерах («пророссийская пропаганда», «ДНР и ЛНР»), появилось несколько новых русских («Новости России», «Дональд Трамп и США»).
Большинство аккаунтов пользователей, публикующих сообщения об идеологических проблемах до бана, продолжали использовать ВК после бана, в отличие от 2/3 частных аккаунтов, выходящих из сети.Было выявлено 467 таких идеологических профилей в обоих регионах. Только 35 профилей с GCA и четыре профиля с NGCA покинули сеть.
Более тщательная проверка тех, кто продолжал распространять идеологические, как правило, антиукраинские сообщения после запрета, показывает, что доля небольших аккаунтов с идеологическими постами (менее 50) после запрета увеличилась в 17 раз, а доля таких большой пост более 1500 идейных постов уменьшился в 2,5 раза. Это означает, что небольшие профили людей стали больше участвовать в распространении идеологических сообщений, чем большие страницы.
Идеологические пользователи также стали значительно более взаимосвязанными, чем обычные пользователи после запрета. В то время как у обычного пользователя до запрета было в среднем 195 друзей и 217 после запрета, количество друзей идеологического пользователя выросло с 197 до 501.
Дополнительные угрозы
Несмотря на значительный успех трехкратного сокращения общего количества постов (что соответствует уменьшению количества пользователей), оставшиеся пользователи стали еще более идеологически активными и пророссийскими.Они потеряли любую оппозицию или альтернативные взгляды в сети, которые раньше могли сделать их менее радикальными. Кроме того, после запрета они стали более взаимосвязанными. Создан своеобразный информационный пузырь для тех пользователей, которые до сих пор пользуются ВКонтакте. Те же сообщения публикуются и повторно распространяются оставшимися пользователями, и получается двоякий результат: население в целом стало более оторванным от российской пропаганды, в то время как оставшееся меньшинство еще более втянуто в нее.
Читайте также:
Украине нужна независимая журналистика.И ты нам нужен. Присоединяйтесь к нашему сообществу на Patreon и помогите нам лучше соединить Украину с миром. Мы будем использовать ваш вклад для привлечения новых авторов, обновления нашего веб-сайта и оптимизации его SEO. Всего за одну чашку кофе в месяц вы можете помочь навести мосты между Украиной и остальным миром, а также стать соавтором и проголосовать за темы, которые мы должны затронуть следующими. Станьте покровителем или найдите другие способы поддержать. Станьте покровителем! СвязанныеТеги: дезинформация, гибридная война, информационная война, гибридная война России, российская дезинформация, российские СМИ, российская пропаганда, ВКонтакте
Текстовое поле на вики-странице в вк.Разметка WIKI: графическое меню
Если у вас есть своя группа, то вы можете создавать в ней отдельные страницы. Это позволяет создавать большие и разнообразные сообщества, размещать всевозможную информацию и структурировать ее.
Для создания страниц используйте разметку Wiki … Теперь разберемся, что это такое.
Что такое разметка вики?
Обычные веб-страницы создаются с использованием языка HTML. Но для создания страниц в ВК он не распространяется. Вместо этого используется разметка Wiki.Он также предназначен для предоставления возможности разметки элементов на странице. С его помощью мы можем делать ссылки (см.), Кнопки и т.д. Выглядит это так.
Для чего это используется?
Для создания страниц и дизайнерских групп. Используя разметку, вы можете создавать информативные и функциональные страницы, пункты меню и многое другое.
Структура разметки Wiki
https://vk.com/wiki?w=page-87938575_51299900
Все основные элементы подробно представлены, и дан код.
[]
Как начать пользоваться?
Для начала нужно убедиться, что контент в вашей группе активен.Заходим в сообщество, открываем меню и выбираем пункт.
Заходим во вкладку «Раздел». Здесь находим пункт «Материалы», и для него устанавливаем значение «Открыть».
Сохраняем настройки и возвращаемся в группу.
У нас есть вкладка «Последние новости» … Заходим в нее, и нажимаем кнопку «Редактировать».
Переходим в режим редактирования страницы. Можете начинать его заполнять. Не забудьте переключиться в режим верстки Wiki, нажав соответствующую кнопку в меню.
Когда закончите, сохраните страницу.
Видеоурок по: создание группы с разметкой Wiki
Вопросы?
В контакте с
С помощью вики-разметки можно оформить групповое меню, аналитические статьи, кейсы, инструкции. Конечно, на это уйдет немного больше времени, чем на оформление обычных столбов на стене. Но чем больше вы возитесь с дизайном контента, тем более благодарной будет ваша аудитория.
Как работает разметка вики РазметкаWiki — это язык, который используется для макета страницы.Условно его можно назвать младшим братом HTML. На вики-страницах удобно писать и форматировать текст, вставлять иллюстрации, видеоролики, ссылки, таблицы. Вы можете набрать простую статью или создать целое интерактивное руководство с главами и подзаголовками.
Ширина любой вики-страницы составляет 607 пикселей. Высота ограничена только количеством знаков, их может быть около 16000.
Вся разметка вики помечена тегами, как и HTML. Есть одиночные теги (например,
— разрыв строки) и парные (например, эскиз ).
Как теги для текста работают в разметке вики
В некоторых случаях в вики-разметке используется упрощенный синтаксис (теги заменены типографскими символами). Например, чтобы создать маркированный список, используйте звездочки «*», а для нумерованного списка используйте решетки «#».
Как типографские знаки работают в вики-разметке
Все существующие теги и способы их использования собраны в официальном сообществе вики-разметки ВКонтакте… Используйте материалы этого сообщества как надежную шпаргалку. В этой статье мы рассмотрим основные принципы работы с вики-разметкой и шаг за шагом покажем вам, как использовать ее для создания страниц и групповых меню.
Стандартный редактор вики-страниц имеет два режима: визуальный и режим разметки вики (кнопка переключения выглядит так :).
Так выглядит активный режим разметки вики.
Примитивный текст с парой картинок можно выложить в визуальном режиме.Это обычный текстовый редактор, не требующий каких-либо знаний о вики-разметке. Но если вам нужна аккуратная вики-страница с таблицами, ссылками и встроенными видео, это можно сделать только в режиме разметки — с помощью кода.
Как создать вики-страницуКнопки «Создать новую страницу» в самом интерфейсе ВКонтакте не существует. Поэтому речь идет о двух методах: стандартном и расширенном (с использованием приложения).
СтандартныйДля группы. Перейдите в «Управление сообществом» → «Разделы» → «Контент» и выберите «Общедоступный» или «Ограниченный».
Как включить «Контент» в группе
Теперь на главной странице группы появится раздел «Последние новости». Это место для предполагаемого группового меню. Чтобы создать новую страницу, вы можете написать ее название прямо в режиме редактирования страницы «Последние новости», заключить его в квадратные скобки, нажать «Предварительный просмотр» и получить готовую ссылку на новую страницу.
Как создать новую страницу через «Свежие новости»
Для общественности. Чтобы создать новую страницу, вам нужно узнать id вашего паблика. Для этого перейдите в раздел «Статистика сообщества». В адресной строке браузера вы увидите такой код:
https://vk.com/stats?gid= 123456789
Требуемый идентификатор группы состоит из цифр после «gid =».
Теперь вам нужно ввести следующий код в адресную строку вашего браузера:
https://vk.com/pages?oid=-ХХХ&p=Page_name
Вместо XXX подставляем id паблика, вместо «Page_name» — имя, которое вы придумали.В названии можно использовать кириллицу, латиницу и цифры. Не запрещено использовать специальные символы, но лучше не рисковать: из-за них вы можете потерять возможность редактирования страницы. Вставляем все данные в нужные места, нажимаем Enter, и браузер откроет созданную страницу.
Использование приложенияРазработчики ВКонтакте рекомендуют к использованию три приложения для работы с вики-разметкой: «Mobivic», «Источник» и Вики Плакат.
В этом руководстве мы возьмем приложение Mobivic в качестве примера.В ноябре 2017 года он получил второе место в программе VKontakte Start Fellows. Работает без установки и дополнительной регистрации в десктопной, мобильной версии ВКонтакте и в приложении для телефона (разработчик рекомендует использовать версии не ранее Android 5.1, iOS 9 и Windows Phone 8.1).
Чтобы создать новую страницу, на главном экране приложения выберите нужную группу и введите имя новой страницы, а затем нажмите «Получить ссылку».
Как создать новую страницу с помощью приложения Mobivic
Ссылки на новую вики-страницу в приложении Mobivic
А вот лайфхак для тех случаев, когда вы сделали сложную страницу с большим количеством элементов и боитесь, что макет уйдет на маленький экран.Скопируйте адрес из кода для вики-страницы. Перейдите в режим редактирования вашей страницы и вставьте его в самое начало кода. У вас получится вот такое изображение:
Когда пользователь нажимает на нее, он попадает в приложение Mobivic, которое отображает аккуратную мобильную версию вашей страницы.
Слева — страница меню сообщества LIVE открыта на мобильном телефоне,
справа — то же самое, но открывается через «Мобивик»
Как мне найти страницу, созданную мной ранее? Самый простой и надежный способ — заранее скопировать все адреса вики-страниц в отдельный файл, например, в Google Sheets.Другой способ — через любое вики-приложение. Например, зайдите в «Мобивик», выберите название сообщества и нужную страницу, нажмите «Получить ссылку» и скопируйте адрес из пункта «Ссылка на вики-страницу».
Как получить ссылку на ранее созданную вики-страницу
Скопируйте ссылку на вики-страницу и вставьте ее в новое сообщение на своей стене или стене сообщества. Если все сделано правильно, сайт сгенерирует блок ссылок под текстовым полем сообщения.Теперь удалите текст самой ссылки, прикрепите баннер и нажмите «Отправить». В настольной версии баннер также станет ссылкой на вики-страницу, а в мобильной версии он будет открываться как обычная картинка.
Изображение, прикрепленное к сообщению, станет частью ссылки на вики-страницу в настольной версии
Возможности форматирования текста в вики-разметке в целом не отличаются от возможностей обычного текстового редактора.При редактировании текста напрямую (выделение жирным шрифтом, выравнивание по правому краю и т. Д.) Мы используем теги разметки вики, не забываем их закрыть: Центр текста .
Комбинации типографских символов предназначены для структурирования текста в вики-разметке. Например, следующий код «—- «Поставлю в текст горизонтальную разделительную черту и тому подобное» :: «- двойной отступ перед абзацем.
На одной странице можно разместить около 16 тысяч знаков.
СсылкиЧтобы текст был виден вместо адреса, добавьте название ссылки:
[] — в профиль пользователя
[] — на главную страницу сообщества
[] — на другую вики-страницу
[] — для встречи ВКонтакте
ИзображенияМаксимальная ширина изображения, которое можно использовать в разметке вики, составляет 607 пикселей, что соответствует ширине самой страницы вики.Высота практически не ограничена (помните, что высота самой страницы — 16 000 знаков). Изображения можно загружать двумя способами.
Использование загрузчика в верхнем меню редактора.
С помощью кода. Загружаем картинку в отдельную группу альбомов, открываем, в адресной строке видим длинный код вроде этого
https://vk.com/club12345678?z= фото-12345_12345 % 2Falbum-12345678_12345678
Скопируйте с него id картинки (жирным шрифтом).Затем мы заключаем его в двойные квадратные скобки и вставляем в нужные места на странице. Получается примерно так:
[]
Что дальше? Редактировать выравнивание, перенос текста, размер, привязку. Для этого укажите желаемые параметры после вертикальной черты и разделите их точкой с запятой. Например, в этом коде мы устанавливаем размер изображения 300x100px и обтекание текста вправо:
ВидеоСначала вам нужно загрузить свое видео в Community Videos.После загрузки откройте видео и скопируйте его идентификатор из адресной строки (выделен жирным шрифтом).
https://vk.com/videos-12345678?z= видео-12345_12345 % 2Fclub12345678% 2Fpl_-12345678_-2.
Заключим его в квадратные скобки и получим следующий код:
Получаем маленькую картинку со значком воспроизведения, при нажатии на нее разворачивается полноценный видеоплеер. Для того, чтобы видео воспроизводилось на самой странице, разработчики ВК предлагают использовать проигрыватель тегов.
Но здесь мы получаем непропорциональную черную рамку вокруг видео:
Чтобы его убрать, нужно изменить размер плеера под размер самого видео.Например, в нашем случае подошли следующие параметры:
У нас получилось видео без черных рамок, будет воспроизводиться прямо на странице
Если вы хотите красиво структурировать содержимое своей вики-страницы и аккуратно отображать его на мобильных устройствах, вам не обойтись без таблицы. Вот вам и понадобятся эти простые знаки:
При работе с таблицами можно использовать 4 тега: noborder (делает границы таблицы невидимыми), nomargin (делает таблицу во всю ширину вики-страницы) nopadding (удаляет отступы в ячейках) и fixed (позволяет создавать таблица фиксированных размеров).Сколько ячеек вы укажете в строке, сколько столбцов будет в таблице.
Вот пример таблицы 2 × 2 без полей вверху и внизу текста внутри ячеек:
Ширина первого столбца 200 пикселей, а второго — 300 пикселей.
Вот что из этого вышло:
В ячейки таблицы можно помещать текст, картинки, аудио- и видеозаписи.
Как сделать вики-менюГрупповое меню ВК — это не какой-то отдельный функционал, а просто вики-страница с несколькими картинками, в каждую из которых вшита ссылка на определенную страницу.На самом деле здесь все просто.
- Готовим обложку для меню. Вы можете сделать любой подходящий снимок и нанести на него текст. Или вы можете нанять дизайнера, который нарисует для вас красивые блоки и кнопки. У нас будет 6-кнопочное меню. Для этого нам понадобится картинка, на которой будут обозначаться эти кнопки. Определимся с его размером.
При подготовке изображения для меню помните, что ширина вики-страницы составляет 607 пикселей. Ширина изображения не должна быть больше, иначе изображение будет сжиматься и терять качество.В качестве примера мы взяли изображение размером 510×300 пикселей.
- Разрежьте эту картинку на 6 частей (часть для каждой кнопки). Это удобно делать в Adobe Photoshop с помощью инструмента Cutting. Если не хотите заморачиваться, воспользуйтесь, например, онлайн-сервисом IMGonline (разрезает картинки на равные части). Все сделали в фотошопе.
При активном инструменте «Вырезание» щелкните изображение правой кнопкой мыши и выберите «Разделить фрагмент», укажите необходимое количество фрагментов и нажмите «ОК».
Как вырезать картинку в фотошопе
Наше меню будет представлено в виде таблицы из 6 ячеек: трех строк и двух столбцов. Для этого мы разрезаем картинку для меню на 6 равных частей размером 255 × 100 пикселей. Для каждой ячейки необходимо установить одинаковый размер.
- Создайте каркас для таблицы. Заходим в режим редактирования новой страницы и составляем таблицу. Открываем его тегом (| и сразу задаем три важных параметра:
- nopadding — разрешит касаться картинок
- noborder — скрыть видимые границы таблицы
- fixed — позволяет установить точный размер ячеек.
Укажите фиксированную ширину ячеек — 255 пикселей 255 пикселей (дважды, потому что также есть два столбца). Далее устанавливаем места для начала новых строк с помощью тега | — и новые ячейки (столбцы) с тегом | … Закрываем таблицу тегом |) и получаем следующий скелет:
- Помещаем картинки в ячейки и устанавливаем на них ссылки … Поочередно открываем нужные части картинки в альбоме сообщества, копируем их id из строки браузера (фото-12345_12345), заключаем в двойные квадратные скобки , прописываем размеры 255х100px и тег nopadding для склейки картинок.После вертикальной полосы назначьте ссылку каждой кнопке. Получаем следующий код.
(| noborder nopadding фиксированный
| ~ 255px 255px
| —
| []
| —
| []
| []
| —
| []
| []
|}
- Готово! Нажимаем «Сохранить страницу» — и мы получаем удобное для сообщества меню.
Готовое групповое меню в настольной версии
Готовое групповое меню в мобильной версии
Если вы сделали меню для группы , то оно будет легко доступно, нажав на «Свежие новости» (кстати, эту страницу можно переименовать в «Меню» в режиме редактирования).
Если вы создали меню для общедоступного , то оно может отображаться на видном месте под именем сообщества с помощью закрепленной записи.
Чтобы закрепить меню в группе , опубликуйте сообщение с баннером и ссылкой на вики-страницу от имени сообщества (если вы публикуете от своего имени, закрепить страницу будет невозможно). В паблике проблем с фиксацией не возникнет: там можно закрепить пост любого автора.
Как сделать пост со ссылкой на меню в паблик
Как закрепить меню сообщества
Администрация ВКонтакте объявила о запуске редактора статей 22 декабря 2017 года и позиционирует его как инструмент для публикации лонгридов.
Некоторые пользователи решили, что он создан для замены вики-разметки. Но делать такие выводы пока рано, потому что функциональность редактора пока еще скудная. Он не может редактировать медиафайлы (размер и выравнивание) и создавать таблицы, а гиперссылки можно назначать только тексту. Здесь нет тегов и кода, есть только визуальный режим, как в обычном текстовом редакторе.
Из этого видно, что по-прежнему можно создать удобное меню для сообщества или вики-лендинга только с помощью вики-разметки.Что будет дальше — покажет время.
Так выглядит интерфейс нового редактора статей ВКонтакте
- Стандартный метод создания вики-страниц кропотлив и не очень удобен для пользователя. Самый простой способ создать страницу — использовать приложение Mobivic, исходный код или Wiki Poster.
- Меню сообщества нужно сделать таблицей, чтобы оно выглядело аккуратно на мобильных устройствах.
- При редактировании вики-страницы в стандартном интерфейсе не переключайтесь между режимом визуального редактирования и режимом разметки вики. Из-за этого может пойти расклад.
Необязательно запоминать все теги; достаточно оставить ссылку на
Wiki page (вики-страница) Вконтакте
Мы решили написать эту статью, чтобы помочь мамам в декрете, которые хотят начать зарабатывать деньги в профессии администратора социальных сетей. Wiki — очень просто, это технология, которая позволяет пользователям сайта самим заполнять и изменять содержание этого сайта.
Что такое вики-страница и зачем она нужна?
Наверняка многие из вас неоднократно видели в ВКонтакте в различных сообществах красиво оформленное меню, при нажатии на которое вы попадаете в выпадающий графический список с нужными заголовками.
Или красивая статья с различными текстами, картинками, смайликами и т. Д., На которую вы попадете, нажав на интерактивный текст под каким-либо постом.
Как сделать вики ( wiki ) — страницу ВКонтакте в паблике или в группе.Метод №1Очень просто! Введите ссылку в строке поиска браузера, например
вместо XXX — ставьте id номер вашего паблика или группы (только цифры). Вы можете узнать идентификационный номер своего паблика или группы, открыв любую фотографию и скопировав числа в адресной строке браузера после «фото-» и перед «_».
Вместо pagename — введите имя создаваемой вики-страницы (если несколько слов, то через нижнюю вспышку «_»). В нашем примере «PRESS_HERE».
Есть другой способ создать вики-страницу в ВК , более сложный, но, может быть, он вам больше понравится.
Как сделать вики ( wiki ) — страницу ВКонтакте в паблике или в группе. Способ №2.- Если вы хотите сделать вики-страницу для паблика, необходимо сначала создать группу (сообщество) во ВКонтакте. Только там можно создавать вики-страницы. А после этого готовую вики-страницу можно перенести на публичную страницу (публичную страницу).Создать группу очень просто:
А) в правом столбце выберите «Мои группы»;
Б) в открывшемся окне в правом верхнем углу нажимаем «создать сообщество»
C) напишите название будущей группы (на ваше усмотрение)
D) включить галочку (флажок) возле пункта «Группа»
Г) нажимаем «создать сообщество»
Если вам нужна вики-страница для группы ВКонтакте, то пропустите шаг №1.
2. Чтобы сделать вики (вики) — страницу, нужно открыть «материалы».Для этого зайдите в свою группу. В правом столбце под аватаром вашей группы нажмите надпись «Управление сообществом». В открывшемся окне найдите пункт «Материалы». Выберите «Открыть». Не забудьте сохранить изменения.
3. После этого на главной странице вашей группы под описанием появится надпись «Свежие новости», а рядом — «Редактировать». Здесь нам нужно щелкнуть.
4. Обратите внимание, если на главной странице группы вместо описания вы «закрепили пост», его нужно «открепить».Нажмите на сообщение (не на картинку! А именно по тексту сообщения, под картинкой нажмите «открепить»)
5. После того, как вы нажмете кнопку «изменить» рядом с надписью «Свежие новости», перед вами откроется вики-окно. В правом верхнем углу вы увидите кнопку с двумя галочками — это переключатель режимов редактирования. Новичку намного проще работать в режиме визуального редактирования, так как этот редактор частично похож на обычное слово. В режиме вики — разметка, нужно писать специальный код.
6. Переключатель режимов редактирования ставим в положение «Режим Wiki-разметки».
7. И пишем фразу, при нажатии на которую человек попадет на созданную нами вики-страницу. Но чтобы этот текст стал кликабельным, он должен быть заключен в двойные квадратные скобки (на клавиатуре в английской раскладке есть кнопки с русскими буквами «X» и «b»), например [[НАЖМИ ЗДЕСЬ]]. Нажмите «Сохранить страницу» внизу. А потом «Превью». Если вы все сделали правильно, то надпись, которую вы написали в квадратных скобках, появится под кнопкой «сохранить страницу» и будет кликабельной (станет ссылкой).То есть, если вы нажмете на нее, вы попадете на пустую страницу с заголовком «НАЖМИ ЗДЕСЬ». Если не получилось и под кнопкой «сохранить страницу» вы видите надпись в квадратных скобках, проверьте еще раз, в каком режиме у вас есть переключатель редактирования.
8. В адресной строке браузера мы видим ссылку на получившуюся вики-страницу следующего вида:
https://vk.com/pages?oid=-XXX & p = pagename
, где XXX — это идентификационный номер вашего паблика или группы (только номера).Вы можете узнать идентификационный номер своего паблика или группы, открыв любую фотографию и скопировав числа в адресной строке браузера после «фото-» и перед «_».
pagename — название вики-страницы (если несколько слов, то через нижнюю вспышку «_»). В нашем примере «PRESS_HERE».
- После замены идентификатора нажмите «Заполнить содержимым».
- Вы снова попадаете в редактор вики. Если вы не эксперт, то заполните вики-страницу в режиме визуального редактирования.Здесь все просто. Вы можете добавлять и изменять любой текст по своему усмотрению. Вставьте фото, аудио или видео. Прикрепите любую ссылку к тексту или изображениям. Чтобы увидеть результат, нажмите «Предварительный просмотр». Ничего сложного.
Для оформления группы в социальной сети существует удобная и простая вики-разметка для группы ВКонтакте. Он действует аналогично html-коду, но более интуитивно понятен и понятен простому пользователю, владельцу группы. Эта разметка используется Википедией (бесплатной энциклопедией), отсюда и ее название.
С помощью разметки Wiki вы можете создать группу своеобразным или традиционным способом, при этом вам не придется погружаться в джунгли html, где вы можете застрять на несколько недель. Разметку вики настолько легко изучить, что она покорит даже самого неопытного пользователя всего за один час. Эта разметка также отлично справляется с форматированием изображений и текста, анкерами, спойлерами, ссылками, графическими таблицами и другими элементами, способными качественно изменить внешний вид любой группы.
Создать меню в контакте можно несколькими способами, и их выбор обусловлен направленностью и тематикой группы ВК.Для социальных и коммерческих групп пользователи предпочитают серьезные текстовые меню, а для развлечений — графические.
Wiki-разметка отлично подходит для работы с фотографиями или любыми изображениями, но с некоторыми хитростями. Изображение, вставленное с помощью вики-разметки, появится только в том случае, если оно присутствует в альбоме. Простыми манипуляциями фотография (например: photo55775_55775) сразу появится на странице. Для этого скопируйте его адрес и добавьте к нему двойные квадратные скобки.
Это выглядит так — [] — и эта разметка применяется к любому изображению в альбомах.После завершения разметки вы можете вставить и текст, и ссылку вместе с изображением, тем самым изменив его внешний вид.
Для этого вам необходимо использовать следующую вики-разметку — []. Слово «параметры» можно заменить другими значениями, каждое из которых изменит внешний вид фотографии. А значения следующие:
- noborder сделает рисунок без рамки;
- nopadding объединяет изображения, удаляя пробелы между ними;
- plain сделает ссылку из картинки;
- NNNpx позволит вам изменить размер изображения; Окно
- откроется в новом окне.
Работа с таблицами с использованием вики-разметки?
И меню с графикой, и меню с картинками невозможно без специальных таблиц. Выучив простой набор кодов и символов, вы научитесь быстро создавать таблицы для своей группы ВКонтакте. Вот как выглядят символы:
- (| без этого начального символа невозможно создать таблицу;
- | + необязательный символ, используемый для центрирования таблицы
- | — с этого символа начинается новая строка;
- | этот символ отвечает за прозрачность ячеек;
- ! с помощью этого символа можно сделать ячейку темного цвета;
- |) этот необязательный символ завершает таблицу.
Такое меню будет получено с помощью следующего очень простого кода:
{|
| —
|
| —
! [] !! [] !! []
| —
|
[[Новые онлайн игры | Новое]]
[[Головоломка]]
|
[[Воздушные шары]]
[[Квесты]]
[[Аркады]]
[[Обсуждения игры]]
| —
|}
Связывание с вики
— разметка ?В контакте вы можете использовать три типа ссылок для создания группы с вики-разметкой.
- Ссылка в виде картинки: []
Работаете с графическим меню?
Для его создания используется простой алгоритм действий. Но нужно хотя бы поверхностно знать работу Photoshop и изучить вики-разметку. Но графическое меню в развлекательной группе ВКонтакте выглядит очень привлекательно, а потому не пожалейте времени на его создание. Алгоритм следующий:
- Вырежьте нужную графику в редакторе и «сохраните для сети»;
- Загружайте графику как обычные картинки, без использования вспышки, чтобы не ухудшать их качество;
- Создайте меню с помощью специального тега nopadding;
- Внимательно запишите все ссылки;
- Красивое меню для вашей развлекательной группы готово.
Несколько секретов вики-разметки
Эта разметка не похожа на html-код, и некоторые из ее функций можно попробовать только экспериментально. Но если экспериментировать не ваше дело, изучите следующие функции, чтобы избежать ошибок и задаться вопросом, почему определенный элемент не подчиняется разметке вики. Уловки с разметкой:
- Допустимая ширина изображения не более 610 пикселей;
- При изменении ширины автоматически изменяется высота изображения;
- Снимки размером менее 134 пикселей меняют качество в худшую сторону;
- В строке разметки может присутствовать только 7 элементов списка;
- Более 18 незакрытых тегов на одной странице приведут к искажениям и ошибкам.
Приложения для программирования вики-разметки
Если разметка кажется вам слишком сложной, используйте простые приложения, которые сами авторы называют учебными пособиями. Это если вы хотите узнать секреты разметки. Если наука вам не дана, создавайте группы ВК с помощью простого визуального редактора, который сам пишет правильный код.
Редактировать статью в Википедии очень просто. Перейдите по ссылке «редактировать». Откроется страница редактирования; он имеет текстовую форму с исходным текстом статьи, которая содержит специальные символы — разметку «вики», описанную ниже.
Редактирование
Затем: внесите желаемые изменения в исходный текст; кратко опишите смысл вашей ревизии в строке «Описание изменений»; чтобы проверить правильность отображения страницы, нажмите кнопку «Предварительный просмотр»; если со страницей все в порядке, опубликуйте новую версию, нажав кнопку «Сохранить страницу».
Пишите с нейтральной точки зрения: избегайте предвзятости и чрезмерной эмоциональности; Предоставьте источники информации, чтобы помочь другим проверить и дополнить вашу работу.Ввилам: Это несложно и очень полезно.
Дополнительные возможности
Над формой редактирования текста расположены кнопки форматирования текста, ниже — панель для быстрой вставки специальных символов, элементов разметки вики и шаблонов. Кнопка «Внесены изменения» позволяет сравнить исходный код с тем, что у вас есть в окне редактирования. Зарегистрированные участники также имеют доступ к: флажку «Небольшое изменение», который позволяет пометить ваши изменения как незначительные; Установите флажок «Добавить эту страницу в список просмотра», чтобы следить за дальнейшими изменениями в этой статье.Часто бывает удобно сначала скопировать текст в текстовый редактор (через буфер обмена), отредактировать его, а затем перенести обратно в форму редактирования в браузере. Для этих целей следует использовать текстовый редактор, поддерживающий Unicode. Кроме того, вы можете обсуждать статьи с другими участниками. Почти каждая статья в Википедии имеет параллельную страницу обсуждения. Участники просто редактируют эту страницу, как и статьи: перейдите на страницу «обсуждение» и нажмите там «изменить». Обсуждения, опять же, должны проходить по правилам; главное избежать резкости и подписаться (четыре тильды ниски 14:39, 14.06.2007 (MSD) в коде страницы).
Разметка вики
Ниже приведена справочная таблица для редактирования в Википедии.
Разделы, абзацы, списки и строкиНачните раздел со строки заголовка:
Новый раздел == === Подраздел === ==== Подраздел ====
Перенос одной строки не влияет на разметку. Его можно использовать для разделения предложений в один абзац. Некоторые редакторы считают, что это упрощает редактирование и улучшает функцию сравнения версий.
Но пустая строка начинает новый абзац.
С помощью тега «br» вы можете разбивать строки, не начиная новый абзац.
Легко составить список
- каждая строка начинается со звездочки;
- чем больше звездочек, тем глубже уровень; отступ внутри можно сделать с помощью двоеточия
Нумерованные списки тоже хороши:
- Нумерованные списки тоже хороши:
- очень организованы;
- легко читается
Вы также можете составлять смешанные списки:
- Также можно составлять смешанные списки:
- и инвестировать в них
- здесь.
Точка с запятой в начале строки, за которой следует двоеточие, создает двухуровневый список.
Двоеточие в начале строки служит отступом для абзаца.
Простой разрыв строки начинает новый абзац.
Примечание. В основном это относится к страницам обсуждения.
Если строка начинается с пробела, она будет отформатирована так же, как и при вводе; шрифт фиксированной ширины; без разрывов строк.Это можно использовать для:
* вставки предварительно отформатированного текста; * описания алгоритмов; * исходный код программ * ascii art (создание изображений с помощью текстовых символов).
Текст по центру.
Текст по центру.Горизонтальная разделительная линия: четыре штриха подряд (—-)
Вы можете контролировать выравнивание текста абзаца с помощью тега
С параметром align, со значением центра для выравнивания по центру, выравниванием для выравнивания по ширине, по левому краю для выравнивания по левому краю, справа для выравнивания по правому краю.
По умолчанию допускается выравнивание по левому краю.
Например, для выравнивания по ширине используйте эту конструкцию:
Текст абзаца
Ссылки, URLВ Лондоне хороший общественный транспорт. Первая буква пункта назначения автоматически становится заглавной. Внутренние пробелы автоматически отображаются как символы подчеркивания (символы подчеркивания имеют тот же эффект, что и пробелы, но не рекомендуется).
Таким образом, ссылка выше ведет на http: //ru.wikipedia.org / wiki / Public_Transport, статья под названием «Общественный транспорт».
Внимание: если регистр референтного слова или фразы не совпадает с именительным падежом, то в двойных квадратных скобках следует поставить вертикальную черту и слева от нее написать именительный падеж, а справа — соответствующий к грамматике предложения, в которое вставлена ссылка.
Пример: В Лондоне налажено хорошее сообщение общественного транспорта.
В Лондоне хорошие [[общественный транспорт]].В Лондоне хороший [[общественный транспорт | общественным транспортом]].
Окончания объединены со ссылкой: тестирование, гены
Автоматически скрывает то, что указано в скобках: королевство.
Пространство имен автоматически скрывается: Портал сообщества.
Заключенное в круглые скобки автоматически скрывается: [[королевство (биология) |]]. Пространство имен автоматически скрывается: [[Wikipedia: Community Portal |]].
Вы можете сослаться на подраздел в самой статье, указав его после «решетки»: Ссылка.
Вы можете сослаться на подраздел в самой статье, поместив его после хеша: [[Wikipedia: Rules and Guidelines # Link | Ссылка]].
Добавляя комментарии на страницу обсуждения, подпишите их. Это можно сделать, добавив три тильды, чтобы получить имя пользователя:
нискаили четыре, чтобы получить имя пользователя плюс дату / время:
ниска, 14:39, 14 июня 2007 г. (MSD)Это вариант с датой и временем, является предпочтительным.
Добавляя комментарии на страницу обсуждения, вы должны их подписать.Это можно сделать, добавив три тильды, чтобы получить имя пользователя :: ~~~, или четыре, чтобы получить имя пользователя плюс дату / время :: ~~~~ Дата и время являются предпочтительными. Внешняя ссылка :, для ссылок не на русском желательно указать язык: ((ref-en))
Или просто введите URL: http://www.nupedia.com.
Этот адрес только для примера, не используйте его.
Вы можете указать адрес электронной почты следующим образом:
[[Media: Sg_mrob.ogg | Звук]] [[Медиа: Tornado.jpg | Изображение торнадо]]
ISBN 0123456789X
Форматирование текста
Жирный шрифт и курсив используются в следующих случаях: логический акцент, структурный акцент, логический акцент в структурном акценте (или наоборот) логический акцент
структурное выделение
логический акцент в структурном акценте (или наоборот) .
- Это двойные и тройные апострофы, а не кавычки.
«» «структурированный выбор» «»
«» «» «логическое ударение в структурном акценте (или наоборот)» «» «».
Вы также можете писать курсивом и полужирным шрифтом, если вас интересует определенный стиль шрифта, а не логический акцент, например, в математических формулах: F = ma
: F = м aМоноширинный шрифт технических терминов
технические понятия
Специальное форматирование фрагментов исходного кода
исходный код
Вы можете использовать мелкий текст для заголовков мелкий текст для заголовков
мелкий текст >
Вы можете зачеркнуть удаленный материал и подчеркнуть новый материал, зачеркнуть удаленный материал и выделить новый материал
зачеркнуть удаленный материал и выделить новый материал
.