1575 Falling+social+icons Video Templates — Envato Elements
This video is currently unavailable
Социальные сети и сети — Анимация Иконки
От IconsX в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Падающие социальные Иконки — Логотип раскрыть
От dorde в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Social Media Icon Titles
От MYferret в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки социальных сетей
От vcgmotion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки социальных сетей
От alex_watson в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Интро Иконки социальных сетей
От kalinichev в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки социальных сетей
От ConceptCafe в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки медиа и социальных сетей
От CGStation в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пакет «Глянцевые социальные Иконки»
От HighWay_motion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
3D социальные Иконки пакет
От CandyMustache в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные Иконки Логотип Revealer
От MotionPhysix в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Переходы 3D-социальных Иконки
От Premiumilk в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Анимация иконок социальных сетей
От flikmotion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные медиа — анимационные Иконки
От DesignSells в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пакет социальных иконок
От botiordog в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пиксельные социальные Иконки и Титры
От EasySweetSauce в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Нарисованные Иконки социальных сетей
От shtopi в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки социальных сетей II
От Imocean в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пакет социальных иконок для Premiere Pro
От vladoskin в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Анимированные градиентные Иконки социальных сетей
От Aquavitae в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пакет Иконки социальных сетей || FCPX
От LikeThisMotion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки социальных сетей | Часть 2
От ProMotionSquad-1 в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные сети и медиа — анимационные Иконки
От IconsX в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Набор для Покадровая съемка социальных иконок
От px-bro в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные медиа Мультипальные иконки Интро
От AEbuddy в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Пакет 3D рождественских социальных Иконки
От rooan в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Анимированный Логотип и социальный значок
От AndBor в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Добавляет и Иконки линий социальных сетей Vol. 1
От lezygraph в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные медиа Человек Иконки Нижний Третий пакет
От VolkanKutlubay в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные медиа Летающие Иконки Логотип Reveal
От BILDER в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Социальные сети и сети — анимационные Иконки (MOGRT)
От IconsX в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Набор Иконки для социальных сетей — обновленная версия 01
От PickmeDigital в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Падающие социальные Иконки — Title Reveal (Mogrt)
От dorde в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки и переходы социальных сетей//DaVinci Resolve Macro
От King_Solomon в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
3D Social Media Icons for Final Cut Pro X & Apple Motion
От MotionEasy в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Marketing & Business Icons Line pack
От IsLein в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Новое приложение и Youtube Intro/Продвижение мобильных сайтов/Iphone IOS Android/Социальные сети/Иконки IGTV
От drev0 в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Out Line Icon Premiere Pro Template
От ninthmotion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки путешествий
От VSDream_Motion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Cool Social media lower Thirds
От Axel_motion в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Набор 25 Иконки
От vidbox в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
3D-иконки
От Holypix в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Медицинские иконки
От NeuronFX в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Памятники Иконки
От maxafter1 в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Иконки и элементы
От RobinMotionArt в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
181 Анимированные Иконки
От elmake в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
510 линейных Иконки
От Anton-K в Видеошаблоны
Добавить в коллекцию
Скачать
This video is currently unavailable
Графики значков
От ionestudio в Видеошаблоны
Добавить в коллекцию
Скачать
Иконки социальных сетей eps | UIDownload
Иконки социальных сетей eps | UIDownload Иконки социальных сетей epsКак добавить значки социальных сетей в вашу тему Ghost
Добавьте любой значок социальных сетей на свой сайт Ghost из Ghost Admin. Этот учебник проведет вас через процесс, шаг за шагом.
📢
В этом руководстве в качестве рабочего примера используется стандартная тема Ghost, Casper. Методы, представленные ниже, также могут быть применены к другим темам Ghost.
Перейти к Настройки → Навигация . В область основной навигации добавьте новый элемент для каждой социальной сети, которую вы хотите включить. Важно, чтобы ярлык был названием социальной сети. Например, чтобы добавить ссылку на свою страницу в Instagram, используйте «Instagram» в качестве метки навигации.
Генератор кода
Следуйте оставшейся части руководства, чтобы получить пошаговое руководство по написанию кода для вашей темы, или выберите более короткий путь и используйте наш генератор для автоматического создания кода для вас.
Выберите официальную тему Ghost и нужные значки социальных сетей. Затем скопируйте код и вставьте его в
Чтобы увидеть, как добавлять значки вручную, или узнать больше об этом процессе, продолжайте обучение ниже.
Тема
Выберите свои социальные сети
Сгенерированный код
Добавить библиотеку иконок
Мы собираемся использовать FontAwesome в качестве нашей библиотеки иконок. Давайте загрузим его на наш сайт Ghost. Перейдите в Настройки → Внедрение кода → Заголовок сайта .
Вставьте следующую строку кода и нажмите Сохранить .
Добавьте базовые стили
Затем добавьте базовый стиль значка сразу после строки кода из предыдущего шага.
<стиль> .gh-head-menu .nav-facebook а, .gh-head-menu .nav-github, .gh-head-menu .nav-instagram, .gh-head-menu .nav-мастодонт а, .gh-head-menu .nav-tiktok, .gh-head-menu .nav-twitter { размер шрифта: 0 !важно; } .gh-head-menu .nav-facebook a::before, .gh-head-menu .nav-github a::before, .gh-head-menu .nav-instagram a::before, .gh-head-menu .nav-mastodon a::before, .gh-head-menu .nav-tiktok a::before, .gh-head-menu .nav-twitter a::before { семейство шрифтов: "Шрифт Awesome 6 Brands"; отображение: встроенный блок; размер шрифта: 20px; стиль шрифта: обычный; вес шрифта: нормальный; вариант шрифта: нормальный; рендеринг текста: авто; -webkit-font-smoothing: сглаживание; } стиль>
Обратите внимание, что стили включают названия социальных сетей. Если социальная сеть, которую вы хотите использовать, уже включена, вы можете скопировать эти стили как есть. В противном случае вам нужно будет обновить их, чтобы включить новую социальную сеть. Например, для LinkedIn вы должны добавить: .gh-head-menu .nav-linked в
и .gh-head-menu .nav-linked в ::before
.
Внедрение кода теперь выглядит так:
Последним шагом является добавление стилей, которые извлекают фактическую иконку для каждой социальной сети. Вот код для значков, перечисленных выше. Опять же, добавьте его к Заголовок сайта .
<стиль> .gh-head-menu .nav-facebook a::before { содержимое: "\f09a"; } .gh-head-menu .nav-github a::before { содержимое: "\f09b"; } .gh-head-menu .nav-instagram a::before { содержимое: "\f16d"; } .gh-head-menu .nav-mastodon a::before { содержимое: "\f4f6"; } .gh-head-menu .nav-tiktok a::before { содержимое: "\e07b"; } .gh-head-menu .nav-twitter a::before { содержимое: "\f099"; }
Для дополнительных значков социальных сетей скопируйте юникод (значение после content
) с веб-сайта FontAwesome. Затем следуйте приведенному выше шаблону, чтобы создать новое правило CSS.
Например, добавьте значок LinkedIn со следующим правилом CSS:
.gh-head-menu . nav-linkedin a::before { содержимое: "\f08c"; }
Сохраните свои стили в Code Injection , обновите свою домашнюю страницу и насладитесь новыми красивыми значками социальных сетей0012 , теперь у вас есть персонализированный сайт Ghost, на котором значки социальных сетей размещены на переднем плане и в центре. Преимущество этого подхода в том, что он не требует обслуживания, а это означает, что вы можете продолжать устанавливать последнюю версию своей темы, не беспокоясь о повторном включении этого кода.
Нам не терпится увидеть ваши пользовательские значки социальных сетей. Поделитесь своим сайтом со всем сообществом Ghost на нашем официальном форуме. Это также фантастическое место, где можно получить помощь и познакомиться с другими людьми, использующими Ghost.
Значки социальных сетей • Контекстная тема Shopify • Справочный центр • Флуоресцентный
В дополнение к размещению значков социальных сетей в нижнем колонтитуле вашего сайта, вы можете разместить их более заметно на своей домашней странице.
Для этого можно использовать раздел домашней страницы значков социальных сетей.
Раздел значков социальных сетей со всеми включенными значкамиНастройка раздела
Добавьте этот раздел в свой шаблон и измените порядок его положения. Вы можете добавить этот раздел несколько раз с разным содержимым и настройками.
Когда вы добавляете раздел в шаблон, он будет отображаться на всех страницах, использующих этот же шаблон. Чтобы добавить разделы на определенные страницы, вы можете создать и назначить новые шаблоны.
Шаги
В редакторе тем ( Настройка ):
Выберите шаблон для редактирования в раскрывающемся меню на верхней панели.
Узнайте, как использовать доступные шаблоны Context, в нашем справочном руководстве по шаблонам.
На боковой панели нажмите (+) Добавьте раздел и выберите Иконки социальных сетей .
Измените порядок разделов с помощью маркеров перетаскивания
⋮⋮
Чтобы отобразить значки социальных сетей, вам нужно будет скопировать и вставить URL-адреса ваших учетных записей социальных сетей в соответствующие блоки. Социальные иконки доступны для: Facebook, Pinterest, Twitter, Instagram, LinkedIn, TikTok, Tumblr, Vimeo, Youtube и Snapchat.
В редакторе темы ( Настроить ):
Нажмите + Добавить блок , чтобы выбрать блок значка социальной сети и/или нажмите на этот блок, чтобы открыть настройки.
Вставьте URL-адрес своей учетной записи в социальной сети.
( Дополнительный .) Нажмите и удерживайте маркеры перетаскивания
⋮⋮
, чтобы изменить порядок блоков:Нажмите Удалить блок в настройках блока, чтобы удалить блок.
Щелкните значок глаза , чтобы скрыть или отобразить блок.