Interpult Studio


Настройка вашей ленты Facebook

Как и во всех наших виджетах, вы можете использовать CSS для создания собственного виджета Facebook, который подойдет к любому дизайну веб-сайта. Экран настройки нашего виджета ленты Facebook позволяет создавать различные стили. Однако мы понимаем, что вам может понадобиться виджет новостной ленты, стилизованный под дизайн вашего сайта; используя CSS, вы можете добиться практически любого стиля, который хотите.

Структура HTML и классы CSS

Вот классы и структура CSS для создания пользовательского виджета Facebook:

Инструкции по внедрению

1. Создайте файл CSS

Используйте свой любимый текстовый редактор или программное обеспечение для подготовки файла CSS. Блокнот++ — отличный бесплатный редактор, который идеально подходит для создания файла CSS, но есть и другие, доступные в Интернете. Все, что вам нужно, это текстовый редактор, который не применяет никакого форматирования, такого как размер шрифта и т. д.

Базовый файл будет выглядеть примерно так, как в примере (см. ниже), и будет создавать пользовательский виджет facebook, который вы видите в примере ниже. Как видите, CSS разделен на три раздела; Контейнер, заголовок и содержимое. Мы прокомментировали их. Вы можете просто скопировать этот код в свой код/текстовый редактор и изменить содержимое, а затем сохранить как мое имя файла.css (или любое другое имя, которое вы хотите, но оно должно иметь расширение .css).

READ  Создайте виджет iTunes RSS

2. Загрузите файл CSS для своего пользовательского виджета Facebook на свой веб-сервер.

Поместите файл CSS на локальный сервер или используйте такой сервис, как Dropbox, для хранения вашего CSS файл вне сайта. Скопируйте URL-адрес для использования на экране настройки Feedwind.

3. Введите URL-адрес CSS

Нажми на >Расширенные настройки ссылка в “Общий” на экране настройки. Введите URL-адрес пользовательского расположения CSS в поле URL-адрес пользовательского CSS. Новый пользовательский дизайн виджета facebook будет отображаться в области предварительного просмотра.

Примечание: При использовании пользовательского CSS некоторые части экрана настроек FeedWind будут выделены серым цветом и отключены. Это сделано для предотвращения конфликтов между настройками FeedWind по умолчанию и настройками в пользовательском CSS.

Сопоставьте свои настройки с доступным размером контейнера

FeedWind имеет возможность установить максимальную длину заголовков и содержимого каналов, указав количество отображаемых символов. FeedWind автоматически регулирует количество отображаемых каналов на основе введенного значения максимальной длины. Иногда элемент фида может отображаться за пределами контейнера в зависимости от высоты строки и других настроек в пользовательском CSS. В этом случае измените настройки в файле CSS или измените количество символов, разрешенных в заголовках/контенте.


Похожие сообщения



Source link

от admin