Як зробити меню в групі в контакті? Рецепт готового графічного меню для групи вконтакте скачати

1. Огляд різних меню груп в контакті
2. Які цілі переслідує створення меню в VK?
3. Малюємо графічне меню для групи вконтакте в Photoshop
4. Технічна реалізація меню для групи в vk.com

Наша команда-партнер Artmisto

Привіт всім читачам блогу JonyIT ! МИ раді вітати вас в черговому випуску серії статей «VK - перезавантаження» в якій сьогодні поговоримо про те як зробити меню в групі в контакті ". Хто ми? Ой, забув представитися. Мене звуть Костянтин Белан і сьогоднішній пост для вас пишу я, ну і звичайно Антон допомагає мені трохи, так би мовити наставляє на шлях істинний.)

Скажу відразу створення і оформлення меню для груп вконтакте, це не таке вже й складна справа головне знати послідовність дій, на чому сьогодні ми і загострити увагу. Насамперед розберемо, яку інформацію має нести в собі меню, яка мова розмітки тексту використовувати і як це все реалізувати в технічному плані.

У соціальній мережі Вконтакте багато, навіть дуже багато груп (як створити групу, Антон писав тут ), І всі вони мають різний посил, і різне оформлення. тому у всіх своя фантазія і свої інтереси. Але, мало хто здогадується, що в меню міститься її прихований сенс ...

Як я вже говорив група, як і публічна сторінка в соціальній мережі є філією вашого бізнесу в Інтернеті, а філія повинна виглядати не гірше свого головного офісу. Це ставитися і до того, що якщо ви маєте добротний сайт в інтернеті, то і ваша група не повинна поступатися сайту нема на йоту.

Огляд різних меню груп в контакті

Перед тим як почати, щось створювати я хочу представити вам деякі меню груп, які, на мій погляд, вийшли не тільки дуже яскравими і привабливими, але і відбили суть діяльності стоїть за нею людьми це як раз те, що ми сьогодні і спробуємо реалізувати. І так поїхали ...

№ 1 Весільне агентство «La Perfecto»

Як ви розумієте це група представляє одне з весільних агентств в Санкт-Петербурзі, та дизайн меню незрівнянний, але нас він не цікавить, ми проводимо аналіз структури. Поговоривши з адміністратором групи, я з'ясував, що 20% своїх клієнтів вони отримують завдяки цій групі. Якщо ви плануєте пропонувати свої послуги, то я рекомендую вам запозичити структуру меню цього весільного агентства. І прошу вас не потрібно придумувати велосипед, він уже придуманий.

Так само я раджу розмістити номер телефону і виділити його, а так же відобразити вік вашої фірми, так як він завжди збільшує довіру клієнта перед покупкою.

№ 2 Громадська організація «Екострана»

Ще одна грамотно оформлена група, яка вже не ставитися до якоїсь комерційної тематики це група громадської організації «Екострана». Відповідно до опису організація бореться за збереження природи, якими способами я чесно не знаю, але нас це і не цікавить =)

Пункти меню я вважаю не дуже чітко підібрані, так як першим посиланням повинна бути сторінка «Про нас», щоб потрапивши в групу, відвідувач насамперед міг познайомитися з тим, чим займаються ці люди і вступити в їхні ряди за бажанням =) А все інше я вважаю в порядку, фото, відео, статті та контакти, це те, що як раз і потрібно юному прихильникові ідей групи для вступу.

№ 3 Йога з Дариною Каширської

Ну і, нарешті, остання група по «Йоги» експертом виступає Дарина Каширська. Я сам час від часу займаюся «Хатха йогою» і тому включив такий приклад. Зверніть увагу не на чергову дизайн, а на які сторінки хоче заманити автор своїх відвідувачів.

• Розклад
• Інформація про викладачі
• Новини
• описи занять
• семінари
• Індивідуальні заняття

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

Які цілі переслідує створення меню в VK?

Філософствувати на цю тему можна дуже довго, але як я вже говорив в меню для групи вконтакте повинна міститися заснована інформація, в якій відвідувач знайде відповіді на всі свої питання і замовить послугу або купить ваш інфо-продукт взагалі не важливо, що це буде.

Що я маю на увазі під основною інформацією? Ну, звичайно ж, це ваш прайс - лист товарів або послуг, контактні дані телефон або email, питання - відповіді і все це ви закріплюєте відгуками про товар.

Меню, звичайно, може служити і для інших цілей все залежить від тематики групи, але в основному групи створюють комерційної спрямованості.

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

Нікому не секрет, що соціальні мережі зараз дуже широко використовуються для просування сайтів. Наприклад, на блоги ставлять кнопки соціальних мереж для того, щоб підвищити число відвідувачів, і підняти статтю вище в пошукових системах. Так само можна поставити WordPress коментарі від Вконтакте , Це послужить збільшенню кількості коментарів, а так само поведінкових факторів .

Малюємо графічне меню для групи вконтакте в Photoshop

Створювати меню ми будемо за допомогою Photoshop'а. Практично всі володіють початковими навичками цього графічного редактора, так що я думаю, проблем не у кого не виникне

Так ось заходимо в Photoshop. Якщо у Вас, його немає, завантажуєте і встановлюєте.

Крок 1. - Створюємо новий документ, розмірами приблизно: 400 × 500 (висота буде залежати від кількості пунктів меню).

Якщо ви вмієте малювати, то можете попередньо намалювати ескіз на тетрадном аркуші, але так як цього робити я не вмію, то візьму простенький шаблон, який в подальшому і перетворю в меню. На жаль «Рєпін» з мене ніякий)

Шаблонів в Інтернеті вагон, та не те що шаблонів, а зображень на яких можна просто написати текст і перетворити його в навігаційне меню в vk. Можна зробити, який-небудь телевізор з написами, стільниковий телефон з написами, плакат з написами, та що завгодно, головне щоб з написами 🙂 Я наприклад вибрав зображення плазмового телевізора на який завдам текст і в майбутньому за допомогою wiki розмітки зроблю з нього Гіперпосилання .

Крок 2. - Беремо той самий телевізор і Photoshop'e прописуємо невелике меню, яке складається з рубрик та пари сторінок мого блогу.

Я вже говорив що не "Рєпін», тому в даному уроці обійдуся таким ось аскетичним меню, але вам я пропоную не зупинятися на досягнутому і домалювати що-небудь ще цікавеньке, ну а якщо у вас інший шаблон, то це сам бог велів зробити. )

Далі нам необхідний розрізати зображення по частинах. Для чого? - запитаєте ви. Для того, щоб зробити частини зображень з текстом, активними посиланнями.

Крок 3. - Вибираємо інструмент «Раскройка», для цього натискаємо C, і вибираємо з меню «Раскройка». Переклади меню можуть відрізнятися від вашої версії фотошопа, тому орієнтуйтеся на іконки в меню.

Включимо лінійку натисканням комбінації клавіш «CTR + R» за допомогою нею вам буде легше орієнтуватися при розрізанні зображення. Як розрізати? Та не можу, але якщо в технічному плані, то це потрібно робити як то так ...

Для цього підносимо миша до верхньої лінійці і відтягує її до того моменту, від куди починаються частини зображень з посиланнями. Потім так само відтягаємо до того моменту, де закінчується перше зображення з посиланням. І так, повторюємо поки не виділимо всі зображення, на яких буде посилання. В результаті у нас повинно вийти наступне диво:

Тепер потрібно створити фрагменти по напрямних. Не буду говорити, що це, тому що у нас не урок роботи в Фотошопі. І наше завдання лише навчитися створювати меню в контакті. Ну ладно, щось я трохи відволікся.

- Для створення фрагментів по напрямних, потрібно натиснути на спеціальну кнопку в області параметрів, яка називається «Фрагменти по напрямних»

Ух ти, у нас все чудово виходить. Що ж робити тепер? А тепер, зберігаємо частини зображення окремо. Для цього натискаємо Файл -> Зберегти для Web і пристроїв ...

Крок 5. - Далі вводимо назву файлу, вибираємо формат JPEG, якість ставимо найкраще і ставимо галочки навпроти Прогресивний і Вбудований профіль. Натискаємо зберегти і ура, зображення розділене на кілька частин.

Тепер наше завдання, завантажити ці зображення Вконтакт і зробити з них - Меню!

Технічна реалізація меню для групи в vk.com

Тепер, після того як готове зображення меню, можна приступати до адаптації його Вконтакт. Для цього переходимо в групу, в якій будете створювати меню і натискаємо кнопку «редагувати» біля заголовка свіжі новини.

Після цього перейменовуємо заголовок, як Вам потрібно, наприклад: Меню, Свежак тут або Найцікавіше тут.

Тепер починаємо адаптацію зображення в меню. Для цього використовуємо спеціальну розмітку тексту, придуману розробниками вконтакте, яка називається wiki-розмітка. Ця мова розмітки тексту з кожним днем ​​стає все більше і більше так як розробники постійно його вдосконалює. Якщо web майстру для створення сайтів необхідно знати HTML, то SMM фахівця на сьогоднішній день необхідно знати мову WIKI. Але повернемося до справи ...

Зараз я приведу найголовніше, що нам буде потрібно. А решта можете прочитати на спец. сторінці Вконтакте про wiki- тут .

Те, що лікар прописав:

[[photo *** _ *** | Опис]] за допомогою даного коду, будемо розміщувати зображення в меню

[[photo *** _ *** | httр: //ссилка.соm/]] за допомогою даного коду, будемо розміщувати посилання на сайт у вигляді зображення

[[photo *** _ *** | id ***]] за допомогою даного коду, будемо розміщувати посилання на сторінку профілю у вигляді зображення

[[photo *** _ *** | club ***]] за допомогою даного коду, будемо розміщувати посилання на групу вконтакте у вигляді зображення

[[photo *** _ *** | page *** _ ***]] за допомогою даного коду, будемо розміщувати посилання на вікі сторінку у вигляді зображення
[[photo *** _ *** | nolink | Опис]] даний код ми будемо використовувати, якщо нам потрібно вставити не клікабельно зображення. тобто щоб при натискання на нього, нічого не відбувалося.
[[Photo *** _ *** | 400x105px; noborder | ]] Так ми будемо міняти розміри зображень в меню, тобто замість 400 × 105 вписуєте свої розміри. А код noborder використовується, щоб в зображенні не було рамки навколо нього.

В принципі це все, що нам стане в нагоді. Тільки залишилося найголовніше! Після завантаження зображень на сервер Вконтакте, після установки їх в меню, ми бачимо відступи (прогалини) між ними! А нам же потрібно повноцінне меню, як ми планували. Для цього існує спеціальний код в вікі-розмітці, це - nopadding:

[[Photo *** _ *** | 400x105px; nopadding | ]]

Зараз збираємо потрібні коди, написані вище, для нашого меню і отримуємо щось на кшталт:

[[Photo35930750_292124836 | 380x130px; noborder; nolink; nopadding | ]]

[[Photo35930750_292124840 | 380x26px; noborder; nopadding | http: //ссилка.ru]]

[[Photo35930750_292124841 | 380x20px; noborder; nopadding | http: //ссилка.ru/creation-of-sites]]

[[Photo35930750_292124843 | 380x24px; noborder; nopadding | http: //ссилка.ru/raskrutka-sajta-bloga]]

[[Photo35930750_292124846 | 380x28px; noborder; nopadding | http: //ссилка.ru/earnings-on-the-site]]

[[Photo35930750_292124848 | 380x26px; noborder; nopadding | http: //ссилка.ru/konkursy]]

[[Photo35930750_292124849 | 380x25px; noborder; nopadding | http: //ссилка.ru/obo-mne]]

[[Photo35930750_292124851 | 380x96px; noborder; nolink; nopadding | ]]

В даному повноцінному коді, ми написали, що меню складається з 8 частин, 6 з яких мають активне посилання. Всі зображення мають ширину 380, а висоту різну. Абсолютно всі зображення без рамок, і зайвих пробілів!

УРА ура УРА! Ми це зробили. Давайте ж подивимося що вийшло?

Ну як вам? Звичайно, може бути і краще, але мені і так подобається :) Адже головне для мене було дати вам знання, навчити робити таке меню без допомоги фахівця. Адже, правда ж, навіщо платити гроші комусь, якщо можна зробити самому, і за кілька хвилин?

Я сам зовсім недавно почав вивчати галузь SMO і SMM, тому потрібно було створити групу і зробити гарне меню. Зараз же у мене кілька груп, і я хотів би показати одну з моїх кращих робіт по виконанню меню:

Так що, якщо потрібно меню для групи, можете звернути до мене в форму зворотного зв'язку тут.

На цьому у мене все. Дякую всім, і до зустрічі! І запам'ятайте: Головне пробувати, і все вийде.

З повагою, Белан Костянтин!
----------

Ось такий от сьогодні був пізнавальний урок і я сподіваюся більше початківці smm фахівці більше не будуть мені задавати питання типу як зробити меню в групі в контакті, ну а якщо і будуть, то у мене на блозі тепер є повноцінну відповідь =) На цьому все. Не забуваємо підписуватися на оновлення блогу .

Хвилиночку уваги друзі!

Я зі своєю командою займаюся грамотним оформленням груп та паблік вконтакте. Ми малюємо запаморочливий дизайн меню і робимо класні аватарки. Приклади наших роботи ви можете подивитися на сторінці « послуги ».

Замовити у нас дизайн для вашої групи можна написавши мені в вк https://vk.com/jonyit або на пошту сюди: [email protected]