Как вставить презентацию на сайт

С помощью этого способа вы сохраняете слайды презентации как изображения в формате JPEG. И подключаете их в слайдере на сайте. Причем слайдер можно использовать абсолютно любой.

Сохраняем слайды из презентации Power Point

Сохраняем все слайды Power Point в картинки (Файл – Сохранить как – Рисунок в формате JPEG – Все слайды).

На выходе получится папка с изображениями слайдов презентации. Чтобы не было проблем с кодировкой сразу переименуйте папку в presentation1, а слайды  в 1.jpg, 2.jpg и т.д. (без кириллицы)

Подключаем слайды презентации на сайт

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

Подключаем слайдер на веб страницу. Я буду подключать слайдер Galleria.

Для этого вставляем следующий html-код в страницу

<div class="galleria">
   <!--slides-->
   <img src="http://site.ru/presentation1/1.jpg">
   <img src="http://site.ru/presentation1/2.jpg">
   <img src="http://site.ru/presentation1/3.jpg">
   <img src="http://site.ru/presentation1/4.jpg">
   <img src="http://site.ru/presentation1/5.jpg">
   <img src="http://site.ru/presentation1/6.jpg">
   <img src="http://site.ru/presentation1/7.jpg">
   <!--/slides-->
</div>
    
<style>
   .galleria{ width: 100%; height: 400px; background: #000 }
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/galleria/1.5.7/galleria.min.js"></script>
<script>
   (function() {
      Galleria.loadTheme('https://cdnjs.cloudflare.com/ajax/libs/galleria/1.5.7/themes/classic/galleria.classic.min.js');
      Galleria.run('.galleria');
   }());
</script>

Здесь нужно поменять только пути к вашим изображениям <img src="путь к изображению слайда">. Количество тегов <img> оставляйте, сколько вам нужно.

ДЕМО:

907 15.10.2019 г. Для сайтов ОУ

Практический видеокурс по созданию электронного учебника в программе TurboSite

Хочешь научиться создавать адаптивные электронные пособия всего за 1 день?

Узнать подробнее

Комментарии (0)