Как вставить HTML5-презентацию на сайт или в блог?
Главное преимущество презентаций в формате HTML5 заключается в том, что они могут быть просмотрены на компьютерах и на мобильных устройствах (iPad, iPhone, Android-смартфонах и планшетах). Но для того, чтобы их кто-то мог посмотреть, презентации должны быть загружены в веб и вставлены на сайт или в блог.
Размещение PowerPoint-презентации на сайте происходит в 3 простых шага:
- Публикация презентации в формат HTML5
- Загрузка презентации на сервер по FTP и получение http-ссылки
- Вставка презентации на страницу
1. Публикация презентации в формат HTML5 и загрузка на сайт
Вы можете опубликовать презентацию в формат HTML5 с помощью программ iSpring Suite и iSpring Pro. Рассмотрим на примере iSpring Suite. На панели инструментов PowerPoint выберите вкладку iSpring Suite и кликните кнопку «Публикация».
Выберите вкладку Web, введите название презентации, укажите папку публикации и нажмите кнопку Опубликовать.
2. Загрузка на FTP и получение ссылки
После успешного завершения процесса публикации вы увидите окно, где отобразится готовая презентация. Здесь вы можете загрузить папку с презентацией на сервер по FTP.
Для этого нажмите Загрузить на FTP.

В открывшемся окне введите данные FTP-аккаунта. Презентация сразу же будет загружена на ваш сервер.
Подробнее о настройке аккаунтов FTP читайте в документации.
Затем вам нужно получить HTTP-адрес загруженной презентации. URL презентации будет зависеть от настроек сервера.
Пожалуйста, удостоверьтесь, что адрес начинается с «http://», а не с «ftp://».
3. Вставка на страницу
Презентацию можно вставить на страницу несколькими способами:
- открытие в отдельном окне;
- открытие во всплывающем окне;
- воспроизведение в iframe.
а) Воспроизведение в отдельном окне
Это самый простой способ. Просто разместите в тексте страницы сайта ссылку на презентацию с помощью визуального редактора или в режиме редактирования HTML-кода страницы. Во втором случае вам необходимо разместить подобный код:
Вы можете выбрать, в каком окне браузера открывать ссылку — в том же (target=”_self”) или в новом (target=”_blank”).
б) Открытие HTML5-презентации во всплывающем окне
Если вы хотите открыть презентацию во всплывающем окне, удостоверьтесь, что редактор страниц на вашем сайте поддерживает вставку JavaScript-кода.
Используйте следующий код для создания всплывающего окна:
Вы можете включить/отключить некоторые элементы окна, в котором открывается презентация. Справку на английском можно посмотреть на сайте w3schools.com.
Если вы хотите, чтобы презентация открывалась во всплывающем окне при загрузке какой-либо страницы, добавьте в исходный код страницы строки:
Пользуйтесь этим вариантом с осторожностью: большинство браузеров блокируют всплывающие окна.
в) Вставка презентации в iframe
HTML-тэг IFRAME позволяет показывать содержимое одной страницы внутри другой.
Для вставки презентации воспользуйтесь следующим кодом:
У вас остались вопросы?
Для поиска ответов на все интересующие вас вопросы воспользуйтесь Базой Знаний или обратитесь в службу поддержки по адресу support@ispring.ru. Будем рады помочь вам.
- Разработка электронных курсов для iPad
- Как создать учебный курс, используя средства разработки iSpring
- Системные требования при конвертации в видео
Web-страницы внутри презентаций Microsoft PowerPoint

Встроить web-страницу в слайд PowerPoint, чтобы докладчик мог, не прерывая презентацию, продемонстрировать сайт, показать видео, встроить PDF-документ или устроить интерактивное голосование среди слушателей.
Решения
Оказалось, что в PowerPoint имеется возможность встраивать элемент управления Microsoft WebBrowser ActiveX, который и отображает страницы.

Oднако такой вариант имеет существенные недостатки:

- Адрес страницы нужно менять непосредственно в Visual Basic
- Для старта требуется отдельный элемент управления, например, кнопка стартующая вызов страницы
- Большие страницы загружаются не сразу, а прогресс-бара нет. Просто пустое, белое место. Докладчик не знает, произошла ошибка или стоит еще подождать.
- Если страница недоступна, появляется стандартная страница IE с ошибкой.
- Страница по умолчанию отображается движком IE установленным в системе. У меня под Win7 это IE7, страницы, не оптимизированные под IE7 отображаются криво и с ошибкой:
- Страница не обновляется автоматически
Так как докладчик будет самостоятельно встраивать страницы и может не обладать нужными знаниями, желательно сделать эту процедуру простой.
LiveWeb add-in
Поэкспериментировав с Visual Basic, я решил поискать готовое решение для докладчика. Кроме платных вариантов, вроде iBrowse, я нашел бесплатный add-in – LiveWeb. Страница с описанием довольно навороченная, но содержит всю нужную информацию по установке и работе с LiveWeb, повторять которую смысла нет. Поддерживаются версии Microsof PowerPoint с 97 по 2010. Add-in пользуется популярностью, а также продолжает поддерживаться разработчиком. Слайды сохраняются с расширением *.pptm (ppt + macros).
Кроме удобного создания и изменения параметров окна, важно, что LiveWeb при каждом посещении слайда обновляет страницу.
Примеры

Встроенное в презентацию видео (youtube)

Встроенный в презентацию SMS-опрос
Преимущества add-in
- Мастер встройки web-страниц в слайды, настройка параметров.
- Add-in показывает актуальную страницу при каждом просмотре слайда
- Исправить ситуацию с IE7 можно добавив мета-тег, с указанием желаемой версии Internet Explorer, на нужную страницу:
Недостатки
- При изменении параметров страницы, например адреса, другие настройки (размер и расположение)меняются на дефолтные, что неудобно.
- Не решены проблемы с прогресс-баром и пустой страницей (если сайт недоступен).
Итог
Конечно мета-тег на чужую страницу не вставить, не помешал бы прогресс-бар, да и интернет не всегда есть. Но как готовое решение для простой и быстрой вставки сайтов, совместимых с IE7, плагин зарекомендовал себя очень хорошо.
Буду рад если кто-нибудь поделится своим решением. Также хотелось бы найти решение для Mac.
- Презентации
- IT-компании
Как добавить гиперссылку на слайд презентации
Самый быстрый способ создать простейшую веб-гиперссылку на слайде в PowerPoint — нажать клавишу ВВОД после ввода адреса веб-страницы (например, http://www.contoso.com ).
Вы можете создать ссылку на веб-страницу, либо создать ссылку на новый документ или место в существующем документе, либо же вы можете создать сообщение на определенный адрес электронной почты.

Ссылка на веб-сайт
- Выделите текст, фигуру или рисунок, который вы хотите использовать как гиперссылку.
- На вкладке Вставка нажмите Гиперссылка.
- Выберите Существующий файл или веб-страница и добавьте:
- Текст. Введите текст, который должен отображаться в качестве гиперссылки.
- Подсказка. Введите текст, который должен отображаться при наведении указателя мыши на гиперссылку (необязательно).
- Текущая папка, Просмотренные страницы или Последние файлы: Выберите, куда должна вести ссылка.
- Адрес. Если вы еще не выбрали расположение выше, вставьте URL-адрес веб-сайта, на который должна указывать ссылка. Если создать ссылку на файл, расположенный на локальном компьютере, и перенести презентацию PowerPoint на другой компьютер, необходимо также перенести все связанные файлы.
- 4. Нажмите ОК.
Создание ссылки на место в документе, новый документ или адрес электронной почты
- Выделите текст, фигуру или рисунок, который вы хотите использовать как гиперссылку.
- Выберите Вставка >Гиперссылка и выберите подходящий вариант:
- Место в документе: Используется для создания ссылки на определенный слайд в презентации.
- Новый документ: Используется для создания ссылки на другую презентацию.
- Электронная почта. Используется для создания ссылки на отображаемый адрес электронной почты, с помощью которой запускается почтовый клиент пользователя.
- Заполните поля Текст, Подсказка и укажите, куда должна указывать ссылка.
- Нажмите ОК.
Изменение цвета гиперссылки
Вы можете изменить цвет гиперссылки по своему усмотрению. Если вы хотите изменить отображение текста ссылки, щелкните правой кнопкой мыши и выберите Изменить ссылку.

- Выделите гиперссылку, у которой необходимо изменить цвет.
- На вкладке Главная на ленте нажмите стрелку рядом с кнопкой Цвет шрифта, чтобы открыть меню палитры цветов.
- Выберите цвет для гиперссылки.
Проверка гиперссылки
После вставки ссылки вы можете протестировать ее (в обычном режиме), кликнув по гиперссылке правой кнопкой мыши и выбрав Открыть гиперссылку.
Показ и возврат
Поле Показ и возврат неактивно, если только вы не создаете ссылку на произвольный показ в презентации.
Если вы Microsoft 365подписчик и хотите использовать такую функцию, как Показ и возврат , щелкните здесь, чтобы узнать о том, как создать ссылку на другой слайд с помощью команды «Масштаб» в приложении PowerPoint, а затем см. функции «Выбор возврата» в конце этой статьи.
См. также
Самый быстрый способ создать простейшую веб-гиперссылку на слайде в PowerPoint — нажать клавишу ВВОД после ввода адреса веб-страницы (например, http://www.contoso.com ).
Вы можете создать ссылку на веб-страницу, определенное место в вашей презентации, другую презентацию или создание сообщения электронной почты.
2016
Выберите заголовок раздела ниже, чтобы открыть подробные инструкции.
Ссылка на веб-страницу

- В обычном режиме просмотра выделите текст, фигуру или рисунок, который требуется использовать как гиперссылку.
- На вкладке Вставка нажмите кнопку Гиперссылка. Открывается диалоговое окно Вставка гиперссылки. 1. Отображаемый текст: связанный со ссылкой текст в документе. 2. Всплывающая подсказка: Текст, который отображается при наведении указателя мыши на текст ссылки на слайде.
- В поле Адрес введите веб-адрес. (Например: https://www.contoso.com )
Изменение цвета гиперссылки
Эта функция доступна в версии PowerPoint 2016 для Mac 16.14.18061000. Определение версии Office

- Выделите гиперссылку, у которой необходимо изменить цвет.
- На вкладке Главная на ленте нажмите стрелку рядом с кнопкой Цвет шрифта, чтобы открыть меню палитры цветов.
- Выберите цвет для гиперссылки.
Ссылка на слайд в той же презентации
- В диалоговом окне Вставка гиперссылки выберите Этот документ.
- В разделе Выберите место в документе щелкните слайд, на который нужно создать ссылку.
Ссылка на другую презентацию
- В диалоговом окне Вставка гиперссылки выберите Веб-страница или файл.
- Щелкните Выбрать и выберите нужную презентацию или файл.
Примечание: В PowerPoint для macOS нельзя создать ссылку на конкретный слайд в другой презентации.
Создание ссылки на адрес электронной почты
- В диалоговом окне Вставка гиперссылки выберите Адрес эл. почты.
- В поле Адрес эл. почты введите адрес электронной почты, на который будет указывать ссылка, или выберите адрес электронной почты в поле Недавно использовавшиеся адреса электронной почты.
- В поле Тема введите тему сообщения.
2011
Выберите заголовок раздела ниже, чтобы открыть подробные инструкции.
Ссылка на веб-страницу
- Выберите текст или объект, который требуется превратить в гиперссылку.
- На вкладке Главная в группе Вставить нажмите кнопку Текст и выберите пункт Гиперссылка.
- В поле Связать с введите веб-адрес.
Примечание: Чтобы связать объект с определенным расположением на веб-странице, щелкните вкладку Веб-страница и следуйте инструкциям в разделе Привязка.
Ссылка на документ или адрес электронной почты
Вы можете добавить текст или объект как гиперссылку, которая будет открывать определенный слайд презентации PowerPoint или произвольное слайд-шоу. Также можно создать ссылку на документ Word, книгу Excel, файл или адрес электронной почты.
- Выберите текст или объект, который требуется превратить в гиперссылку.
- На вкладке Главная в группе Вставить нажмите кнопку Текст и выберите пункт Гиперссылка.
- Перейдите на вкладку Документ или Адрес электронной почты, чтобы выбрать нужный тип гиперссылки.
- Следуйте инструкциям, чтобы создать ссылку.
Примечание: Гиперссылка активна в режиме слайд-шоу.
Ссылка на определенное место в презентации
Вы можете создавать ссылки на определенные участки или объекты презентации, например первый, последний, последующий слайды или на заголовки слайдов.
- Выберите текст или объект, который требуется превратить в гиперссылку.
- На вкладке Главная в группе Вставить нажмите кнопку Текст и выберите пункт Гиперссылка.
- Перейдите на вкладку Документ и в разделе Привязка щелкните Найти.
- Выберите место в документе, на которое должна указывать ссылка.
Примечание: Гиперссылка активна в режиме слайд-шоу.
Ссылка на произвольный показ
Гиперссылки на произвольные показы позволяют быстро открывать их из основной презентации. Например, вы можете создать слайд содержания презентации, пункты которого будут гиперссылками. С такого слайда содержания можно переходить к различным разделам презентации, а следовательно выбирать, какие из них показывать аудитории в тот или иной момент. Далее описывается, как создавать один или несколько произвольных показов и добавлять на них гиперссылки из основной презентации.
Примечание: Если требуется создать гиперссылку из одной презентации на другую, можно добавить гиперссылку на другой документ. Дополнительные сведения см. в статье Создание, изменение и удаление гиперссылок.
- Откройте презентацию, которая будет использоваться для создания произвольного показа по гиперссылке.
- На вкладке Показ слайдов в группе Воспроизвести слайд-шоу щелкните Произвольные показы и нажмите кнопку Изменить произвольные показы.
- Нажмите кнопку Создать.
- В поле Слайды презентации выберите слайды, которые нужно включить в произвольный показ, а затем нажмите кнопку Добавить.
Совет: Чтобы выбрать несколько последовательных слайдов, щелкните первый из них и, удерживая нажмите клавишу SHIFT и, ее, щелкните последний нужный слайд. Чтобы выбрать несколько непоследовательных слайдов, удерживая клавишу COMMAND, щелкните все нужные слайды.
Изменение гиперссылки
- Выделите гиперссылку, которую требуется изменить.
- В меню Вставка выберите Гиперссылка.
- Внесите необходимые изменения.
Удаление гиперссылки
- Выберите текст или объект, представляющие гиперссылку, которую требуется удалить.
- На вкладке Главная в группе Вставить нажмите кнопку Текст и выберите пункт Гиперссылка и нажмите кнопку Удалить ссылку.
См. также
- Выделите текст, который хотите использовать в качестве гиперссылки.

- На вкладке Вставка нажмите кнопку Гиперссылка.
Откроется диалоговое окно Ссылка. - В поле Отображаемый текст введите текст, который будет отображаться на слайде для гиперссылки.

- В поле Адрес введите веб-адрес. (Например: https://www.contoso.com )
- Нажмите Вставка.
- Чтобы проверить гиперссылку, выберите вкладку Слайд-шоу на ленте и нажмите кнопку Воспроизвести с начала. (Если вы отключили упрощенную ленту, вкладка Слайд-шоу не отображается. Используйте вместо нее вкладку Вид, чтобы начать слайд-шоу.)
- Кроме того, вы можете создать гиперссылку на адрес электронной почты. Вместо того чтобы вводить веб-адрес в поле Адрес (шаг 4 выше), введите mailto:// , а затем полный адрес электронной почты.
Вставка гиперссылки
- На слайде коснитесь места, на котором вы хотите добавить ссылку.
- На вкладке Вставка на ленте выберите Ссылка.
- Выберите Вставить ссылку. Или: Вы можете добавить ссылку на последний веб-адрес или недавно открытый файл, выбрав пункт из появившегося списка Последние элементы.
- В поле Отображаемый текст введите текст гиперссылки.
- В поле Адрес введите адрес для ссылки. (Например: https://www.contoso.com )
- Нажмите Вставка.
Изменение цвета гиперссылки

Эта возможность в настоящее время доступна только участникам программы предварительной оценки Office.
Вставка гиперссылки
- На слайде коснитесь места, на котором вы хотите добавить ссылку.
- На вкладке Вставка на ленте выберите Ссылка.
- Выберите Вставить ссылку. Или: Вы можете добавить ссылку на последний веб-адрес или недавно открытый файл, выбрав пункт из появившегося списка Последние элементы.
- В поле Отображаемый текст введите текст гиперссылки.
- В поле Адрес введите адрес для ссылки. (Например: https://www.contoso.com )
- Нажмите Вставка.
Изменение цвета гиперссылки

- Выделите гиперссылку, у которой необходимо изменить цвет.
- На вкладке
Главная на ленте, нажмите стрелку рядом с кнопкойЦвет шрифта , чтобы открыть меню палитры цветов. - выберите цвет для гиперссылки.
Вставка гиперссылки
- На слайде введите текст, который вы хотите преобразовать в гиперссылку.
- Выделите текст.
- На вкладке Вставка на ленте выберите Ссылка.
- Выберите Вставить ссылку. Или: Вы можете добавить ссылку на недавно открытый файл, выбрав его в появившемся списке Последние элементы.
- В открывающемся диалоговом окне в поле Адрес введите адрес для ссылки. (Например: https://www.contoso.com )
- Нажмите Вставка.
Изменение цвета гиперссылки

- Выделите гиперссылку, у которой необходимо изменить цвет.
- На вкладке
Главная на ленте, нажмите стрелку рядом с кнопкойЦвет шрифта , чтобы открыть меню палитры цветов. - Нажмите цвет, который необходимо выбрать для гиперссылки.
Как бесплатно встроить iframe в презентацию PowerPoint
Для лучшей и более точной презентации PowerPoint многие люди предпочитают встраивать живые веб-страницы (HTML) в свои презентации PowerPoint. Конечно, вы можете добавить скриншот веб-страницы, но это не является удовлетворительным, особенно с течением времени. Итак, мы возвращаемся к живым HTML-страницам, в этой статье мы покажем вам как вставить код iframe для вставки HTML-страниц и других веб-объектов в презентацию PowerPoint.

- Часть 1: Что такое iframe
- Часть 2: Как вставить iframe в PowerPoint
- Рекомендуется: Конвертер PPT в видео
- Часть 3. Часто задаваемые вопросы о внедрении iframe в презентацию PowerPoint
Часть 1: Что такое iframe
iframe, также называемый встроенным фреймом, представляет собой один HTML-документ, встроенный в другой HTML-документ на веб-сайте. Пользовательский агент может выбрать его в качестве фокуса для печати, просмотра его источника и т. д. Хотя iframe выглядит как встроенное изображение, его можно настроить с собственной полосой прокрутки, независимой от полосы прокрутки окружающей страницы.
В PowerPoint, если вы хотите напрямую проверять веб-страницы из слайд-шоу, вы можете встроить код iframe в этот PowerPoint, а затем вы можете сохранить поток презентации PowerPoint и одновременно отображать веб-объект.
Часть 2: Как вставить iframe в PowerPoint
Теперь давайте посмотрим, как легко вставить Iframe в PPT.
Перейдите на веб-страницу HTML, которую вы хотите добавить в презентацию PowerPoint, и скопируйте ее веб-адрес (URL). Если вы хотите вставить только элемент веб-страницы, найдите его код iframe и скопируйте URL-адрес из кода встраивания.
Загрузите iSpring Converter Pro. Поскольку PowerPoint не поддерживает вставку живых веб-страниц в PPT, нам нужно использовать одну надстройку PowerPoint, чтобы встроить iframe в вашу презентацию.
Откройте PowerPoint и нажмите кнопку iSpring Converter Pro 8 в верхнем меню. И выберите Веб-объект на панели инструментов.

В открывшемся окне введите или вставьте URL-адрес элемента веб-страницы, который вы хотите вставить в PPT. Если вы хотите вставить всю веб-страницу, вы можете ввести ее адрес. После этого нажмите предварительный просмотр чтобы проверить правильность URL-адреса.
Выберите размер iframe из Настройки в левом нижнем углу, чтобы адаптировать другие объекты в слайд-шоу. И нажмите OK чтобы закончить вставку.

Для воспроизведения веб-объектов HTML вам нужно конвертировать PowerPoint в HTML5, просто сделайте это с помощью iSpring Converter Pro.
Сначала нажмите Конвертер iSpring Pro > Опубликовать из верхнего меню.
Во-вторых, выберите Разработка и введите название презентации PowerPoint в поле Название презентации подано.
В-третьих, нажмите Параметры вывода > Мобильный (HTML5) , и вы можете просмотреть свою презентацию в правом окне.
В-четвертых, нажмите Опубликовать для публикации PowerPoint в iSpring Cloud. Таким образом, вы можете воспроизводить содержимое iframe на любом устройстве.

Рекомендуется: Конвертер PPT в видео
Возможно, вы потратили много усилий, чтобы сделать презентацию лучше, например, вставить красивые картинки, простой и мощный текст, яркую анимацию и ссылки на видео, которые могут помочь аудитории лучше понять ваш контент и т. д. Однако, чтобы гарантировать, что PPT воспроизводится без ошибок или может быть легко передан вашим одноклассникам, коллегам или другим людям в Интернете, вы можете напрямую преобразовать файл PPT в видеоформат. Здесь мы рекомендуем лучший конвертер PPT в видео, чтобы обеспечить более плавный просмотр PPT вашей аудиторией без потери информации.
Aiseesoft PPT в видео конвертер является сильным помощником для преобразования файлов PowerPoint в видеоформаты, такие как WMV, MP4, AVI, FLV, MOV и т. д., или создания на DVD для удобного просмотра в любое время и в любом месте на вашем устройстве. Этот инструмент предлагает автоматический и расширенный режимы на выбор перед преобразованием. Кроме того, вы можете загружать пакетные файлы PPT для записи на DVD или видео.
Вот шаги, которым вы можете следовать.
Загрузите и установите Aiseesoft PPT to Video Converter на свой компьютер. Выбирать Преобразование в видео .

Нажмите Добавить PPT файл (ы) для импорта файлов PPT.

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

Нажмите Начать конвертировать PPT в видео.

Часть 3. Часто задаваемые вопросы о внедрении iframe в презентацию PowerPoint
Он еще не устарел, и его использование до сих пор поддерживается большинством браузеров. Но нельзя отрицать, что поводов для его использования становится все меньше. Если тенденция сохранится, то, скорее всего, она устареет.
Каков риск встраивания iframe?
Основной угрозой безопасности для встраивания iframe является атака XSS (межсайтовый скриптинг). Злоумышленник может выполнять XSS-атаки несколькими способами. Например, изменение URL-адреса исходного сайта, установка вредоносных программ, кража информации или перехват кликов и нажатий клавиш через iframe.
В чем разница между связанным объектом и внедренным объектом в PowerPoint?
Если вы просто вставляете ссылку, содержимое этой ссылки по-прежнему отделено от вашего PPT, и вы можете найти только тот файл, который можно воспроизвести по ссылке. Но если вы встроите код iframe, содержимое станет частью вашего PPT, и вы сможете найти файл напрямую.
Теперь вы, должно быть, знали, как встроить IFrame в PowerPoint свободно и легко. В случае, если ваша презентация PowerPoint устарела, просто попробуйте вставить живые HTML-страницы в PPT с помощью кода IFrame, чтобы у вас была хорошая презентация. А для лучшей презентации вы также можете легко добавить повествование в PowerPoint.
Что вы думаете об этом посте.
Рейтинг: 4.9 / 5 (на основе голосов 311) Подпишитесь на нас в
Более Чтение
![]()
Оставьте свой комментарий и присоединяйтесь к нашему обсуждению
Учебное пособие по PowerPoint

Конвертер PPT в видео
Обязательный офисный помощник для преобразования файлов PowerPoint в видео или записи на DVD для удобного просмотра в любом месте и в любое время на ПК/Mac или YouTube.
