Как добавить бейдж LinkedIn на сайт

Что такое бейдж профиля LinkedIn

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

Определение: бейдж — это фрагмент HTML/JavaScript, который вы вставляете на страницу; он отображает данные с публичной страницы вашего профиля.

Важно: бейдж не даёт сторонним сайтам доступ к закрытой части профиля и не заменяет управление приватностью в настройках LinkedIn.

Быстрый план действий

Войти в LinkedIn и открыть вашу публичную страницу профиля.
Нажать «Create a badge» (Создать бейдж) в настройках публичного профиля.
Скопировать предложенный скрипт (Copy code).
Вставить скрипт в HTML или в текстовый блок вашего сайта, выбрать размер/тему бейджа.

Как скопировать код бейджа профиля LinkedIn

Откройте LinkedIn и войдите в аккаунт.
Нажмите на своё имя в левой панели или кнопку «Me», затем «View Profile».
В правой панели нажмите «Edit public profile & URL».
В открывшемся окне прокрутите правую панель вниз и нажмите «Create a badge» под разделом «Public Profile badge».
На странице конструктора вы увидите скрипт/фрагмент кода. Нажмите «Copy code», чтобы скопировать его в буфер обмена.

Примечание: если вы забыли пароль LinkedIn, используйте стандартную процедуру восстановления пароля перед выполнением шагов.

Как вставить код в редактор сайта (пример — WordPress + Elementor)

Ниже — подробная инструкция для WordPress; принципы одинаковы для других CMS и конструкторов сайтов.

Войдите в админ-панель WordPress.
В левой панели наведите на «Страницы» и выберите «Все страницы».
Наведите на страницу «Главная» и выберите «Редактировать с Elementor» или «Редактировать».
Внутри Elementor кликните по месту, где хотите показать бейдж. Убедитесь, что элемент находится в текстовом редакторе (Text Editor).
В панели редактора откройте вкладку «Текст» (не визуальный режим). Нажмите Enter, чтобы опустить курсор на новую строку, и вставьте код, скопированный из LinkedIn.
Вернитесь в конструктор публичного профиля на LinkedIn и выберите тему (светлая/тёмная) и размер бейджа (Small, Medium, Large, Extra Large). Нажмите «Copy code» для выбранного варианта.
Вставьте второй код рядом с первым (если вы добавляете несколько вариантов) или замените предыдущий код.
Сохраните страницу и проверьте на фронтенде: бейдж с вашим именем и кнопкой «View Profile» должен появиться.

Важно: ссылка «View Profile» переводит посетителя на публичную версию вашего LinkedIn-профиля.

Альтернативные способы размещения бейджа

Плагин для CMS: установите плагин LinkedIn badge или универсальный HTML-виджет, если не хотите вставлять код вручную.
Кнопка-ссылка: используйте простую ссылку на публичный профиль с изображением (png/svg) вместо скрипта.
iframe (менее предпочтительно): можно обернуть страницу LinkedIn в iframe, но это ограничено политиками и часто блокируется.

Плюсы каждого способа:

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

Когда бейдж не работает и как это исправить

Ничего не отображается: проверьте, вставлен ли код в текстовый/HTML режим, а не в визуальный редактор.
Бейдж отображается некорректно: конфликт стилей темы — попробуйте разместить код в отдельном HTML-блоке или использовать плагин.
Скрипт блокируется: некоторые системы безопасности (Content Security Policy, CSP) или плагины кэширования могут блокировать внешний JavaScript. Отключите временно защиту или добавьте исключение для domains.linkedin.com.
Медленная загрузка страницы: отложите загрузку внешнего скрипта, поместите бейдж в нижнюю часть страницы или используйте гостевой вид (статическое изображение).

Критерии приёмки

Бейдж видим на странице без ошибок консоли.
Кнопка «View Profile» открывает публичную страницу профиля в новой вкладке.
Бейдж адаптивен и корректно отображается на мобильных устройствах.

Безопасность и приватность

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

Примечание: не вставляйте бейджы других людей без их согласия.

Лучшие практики размещения

Разместите бейдж в видимом, но ненавязчивом месте: боковая панель, нижняя часть «Обо мне» или раздел «Контакты».
Подберите тему (светлая/тёмная), чтобы бейдж гармонировал с дизайном сайта.
По возможности используйте один бейдж на страницу, чтобы не перегружать интерфейс.
Обновляйте публичный URL профиля (например: linkedin.com/in/ваше-имя) и убедитесь, что бейдж ссылается на правильный адрес.

Роль‑ориентированные чеклисты

Для соискателя вакансии:

Бейдж на странице «Резюме» или «Обо мне».
Публичный URL персонализирован.
Кнопка открывает профиль в новой вкладке.

Для фрилансера/предпринимателя:

Бейдж рядом с контактными данными.
Соответствие визуальному стилю бренда.
Тест на мобильных устройствах.

Для HR/рекрутинга:

Бейдж у сотрудников в разделе команды.
Проверка соответствия профилей корпоративным политикам.

Короткая методология внедрения (SOP)

Создать публичный бейдж в настройках LinkedIn.
Копировать код и выбрать тему/размер.
Вставить код в HTML/текстовый блок сайта.
Тестировать на рабочем столе и мобильных устройствах.
Задокументировать местоположение бейджа в CMS и в политике конфиденциальности.

Примеры, когда бейдж не нужен или лучше не ставить

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

Решение проблем — план действий

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

Ментальные модели и советы по приоритетам

Цель = доверие. Если бейдж повышает доверие посетителей — он полезен.
Простота > автоматизация: если автоматический бейдж ломает страницу, лучше простая ссылка.
Видимость > количественные показатели: бейдж помогает узнаваемости, но не заменяет активность в LinkedIn.

Decision flowchart

flowchart TD
  A[Нужен ли бейдж на странице?] --> B{Публичная страница сайта}
  B -- Да --> C{Профиль в LinkedIn готов?}
  B -- Нет --> Z[Не добавлять бейдж]
  C -- Да --> D[Создать бейдж в LinkedIn]
  C -- Нет --> Y[Сначала обновить профиль]
  D --> E{Использовать CMS с виджетом?}
  E -- Да --> F[Установить плагин или HTML-виджет]
  E -- Нет --> G[Вставить код вручную в HTML/TEXT]
  F --> H[Протестировать на мобильных устройствах]
  G --> H
  H --> I[Проверка и публикация]

Социальные превью и анонс для сайта

OG title: Как добавить бейдж профиля LinkedIn на сайт OG описание: Быстрая инструкция по созданию и вставке бейджа LinkedIn на сайт, блог или резюме — шаги, советы и устранение проблем.

Короткий анонс (100–200 слов): Добавьте на сайт интерактивный бейдж профиля LinkedIn, чтобы посетители могли быстро перейти к вашему профессиональному профилю. Создание бейджа занимает пару минут: скопируйте код в настройках публичного профиля LinkedIn и вставьте его в HTML или текстовый блок сайта. В статье описаны шаги для WordPress/Elementor, альтернативные методы, рекомендации по безопасности и проверке на мобильных устройствах.

Краткое руководство по тестам и критериям приёмки

Тесты:

Откройте страницу в трёх браузерах и на двух мобильных устройствах.
Проверьте, что кнопка «View Profile» открывает публичную страницу.
Убедитесь, что на странице нет ошибок в консоли, связанных с LinkedIn скриптами.

Критерии приёмки:

Бейдж корректно видим и адаптивен.
Нет конфликтов стилевых правил, разрушающих макет.
Время загрузки страницы остаётся в приемлемых пределах.

Заключение

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

Итоговые рекомендации: