Как сделать картинку в группе сверху
Урок 6. Как оформить внутренние страницы группы ВКонтакте картинками
Во втором уроке Оформление группы ВКонтакте мы с вами придумывали, о чем будут внутренние страница вашей группы, а в четвертом Как оформить меню в группе в ВКонтакте – создали их и приступили к наполнению содержанием.
Возможно, наполняя внутренние страницы информацией, вы столкнулись с необходимостью вставлять в них картинки. Сегодня мы подробнее остановимся на этом вопросе.
Немного теории
У людей, которые профессионально занимаются оформлением сайтов и страниц в ВКонтакте, есть свой сленг. Верхнюю часть страницы, которая одинакова для всего сайта и несет общую информацию, либо присутствует в декоративных целях, принято называть шапкой. Аналогичную часть внизу страницы – подвалом. В дальнейшем повествовании мы тоже будем употреблять эти термины.
Например, на страницах нашей группы vk.com/tibimi шапка добавлена для того, чтобы поддержать единый стиль оформления, а подвал дополнительно позволяет осуществить переход на страницу с меню (при нажатии на кнопку Назад):
Помимо шапки и подвала иллюстрации могут содержаться и по ходу текста. Например, на картинке, представленной в качестве примера выше, добавлено изображение нашего корпоративного героя – ТиБиМена.
Мы рекомендуем использовать картинки для оформления страниц группы ВКонтакте в двух случаях:
Как правильно подобрать картинки для страниц группы ВКонтакте:
Переходим к практике.
Шаг 1. Оформление шапки и подвала страницы ВКонтакте
Что такое шапка и подвал страницы, мы вам уже рассказали, а теперь разберемся, как их оформить картинками.
Картинки для оформления шапки и подвала страниц должны быть 600 пикселей в ширину и не менее 40 пикселей в высоту. В принципе, высота может быть любая, но мы не рекомендуем делать ее слишком большой (больше 200 пикселей), так как в этом случае страница будет смотреться некрасиво. Если вы плохо владеете графическими программами, то для того, чтобы создать такие картинки, рекомендуем снова посмотреть урок 3 Рисуем графическое меню в Photoshop, где мы показывали основы рисования в программе Photoshop.
У нас получились такие картинки:
Готовые картинки сохраните в формате PNG (аналогично тому, как мы сохраняли меню группы) и загрузите в Альбом для администратора, который мы создали в уроке 4 Как оформить меню в группе в ВКонтакте.
Чтобы вставить картинку в виде шапки или подвала страницы, нужно зайти в раздел редактирования страницы и самой верхней или, соответственно, самой нижней строчкой вставить код:
Если вы забыли, что такое уникальный номер картинки и где его взять, вы всегда можете вспомнить, заглянув в урок 4 Как оформить меню в группе в ВКонтакте.
Чтобы дополнить картинку подвала ссылкой на главную страницу группы (как это сделано в группе vk.com/tibimi и как мы хотим сделать в нашем примере), код должен быть таким:
Идентификатор группы – это тот адрес страницы, который присваивается группе при ее создании. Он состоит из слова club и цифр. Несмотря на то, что мы уже поменяли адрес страницы на свой, нам не составит труда его выяснить.
Если вы зайдете на страницу редактирования меню группы и внимательно взглянете на уникальные номера картинок и страниц, то увидите, что все они начинаются с одного и того же числового значения:
Идентификатор группы, как уже было сказано, состоит из слова club и этого числа (без пробелов). Например, в нашем случае это club59792224
В итоге код нашей страницы выглядит так:
Что в итоге получилось:
Данные действия необходимо повторить для всех страниц группы.
Шаг 2. Вставка картинок внутри текста в группе ВКонтакте
Чтобы вставить картинку по ходу текста вашей страницы, ее также нужно загрузить в Альбом для администратора. Затем, находясь в разделе редактирования страницы, нажать на кнопку добавления фотографии:
Затем выберите пункт Выбрать из фотографий сообщества
В открывшемся окне выберите фотографию, которую вы загрузили для добавления на страницу. В ваш код страницы в самом низу добавится строчка типа [[photo-59792224_314864670|294x400px;noborder| ]]
Скопируйте эту строчку в ту часть текста, где вы хотите видеть картинку. Сейчас ваша картинка будет расположена таким образом, что текст будет только сверху или снизу от нее. Чтобы текст обтекал картинку не только сверху и снизу, но и по боковой стороне, вам нужно вручную дописать после команды noborder через точку с запятой команду:
В нашем примере получилось так:
Мы видим, что картинка занимает слишком много места. Чтобы ее уменьшить, мы вручную можем задать необходимые нам размеры. Например, в нашем коде картинки: [[photo-59792224_314864670|294x400px;noborder;left| ]] указаны цифры 294x400px. Первая цифра – ширина изображения, вторая – высота изображения. Вообще для того, чтобы картинка приобрела определенный размер, достаточно указать только ширину, а высота будет рассчитана автоматически (пропорционально). Укажем ширину 200 пикселей. Тогда наш код картинки будет выглядеть так: [[photo-59792224_314864670|200px;noborder;left| ]]
При этом, если посетитель группы нажмете на картинку, картинка откроется для него в исходном размере.
Такой результат нас устраивает:
Примечание: мы не рекомендуем значительно (больше, чем в 2,5-3 раза) изменять размер изображения таким способом, т.к. в этом случае на изображении появятся искажения, пятна, точки и т.п. Уменьшите размер изображения на своем компьютере, а уже потом загружайте в альбом.
Если мы хотим, чтобы картинка находилась у правого края страницы, то мы заменяем слово left на right и получаем результат: [[photo-59792224_314864670|200px;noborder;right| ]]
Итак, надеемся, теперь вам понятно, как оформить свои страницы группы картинками. Если у вас остались вопросы, не стесняйтесь нам их задавать.
Домашнее задание: оформить внутренние страницы группы, добавив картинки в шапку и подвал страницы. Добавить хотя бы одну картинку по ходу текста любой страницы, выровнять ее сначала по левому, а потом по правому краю страницы, выбрать лучший вариант и сохранить его.
Как сделать живую обложку в группе ВК?
Живая обложка для групп и страниц Вконтакте, представляет из себя слайдер с 5 слайдами, в качестве которых можно использовать как фото, так и видео. Такая обложка не отображается в веб-версии. Её можно встретить, открыв страницу или группу в ВК с помощью смартфона. На мобилах, обложка отображается как шапка и при касании на нее, разворачивается на всю высоту. Ниже покажу, как сделать живую обложку в группе ВК, и расскажу, как это можно использовать.
Как создать живую обложку для страниц и групп Вконтакте?
Создать живую обложку для своего канала или группы в ВК, вы можете в разделе редактирования шапки. Для этого перейдите в раздел “Управление” в группе.
В пункте “Обложка сообщества”, нажмите “Добавить” или “Редактировать”.
Ниже главной обложки сообщества, вы увидите форму для создания живой обложки сообщества. Сюда можно добавить 5 слайдов из фото и видео, которые желательно должны иметь разрешение 1080×1920. Если вы загружаете видео, то оно должно длится не более 30 секунд и иметь не более 30 мегабайт веса.
Для чего можно применить живую обложку Вконтакте?
Многие бренды уже подхватили нововведение и разместили в качестве живой обложки своих групп, короткие видеоролики, посвященные бренду. А вот для чего еще можно использовть живую обложку в ВК:
Kak sdelat kartinku v gruppe vkontakte sverhu
КАК СДЕЛАТЬ ОБЛОЖКУ ДЛЯ ГРУППЫ ВКОНТАКТЕ? Подробнее
как сделать картинку в группе вконтакте сверху Подробнее
Как сделать живую Видео обложку Вконтакте? + Шаблон бесплатно! Подробнее
Как добавить обложку в группу или сообщество Вконтакте Подробнее
Как Поставить Живую Видео Обложку в Группу Вконтакте Подробнее
БАЗОВОЕ ОФОРМЛЕНИЕ ГРУППЫ ВКОНТАКТЕ | 2019/2020 | ГАЙД Подробнее
КАК СДЕЛАТЬ АНИМИРОВАННУЮ ШАПКУ ДЛЯ ГРУППЫ ВК Подробнее
Как создать обсуждение в группе вконтакте Подробнее
🌈 КАК СДЕЛАТЬ КРАСИВУЮ ШАПКУ ДЛЯ ГРУППЫ ВКОНТАКТЕ!? | Туториал 🌈 Подробнее
🔥 КАК СДЕЛАТЬ ОФИГЕННЫЙ БАННЕР ДЛЯ ГРУППЫ VK В PHOTOSHOP CS6! (Tutorial) Подробнее
Накрутка в Телеграме Бесплатно и Безопасно 2021 \ Накрутить Telegram Подписчики и Просмотры с ПК Подробнее
Как сделать обложку для группы в вк вконтакте Подробнее
Как Создать Обсуждения в Группе Вконтакте в 2018 Подробнее
Как добавить обложку группы ВК с телефона Подробнее
Как сделать живую обложку ВКонтакте + ШАБЛОН Подробнее
Лекция по тактике ведения современного боя. Часть 5 Подробнее
✔️Обложка для группы ВК. Как сделать? Какие размеры? Скачать готовые шаблоны Подробнее
🔥КАК СДЕЛАТЬ МЕНЮ В ГРУППЕ ВК НА ПК И АНДРОИД🔥КАК КРУТО НАСТРОИТЬ ГРУППУ ВК🔥 Подробнее
Как кастомизировать блок ссылок в сообществе в Вконтакте Подробнее
Как сделать ссылку из картинки Вконтакте
Здравствуйте, друзья! Мы с Вами уже рассматривали, как сделать ссылку словом Вконтакте, но если Вы хотите, чтобы пользователи обратили внимание на добавленную Вами публикацию, тогда давайте разбираться, как сделать ссылку из изображения или фотографии. Такая заметка с большей вероятностью привлечет внимание людей, соответственно, по ней кликнет больше пользователей.
Запись с ссылкой можно сделать отдельно в своем профиле, отдельно в группе. Если Вы хотите, можно добавить запись к себе на страницу, а потом поделиться ей с подписчиками своей группы, также можете отправить запись личным сообщением выбранному пользователю.
Давайте рассматривать все подробнее.
Делаем картинку ссылкой с помощью создания новой записи
Добавить урл с картинкой Вконтакте можно создав и опубликовав новую запись на своей странице или в группе. Расскажу, как это сделать в своем профиле.
Зайдите в свой аккаунт в вк и нажмите на поле «Что у Вас нового?».
Дальше откройте в браузере нужную страницу в Интернете и скопируйте из адресной строки урл.
Вернитесь на страницу Вконтакте и вставьте урл в пустое поле. Наведите курсор мышки на изображение и нажмите на появившийся значок фотоаппарата.
Откроется вот такое окошко. В нем нажмите на кнопку «Выбрать файл», чтобы добавить изображение. Обратите внимание, что его размер должен быть больше чем 537х240 px, иначе появится сообщение с предупреждением.
Через Проводник найдите нужную картинку на компьютере, выделите ее мышкой и нажмите «Открыть».
С помощью маркеров выберите область, которая будет использоваться, и нажмите «Сохранить изменения».
Удалите сам урл из поля для ввода текста, чтобы она не отображалась в записи. Нажмите «Отправить».
Выбранная картинка будет активной ссылкой, кликнув по которой, пользователь перейдет на указанный Вами сайт в Интернете. Опубликованную заметку увидят все Ваши друзья у себя в Новостях.
Если Вам нужно чтобы конкретный человек увидел сделанную Вами ссылку, или Вы хотите добавить эту картинку к себе в группу, тогда нажмите под записью на изображение громкоговорителя.
На вкладке «Поделиться» отметьте маркером подходящий вариант и нажмите «Поделиться записью».
Если выберите «Отправить личным сообщением», тогда нужно указать пользователей из своего списка друзей, кому оно будет отправлено. Можно выбрать одного или нескольких человек.
Если хотите добавить сделанную запись на стену в группу, отметьте маркером «Подписчики сообщества» и выберите свою группу из списка.
Вот так выглядит запись с картинкой-ссылкой, которой Вы поделились, на стене группы.
Делаем кликабельное изображение, используя стандартную ссылку
Сделать картинку кликабильной Вконтакте можно и немного другим способом. Для этого нам понадобится урл следующего вида:
https://vk.com/share.php?url=Ссылка&title=Заголовок&image=Ссылка на картинку&noparse=true&description=Описание
Ее нужно вставить в адресную строку браузера (как показано на картинке ниже), заменив слова «Ссылка», «Заголовок», «Ссылка на картинку», «Описание» своими данными.
Начнем со слова «Ссылка». Вместо него нужно вставить адрес сайта, на который будет ссылаться изображение.
Для примера, сошлюсь на поисковую страницу Яндекса. Открываю ее в браузере, копирую все из адресной строки и вставляю вместо слова «Ссылка».
Дальше идет «Заголовок». Это подпись, которая будет отображаться непосредственно возле картинки или под ней. Я так и напишу: Стартовая страница поиска Яндекс. Если хотите, можете сделать картинку без заголовка – удалите слово «Заголовок» и ничего вместо него не пишите.
Теперь заменим слово «Ссылка на картинку». Найдите нужное изображение в Интернете и скопируйте его адрес из адресной строки браузера. Вставьте скопированную строку в наш исходный урл вместо слов «Ссылка на картинку».
Если урл на картинку, которую Вы выбрали слишком длинный, можете сделать из него короткий. Об этом мы подробно писали в статье: как сделать короткую ссылку Вконтакте.
Слово «Описание» можете или заменить, добавив свой текст, или ничего не писать, как и в случае с заголовком. Я добавлю текст: Нажмите на картинку.
В результате, у меня получилась вот такая ссылка. Все замененные в ней слова, я выделила жирным:
https://vk.com/share.php?url=https://yandex.ua/&title=Стартовая страница поиска Яндекс&image=https://yandex.ua/images/search?text=яндекс&img_url=https%3A%2F%2Fchelovek-zakon.ru%2Fwp-content%2Fuploads%2F2016%2F04%2FDochka_yandeksa_v_SHvejtsarii.gif&pos=0&rpt=simage&noparse=true&description=Нажмите на картинку.
Вставляйте сделанный урл в адресную строку браузера и жмите «Enter». Откроется страница, как показано на скриншоте ниже. Здесь маркером нужно выбрать, как опубликовать запись: на своей странице, в своей группе, или отправить личным сообщением. После этого нажмите на кнопку «Отправить».
О том, что запись будет добавлена, свидетельствует следующее окно.
Моя запись появилась на стене моей странички. Давайте уберем заголовок, который дублируется два раза. Для этого нажмите в правом верхнем углу записи на три горизонтальные точки и выберите из выпадающего меню «Редактировать».
Дальше удалите весь текст из соответствующего поля, в моем случае это: Стартовая страница поиска Яндекс, и нажмите «Сохранить».
Вот такая запись с картинкой-ссылкой появилась на стене моей страницы Вконтакте. Кликнув по изображению со словом Яндекс, человек сможет попасть на соответствующую страницу поиска.
На этом все. Выбирайте способ, который Вам понравился больше, и делайте красивые фотографии, картинки или другие изображения ссылками в вк.