Большинство о страницах, сайтах агентств и сервисных предприятиях нуждаются в месте, которое ставит лицо людям, стоящим за работой. The Виджет "Член команды" в Мастер-аддоны для Elementor строит этот раздел без пользовательского кода. на каждой карте есть фотография, имя, роль, короткая биография и ряд социальных ссылок, и вы заходите в нужное вам количество участников.
Каждый Член команды является своим собственным виджетом. поэтому вы настраиваете одну карту, стилизуете ее, затем дублируете ее по столбцам, чтобы построить полную сетку. нет ограничения на то, сколько участников вы показываете. это руководство проходит через каждую настройку, от вариантов дизайна (6 бесплатно, еще 5 с Pro) до вкладки Стиль.
Что делает виджет Участник команды #
Виджет отображает в виде карты одного члена команды: фото сверху, затем имя, обозначение и краткое описание, с рядом социальных значков внизу. А Вариации дизайна раскрывающийся список меняет весь макет карты в один клик, от простого блока до круговых фотографий и эффектов зависания. шесть вариантов бесплатны, и пять нуждаются в Master Addons Pro.
Он имеет три вкладки. Содержание содержит фотографию, текст, выравнивание и социальные ссылки. Стиль управляет цветами, типографикой, интервалом, границами и тенями для каждой части карты. Продвинутый имеет обычные параметры Elementor, такие как запас, заполнение и отзывчивая видимость.
Прежде чем начать #
- WordPress с Элементор установлен и активен.
- Мастер-аддоны для Elementor установлен и активен. Новое в плагине? Видеть руководство установки.
- Фотографии членов вашей команды, а также их имена, роли и URL-адреса социальных профилей.
Как добавить виджет Участник команды #
В редакторе Elementor откройте Элементы панель и поиск Член команды, или прокрутить в раздел Главные дополнения (виджеты несут фиолетовый значок МА). перетащите его на вашу страницу. он загружается с картой заполнителя, поэтому вы редактируете из рабочего примера вместо пустого.
Настройте содержимое карты #
Выбрав виджет, откройте его Содержание вкладка. Содержание в разделе хранится все на карте:
- Вариации дизайна: предустановка макета карты (охвачена в следующем разделе).
- Изображение: фото участника, вытащенное из Медиатеки.
- Разрешение изображения: какой зарегистрированный размер изображения для загрузки, по умолчанию полный.
- Имя, обозначение, описание: имя участника, роль и краткая биография. В каждом поле есть Пишите с помощью ИИ вариант, если вам нужен быстрый черновик.
- Выравнивание контента: выровняйте текст влево, в центре или вправо.
Выберите фото #
Нажмите на поле изображения и WordPress Медиа Библиотека открывается. Выберите существующую фотографию или загрузите новую, затем нажмите "Выбрать". Одна вещь, которую стоит сделать заранее: используйте фотографии одного размера. Соответствующие размеры сохраняют каждую карту даже после того, как вы создадите сетку, а несоответствующие имеют тенденцию сдвигать текст вниз на одной или двух картах.
Выберите вариант дизайна #
The Вариации дизайна выпадающий - это место, где виджет Участник команды зарабатывает свое удержание Один клик меняет местами всю макет карты, не касаясь вашего содержимого Список включает (Вариации Pro отмечены):
- От базового от одного до базового пяти (бесплатно): чистые макеты блоков с фотографией сверху и деталями ниже.
- Градиент круга и отсутствие градиента круга (Pro): круглое фото, с цветной формой за ним или на прозрачном фоне.
- Социальные левые на зависании и социальные правые на зависании (Pro): скрывайте социальные значки, пока кто-нибудь не наведет карту, а затем вставьте их.
- Округленный (бесплатно): арочная карта с круглой фотографией и закругленными социальными кнопками.
- Содержание на Hover (Pro): держите фотографию в чистоте и раскройте детали на зависании.
Вот Округленный применены вариации с арочной рамой, круглой фотографией и социальными значками в форме таблеток:
Добавить ссылки на социальные профили #
Открыть Социальные профили секция и включите Отображать социальные профили?. Каждая ссылка - это один элемент в списке, поэтому используйте Добавить элемент чтобы добавить профиль, выберите его значок и вставьте URL-адрес. Значок копирования дублирует элемент, и X удаляет его.
Добавить только профили, которые участник действительно использует, и удалить остальные. элемент без URL-адреса по-прежнему показывает свой значок. строка по умолчанию находится внизу карты и следует за любым выбранным вами вариантом дизайна.
Добавьте несколько членов команды #
Каждый виджет Участник команды - это одна карта, поэтому вы создаете полную команду, дублируя ее. Настройте первую карту так, как вы хотите, затем щелкните ее правой кнопкой мыши и выберите Дублировать (или нажмите Ctrl/Cmd + D).Бросьте копии в свои столбцы и поменяйтесь местами на фотографии и деталях каждого человека.
Поскольку вы дублируете виджет, нет ограничения Добавить три члена, дюжину или целый отдел. трехстолбчатый раздел Элементор дает вам чистый ряд карт, и вы добавляете больше строк по мере роста команды. каждая копия сохраняет вариацию дизайна и стиль оригинала, поэтому сетка остается последовательной без дополнительной работы.
Стиль карты #
The Стиль таб разбивает карту на части, которые вы можете стилизовать самостоятельно: Общие стили, Большой палец, Содержание, Имя, Обозначение, Описание, Социальныйи Шаблоны (из бесплатного расширения Patterns).
- Общие стили: цвет фона карты, радиус границы предмета и тень коробки.
- Большой палец: граница, радиус, набивка, а также поле снимка.
- Содержание: фон (цвет или градиент), граница, радиус, заполнение и поле для текстовой области.
- Имя, обозначение, описание: цвет, типографика, заполнение и поле для каждого текстового элемента.
- Социальный: размер, цвет и расстояние между социальными значками.
Обычные случаи использования #
- О страницах представляем всю команду с фотографиями и ролями.
- Сайты агентств и студий показ креативщиков с их социальными связями.
- Сервисные предприятия придание лица людям, выполняющим работу.
- Составы спикеров или инструкторов для мероприятий, вебинаров и курсов.
- Секции руководства или учредителей выделение ответственных лиц.
Советы по работе с виджетом Team Member #
- Сначала выведите одну карту, затем дублируйте. Копии наследуют дизайн и стиль, поэтому вы настраиваете их только один раз.
- Используйте фотографии одного размера. Соответствующие размеры сохраняют карты ровными по всему ряду.
- Держите биос коротким. Одна-две строчки лучше всего читаются под фотографией.
- Сопоставьте вариант со страницей. Бренды, дружелюбные к кругу и округлым костюмам; Основные макеты соответствуют корпоративным сайтам.
- Удалить социальные элементы, которые вы не используете. Пустой элемент по-прежнему показывает свой значок.
Часто задаваемые вопросы #
Что такое виджет "Член команды" в Master Addons?
Это виджет Elementor, который показывает одного члена команды в виде карты с фотографией, именем, ролью, короткой биографией, и социальными ссылками, Он включает 6 бесплатных вариантов дизайна (11 с Master Addons Pro) и полную вкладку Стиль, так что вы строите и стиль команды раздел прямо с панели Elementor без пользовательского кода.
Сколько членов команды я могу добавить?
Нет ограничения. каждый виджет Участник команды - это одна карта, поэтому вы добавляете больше участников, дублируя виджет и опуская копии в свои столбцы. Постройте строку из трех карт или большую многорядную сетку; макет остается последовательным, потому что копии наследуют дизайн оригинала.
Какие варианты дизайна включает виджет "Член команды"?
Одиннадцать предустановок. бесплатно: от базового от одного до базового пяти и округленного. Pro: градиент круга, градиент без круга, социальные левые на зависании, социальные права на зависании и контент на зависании. каждый меняет макет карты, например, круговые фотографии или социальные значки, которые появляются на зависании, без изменения вашего контента.
Могу ли я добавить ссылки в социальных сетях каждому члену команды?
Да. включите отображение социальных профилей в разделе "Социальные профили", затем используйте "Добавить элемент", чтобы добавить каждый профиль с его значком и URL-адресом. Добавляйте только ссылки, которые использует участник, поскольку элемент без URL-адреса по-прежнему показывает свой значок.
В чем разница между виджетами Team Member и Team Slider?
Виджет Член команды показывает членов как статическую сетку карт, по одному виджету на человека Виджет Ползунок команды помещает членов в скользящую карусель с ретранслятором, стрелками, и автоигра Использовать Член команды для фиксированной сетки и Ползунок команды, когда пространство тесно.
Завершая #
Виджет "Член команды" превращает список людей в отточенный раздел команды: добавьте фотографию, имя, роль, биографию и социальные ссылки, выберите одну из вариаций дизайна (6 бесплатно, 11 с Pro), затем создайте стиль карты и дублируйте ее по столбцам. См Страница виджета участника команды для демо-версий каждого варианта. для скользящей версии см. Виджет Team Slider, соедините это с Виджет информационного ящика для получения услуг просмотрите полную версию Виджеты и расширения Master Addgetsи проверьте страница ценообразования за то, что включает каждый план.
