Эмбеды что это
Перейти к содержимому

Эмбеды что это

  • автор:

Английский [ править ]

Это незаконченная статья. Вы можете помочь проекту, исправив и дополнив её .
В частности, следует уточнить сведения о:

  • Английский язык
  • Английские глаголы
  • Американский вариант английского языка
  • Жаргонизмы/en
  • Требуется категоризация/en
  • Слова из 5 букв/en
  • Нет сведений о составе слова
  • Нужно произношение
  • Нужна иллюстрация
  • Статьи без примеров употребления
  • Нужна этимология
  • Нужны сведения о морфологии/en
  • Нужно произношение/en
  • Нужна этимология/en
  • Статьи, нуждающиеся в доработке/en

: Вложение расширенных элементов

**HTML-элемент **вставляет расширенный контент в выбранное место документа. Этот контент может быть представлен от внешнего приложения или другого источника интерактивного контента, такого как плагин для браузера, например.

Интерактивный пример

Примечание: Этот раздел посвящён только элементу, который является частью стандарта HTML5, и никак не касается ранних, нестандартизированных его реализаций.

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

Категории контента Flow content (en-US) , phrasing content (en-US) , embedded content, interactive content, palpable content.
Допустимое содержимое Отсутствует, это empty element.
Пропуск тегов Должен иметь открывающий тег, закрывающий тег должен быть пропущен
Допустимые родители Любой элемент, который допускает встроенный контент
Допустимые ARIA-роли application (en-US) , document (en-US) , img (en-US) , presentation (en-US)
DOM-интерфейс HTMLEmbedElement (en-US)

Атрибуты

Атрибуты этого элемента включают все глобальные атрибуты.

Отображает высоту ресурса в CSS пикселях. Это должно быть абсолютное значение; проценты не допустимы.

Ссылка на встраиваемый ресурс.

MIME-тип, используемый для выбора подключаемого модуля для создания экземпляра.

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

Примечание

Вы можете использовать свойство object-position , чтобы настроить расположение встроенного объекта в рамке элемента, а также свойство object-fit , чтобы контролировать регулирование размер объекта в соответствии с рамкой.

Примеры

embed type="video/quicktime" src="movie.mov" width="640" height="480" /> 

Спецификации

Specification
HTML Standard
# the-embed-element

Поддержка браузерами

BCD tables only load in the browser

Примечание: До версии 45, Firefox не отображает содержимое HTML-ресурса, но сообщает о том, что для отображения контента требуется плагин (см. баг 730768).

Смотрите также

  • Другие элементы, используемые для встраивания различного рода контента: , , (en-US), , , (en-US), , and .
  • Свойства, для позиционирования и определения размера внедрённого контента в его фрейме: object-position and object-fit

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

This page was last modified on 19 нояб. 2023 г. by MDN contributors.

Your blueprint for a better internet.

Эмбед

Эмбед — особый формат сообщений. Есть миф, что их могут (без модификаций и селфботов) отправлять только боты, однако это не так. Вы уже сталкивались с эмбедами, когда делились с друзьями сайтами или видео c Youtube.

Эмбеды есть следующих типов:

Тип Доступен для Описание Пример Настройка
rich Боты, вебхуки (для пользователей только с модификациями/селфботами) Самый красивый и многофункциональный вид эмбедов Screenshot 20191211 173058 Через API
link Все Появляется при отправлении ссылки без <> Link-embed Создателем сайта
video Все Появляется при отправлении ссылки на видео без <> Video-embed Создателем сайта
  • 1 Как прислать эмбед?
    • 1.1 Способ для ботов (rich)
      • 1.1.1 API
      • 1.1.2 JavaScript
      • 1.1.3 Python
      • 1.1.4 Discord Bot Maker
      • 1.2.1 Создаём (Генерируем) эмбед

      Как прислать эмбед? [ ]

      Способ для ботов (rich) [ ]

      API [ ]
      JavaScript [ ]
      Python [ ]
      Discord Bot Maker [ ]

      1. Для начала нам нужно создать команду, у нас это будет тест-эмбеда-для-вики

      1 шаг

      2. Потом, нажмите «Create» и нажмите на «Send Message», потом выберите категорию «Messaging» и там выберите «Create Embed Messagse»

      Bandicam-2019-08-08-11-38-54-916

      2.1. Вписываем заголовок эмбеда, URL, Автора, цвет, изображение. Потом пишем в «Variable Name», например, «varembed» и сохраняем.

      2

      3. Нажимаем опять кнопку «Create», выбираем ту же самую категорию и выбираем уже «Set Embed Description».

      3.1. Вписываем «Variable Name», который мы написали в прошлом событии, у нас это был «varembed», вписываем.

      3.2. А дальше просто пишем, что у нас будет в эмбеде, у нас это «embed test».

      3.1, 3

      4. Дальше создаём ещё одно событие в команде, выбираем также «Messaging», но функцию уже выбираем «Send Embed Message».

      4.1. Вписываем «Variable Name», в нашем случае это «varembed». Потом можем выбрать куда сообщение придёт и готово!

      Эмбед с помощью Discord Bot Maker был создан, осталось запустить вашего бота и продемонстрировать эту команду.

      BetterDiscord [ ]

      В интернете можно найти плагин, который сможет отсылать эмбеды (типа link), в данном случае опишется плагин «Safe Embed Generator».

      1. Скачиваем плагин по ссылке *клик*.

      1.1 Перекидываем в папку с плагинами, на Windows %APPDATA%\Roaming\BetterDiscord\plugins, на Linux $HOME/.config/BetterDiscord/plugins

      1.2 Подключаем его в настройках пользователя во вкладке «Plugins».

      Создаём (Генерируем) эмбед [ ]

      1. Нажимаем на кнопку в поле ввода сообщения.

      2. Когда вы видите это, не бойтесь. Заполняйте всё как вам надо, сбоку появится превью эмбеда. Как и в Discord Bot Maker тут можно выбрать цвет, картинку, автора, заголовок.

      2 шаг

      3. Когда вы всё заполнили, можете нажимать «Send», и у вас отправится эмбед!

      Эмбеды

      Возможно, вы видели некоторые специальные сообщения в Discord (часто отправляемые ботами/вебхуками), которые имеют цветную рамку, встроенные изображения, текстовые поля и другие свойства. Эти элементы называются Эмбедами, и в этом разделе будет рассказано, как вы можете создать и отправить их с помощью своего бота. Это делается с помощью объекта Embed .

      В этом разделе будут подробно рассмотрены атрибуты и методы, используемые в эмбедах. Таким образом, мы рекомендуем перейти к нужной вам теме через оглавление.

      Предпросмотр эмбеда​

      Вот пример того, как может выглядеть эмбед. Мы рассмотрим конструкцию эмбеда в следующей части этой статьи.

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Описание эмбеда
      Обычный заголовок
      Обычное значение
      Встроенный заголовок
      Встроенное значение
      Встроенный заголовок
      Встроенное значение
      Встроенный заголовок
      Встроенное значение

      Футер эмбеда • 01/01/2077

      Код для этого эмбеда приведен ниже.

      import disnake from disnake.ext import commands  # Внутри команды, прослушивателя событий и т.д. embed = disnake.Embed(  title="Заголовок эмбеда",  description="Описание эмбеда",  color=disnake.Colour.yellow(),  timestamp=datetime.datetime.now(), ) embed.set_author(  name="Автор эмбеда",  url="https://disnake.dev/",  icon_url="https://disnake.dev/assets/disnake-logo.png", ) embed.set_footer(  text="Футер эмбеда",  icon_url="https://disnake.dev/assets/disnake-logo.png", ) embed.set_thumbnail(url="https://disnake.dev/assets/disnake-logo.png") embed.set_image(url="https://disnake.dev/assets/disnake-thin-banner.png") embed.add_field(name="Обычный заголовок", value="Обычное значение", inline=False) embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True) embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True) embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True)  await ctx.send(embed=embed) 

      Нет строгой необходимости использовать все элементы, представленные выше. Вы можете оставить некоторые из них в соответствии с вашими потребностями.

      Цвет вставки (с помощью параметра color ) принимает экземпляр Colour , шестнадцатеричная строка или целое число.

      Чтобы добавить пустое поле для эмбеда, вы можете использовать embed.add_field(name=’\u200b’, value=’\u200b’) .

      Создание эмбеда​

      Вы можете использовать Embed для создания эмбедов и манипулирования ими.

      embed = disnake.Embed(  title="Заголовок эмбеда",  description="Описание эмбеда",  colour=0xF0C43F, ) 

      Disnake Bot Bot 05/16/2023
      Заголовок эмбеда
      Описание эмбеда

      Установка автора​

      Вы можете указать автора эмбеда с помощью метода set_author . Обратите внимание, что этот код запускается после того, как вы определили embed через embed = disnake.Embed(. ) .

      embed.set_author(  name="Автор эмбеда",  url="https://disnake.dev/",  icon_url="https://disnake.dev/assets/disnake-logo.png", ) 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Заголовок эмбеда
      Описание эмбеда

      Поскольку в этом случае мы установили URL-адрес, нажатие на «Автор эмбеда» перенаправит пользователя на сайт disnake.dev .

      Установка футера​

      Вы можете указать футер эмбеда с помощью метода set_footer . Обратите внимание, что этот код запускается после того, как вы определили embed через embed = disnake.Embed(. ) .

      embed.set_footer(  text="Футер эмбеда",  icon_url="https://disnake.dev/assets/disnake-logo.png", ) 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Заголовок эмбеда
      Описание эмбеда

      Футер эмбеда

      Установка миниатюры​

      Вы можете указать миниатюру с помощью метода set_thumbnail . Обратите внимание, что этот код запускается после того, как вы определили embed через embed = disnake.Embed(. ) .

      embed.set_thumbnail(url="https://disnake.dev/assets/disnake-thin-banner.png") 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Embed Thumbnail

      It is shown in the top-right corner of the embed. You can set this as a URL, but disnake also allows you to use a locally stored file instead, using the file parameter.

      Футер эмбеда • 01/01/2077

      Использование временных отметок​

      Временные отметки отображаются возле футера эмбеда, указывая время, в которое было отправлен/инициирован эмбед. Это можно сделать с помощью параметра timestamp disnake.Embed() . Обратите внимание, что вам нужно будет импортировать пакет datetime в ваш код.

      import datetime  # Внутри команды, прослушивателя событий и т.д. embed = disnake.Embed(  title="Эмбед!",  description="Описание",  colour=0xF0C43F,  timestamp=datetime.datetime.now(), ) 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Временные отметки

      Футер эмбеда • 01/01/2077

      Добавление полей​

      Поля эмбеда имеют два параметра — название (или заголовок) и значение внутри с помощью метода add_field . Также можно использовать markdown в обоих параметрах.

      # Обычные поля embed.add_field(name="Обычный заголовок", value="Обычное значение", inline=False)  # Встроенные поля embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True) embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True) embed.add_field(name="Встроенный заголовок", value="Встроенное значение", inline=True) 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Заголовок эмбеда
      Описание эмбеда
      Обычный заголовок
      Обычное значение
      Встроенный заголовок
      Встроенное значение
      Встроенный заголовок
      Встроенное значение
      Встроенный заголовок
      Встроенное значение

      Футер эмбеда • 01/01/2077

      Эти атрибуты также полностью поддерживают использование markdown, а также выделение ссылок. Вы также можете вставлять поля в определенную позицию с указанным индексом, используя embed.insert_field_at(index, . ) .

      Добавление изображений​

      Это можно сделать с помощью методв set_image , который принимает либо ссылку, либо объект File .

      # Используя ссылку embed.set_image(url="https://disnake.dev/assets/disnake-thin-banner.png")  # Используя локальный файл embed.set_image(file=disnake.File("path/to/file.png")) 

      Disnake Bot Bot 05/16/2023

      Автор эмбеда

      Изображения

      Футер эмбеда • 01/01/2077

      Отправка эмбеда​

      Как только эмбед будет создан, вам также нужно отправить его в канал. Это означает, что вам нужно вызвать метод send(embed=embed) для объекта, например объекта TextChannel (т.е. message.channel.send ) или объекта Context ( ctx.send ). В противном случае эмбед не будет отправлен.

      Словарь в эмбед​

      Тип данных dict (и, по сути, файл json ) может быть преобразован в вложение, используя метод Embed.from_dict() . Мы можем воссоздать вставку, сделанную в начале этой страницы, используя то же самое.

      embed_dict =   "title": "Заголовок эмбеда", "description": "Описание эмбеда", "color": 0xFEE75C, "timestamp": datetime.datetime.now().isoformat(), "author":   "name": "Автор эмбеда", "url": "https://disnake.dev/", "icon_url": "https://disnake.dev/assets/disnake-logo.png", >, "thumbnail": "url": "https://disnake.dev/assets/disnake-logo.png">, "fields": [ "name": "Обычный заголовок", "value": "Обычное значение", "inline": "false">, "name": "Встроенный заголовок", "value": "Встроенное значение", "inline": "true">, "name": "Встроенный заголовок", "value": "Встроенное значение", "inline": "true">, "name": "Встроенный заголовок", "value": "Встроенное значение", "inline": "true">, ], "image": "url": "https://disnake.dev/assets/disnake-thin-banner.png">, "footer": "text": "Футер эмбеда", "icon_url": "https://disnake.dev/assets/disnake-logo.png">, >  await channel.send(embed=disnake.Embed.from_dict(embed_dict)) 

      Это даст точно такой же результат, как и встраивание, показанное здесь. Обратите внимание, что временная отметка, передаваемая через словарь, должна быть в формате ISO8601 (что было достигнуто здесь с помощью datetime.datetime.now().isoformat() ). Вы можете узнать больше о формате вложений dict в официальной документации Discord.

      Примечания​

      • Для отображения полей рядом друг с другом необходимо, чтобы по крайней мере для двух последовательных полей было установлено значение inline=True .
      • Временная отметка автоматически настраивает часовой пояс в зависимости от устройства пользователя.
      • Упоминания любого рода в эмбедах будут корректно отображаться только в пределах описания и значений полей эмбеда.
      • Упоминания во вложениях не будут вызывать уведомление.
      • Эмбеды позволяют маскировать ссылки (например, [Guide](https://guide.disnake.dev/ ‘optional hovertext’) ), но только в описании и значениях полей.

      Ограничения​

      Есть несколько ограничений, о которых следует помнить при планировании ваших эмбедов из-за ограничений API. Вот краткий список ограничений:

      • Заголовок эмбеда ограничен 256 символами.
      • Описание эмбеда ограничен 4096 символами.
      • Максимум 25 полей.
      • Название поля ограничено 256 символами и их значение 1024 символами.
      • Текст футера ограничен 2048 символами.
      • Имя автора ограничено 256 символами.
      • Сумма всех символов из всех структур эмбеда в сообщении не должна превышать 6000 символов.
      • Одно сообщение может содержать до 10 эмбедов.

      Получившийся код​

      Код, представленный на этой странице, можно найти в нашем репозитории GitHub здесь.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *