Главная страница Canva
Помощь

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


Эта статья была переведена с помощью машинного перевода. Сообщите нам, если найдете ошибки.

Canva Code позволяет создавать интерактивные дизайны без написания кода. Вы можете использовать Canva Code двумя способами:

  • Создавайте интерактивные дизайны кода
    • Создавайте полностью интерактивные дизайны, такие как целевые страницы, панели или портфолио, а также редактируйте и публикуйте их как веб-сайты в редакторе Canva
  • Добавляйте интерактивные элементы кода в свои дизайны
    • Создайте интерактивные элементы, такие как викторины, калькуляторы или диаграммы, в другом дизайне и повторно используйте их в нескольких дизайнах

Советы:

Создавайте интерактивные дизайны кода

Используйте тип дизайна «Код» , если вы хотите создать полный интерактивный процесс.

  • Создавайте целевые страницы, панели инструментов, портфолио и многое другое
  • Редактируйте и улучшайте в редакторе Canva
  • Опубликовать как интерактивный веб-сайт
  1. На домашней странице Canva выберите Code. Откроется редактор Canva.
  2. В редакторе Canva начните с описания своего дизайна на
    вкладке ИИ Canva. Подсказка, например «Создайте интерактивный удобный трекер для отслеживания тренировок».
  3. Кроме того, на
    вкладке «Шаблоны» можно просмотреть или найти шаблоны, с которых можно начать.
  4. Усовершенствуйте его с помощью
    ИИ Canva или прямого редактирования. См. Редактирование интерактивных дизайнов и элементов Canva Code, чтобы узнать, как это сделать.

Добавляйте интерактивные элементы кода в свои дизайны

Перейдите в ИИ Canva , затем— Код кода, когда вы хотите создать один интерактивный компонент.

  • Создавайте викторины, калькуляторы, диаграммы и многое другое в виде элементов.
  • Добавляйте их в презентации, интерактивные доски или другие типы дизайнов. Опубликуйте дизайн как веб-сайт или повторно используйте элементы в нескольких дизайнах.
  1. На домашней странице Canva выберите
    ИИ Canva.
  2. В поле Подсказка опишите интерактивный элемент кода, который вы хотите создать. Узнайте подробнее о подсказках на основе ИИ здесь.
  3. Выберите </> Код.
  4. Нажмите клавишу Enter на клавиатуре или
    кнопку отправки. ИИ Canva подготавливает ваш дизайн на основе вашей подсказки.
  5. Создав дизайн кода, выберите Использовать в дизайне.
  6. В разделе Добавить в качестве элемента в, выберите тип документа, чтобы добавить его в качестве интерактивного элемента Code.
  7. Чтобы улучшить дизайн, созданный с помощью Canva Code, укажите свои улучшения в поле чата на боковой панели.

Примечание. Вы можете получить доступ к версиям дизайна из темы чата с ИИ Canva.

Редактируйте свои интерактивные дизайны и элементы, сгенерированные с помощью Canva Code

Усовершенствуйте дизайн, созданный с помощью Canva Code, с помощью инструментов редактора. Ознакомьтесь с функцией Редактирование интерактивных дизайнов и элементов, созданных с помощью Canva Code, чтобы узнать больше.

Предварительный просмотр и публикация дизайна

Выберите

«Предварительный просмотр», чтобы работать с дизайном. Когда все будет готово, вы можете опубликовать дизайн как веб-сайт. Узнайте, как публиковать веб-сайты Canva Code и управлять ими.

Примечание. Интерактивный контент работает, когда дизайн просматривается в Canva или опубликован как веб-сайт.

Доступ, копирование и управление версиями Canva Code

Каждый раз, когда вы обновляете дизайн Canva Code с помощью подсказок, Canva автоматически сохраняет новую версию в той же цепочке чатов. Это позволяет вам вернуться к более ранним итерациям, продолжить редактирование предыдущей версии или скопировать созданный код для внешнего использования.

Просмотреть историю версий

  1. На домашней странице Canva откройте
    ИИ Canva.
  2. Под панелью подсказок нажмите </> Код , чтобы просмотреть свои чаты Canva Code на боковой панели.
    • Примечание: вы можете узнать чаты Canva Code по </> значку рядом с ними.
  3. Откройте обсуждение в Canva Code.
  4. На боковой панели просмотрите доступные версии (например: версия 1, версия 2 и другие).

Примечание: если вы продолжите подсказку в том же чате, автоматически будет создана новая версия.

Использовать предыдущую версию

  1. Откройте ветку чата Canva Code.
  2. Выберите нужную версию.
  3. Выберите Использовать в дизайне , чтобы продолжить редактирование этой версии в Canva.

Посмотреть и скопировать код

Вы можете просмотреть код, сгенерированный Canva Code, и скопировать его для повторного использования вне Canva.

  1. В переписке Canva Code включите переключатель Show code t.
  2. Нажмите Скопировать код, чтобы сохранить его в буфере обмена.

Ограничения Canva Code

  • Canva Code поддерживает все языки, доступные в Canva, за исключением пользователей canva.cn.
  • Canva Code будет следовать инструкциям только из описания, которое вы ввели или использовали. Чем больше контекста и инструкций вы предоставите, тем лучше будет результат.
  • Код можно скопировать и повторно использовать за пределами Canva, но его нельзя экспортировать в виде файла или редактировать напрямую в Canva.

Можно ли повторно использовать код вне Canva?

Да. Скопированный код можно использовать в своих проектах. Хотя он создан для Canva, вы можете адаптировать его для сторонних инструментов или рабочих процессов.

Можно ли использовать свои дизайны из Canva Code в коммерческих целях?

В отношениях между вами и Canva и в той степени, в которой это разрешается законом, вы являетесь владельцем своих Загрузок и Материалов для наших функций на основе ИИ (включая Canva Code и созданные Canva Code), и Canva не будет предъявлять авторских прав на ваши Загрузки и Материалы. (включая созданные Canva Codes). Чтобы узнать больше и полные условия, см. наши Условия использования Продуктов на основе ИИ.

Кто может видеть, что я создаю с помощью Canva Code?

Только вы можете видеть свои разговоры с помощью Canva Code. Когда вы нажимаете

кнопку «Использовать в дизайне» , создается новый дизайн с этой версией, и вы можете поделиться им (включая Canva Code), нажав кнопку «Поделиться» .

Если вы публикуете свой дизайн на веб-сайте, то контроль доступа осуществляется с помощью настроек, которые вы настраиваете во время публикации сайта.

Могу ли я управлять доступом своей команды к Canva Code?

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

Не удается найти код Canva на главной странице? Подробнее об ограничениях доступа к коду Canva.

Почему я не вижу изменения строк кода?

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

Если вы не видите, что строки кода изменяются после отправки подсказки, это значит, что Canva работает в фоновом режиме, чтобы внести только необходимые изменения. Дождитесь, пока Canva Code завершит создание новой версии.

Информация пригодилась?

Полезно

Не полезно

Пользователи также просматривали