Делаем меню с кнопками в Вконтакте.

Готовим картинки кнопок в любом графическом редакторе. Сначала в виде одной картинки шириной 600px. Затем разрезаем на части вдоль, по числу кнопок.

Переходим в группу. Это должна быть группа (сообщество) не страница!. Если у вас страница, жмите в меню управления “перевести в группу“.

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

[[photo3438235_45623719|400x100px;noborder| ]][[photo34387335_456243720|400x100px;noborder| ]][[photo34387335_456243721|400x100px;noborder| ]][[photo34387235_56243722|400x100px;noborder| ]]

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

[[photo3438235_45623719|400x100px;noborder| ]]  – это отображение одной картинки. Нам нужно код каждой картинки изменить так:

[[photo3438235_45623719|500px;nopadding;noborder|кнопка]]

Т.е. то что было синим, заменить красным.  Обратите внимание на пробел в конце синей строки, в “красном” его нет. Меняем это в каждом коде картинки.   Сделали – ОБЯЗАТЕЛЬНО нажимаем “сохранить страницу”.

Идем снова на главную страницу группы и  видим пункт “мею группы” – нажимаем, любуемся кнопками меню. Они должны быть без пробелов (щелей между отдельными картинками). Если все хорошо, то идем дальше, если не так – то значит где то стоят в коде лишние пробелы(их не должно быть!)  или вкралась какая либо ошибка. Проверяем заново.

Пока у нас каждая кнопка меню ведет на свою картинку кнопки. Делаем так чтобы нужны кнопки вели каждая на свои страницы\картинки и тп. За это отвечает параметр в коде, в данный момент “слово “кнопка”:  кнопка –  пока это указание “в никуда”. Чтобы сделать переход по нажатию кнопки, нужно заменить это слово на свою нужную ссылку. Заготавливаем какие то свои посты или фото , на которые будут вести нажатия кнопок. Затем редактируем меню и перебиваем “кнопка” ссылками на картинки кнопок, например:

[[photo3438235_45623719|500px;nopadding;noborder|https://ydalenka.ru/?p=3349]]

красным выделена ссылка, в данном случае на страницу сайта https://ydalenka.ru .

  1. 5
  2. 4
  3. 3
  4. 2
  5. 1
(1 голос, в среднем: 5 из 5)

Комментарии:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *