Добавить видео на странице товара OpenCart 3 с Vimeo и YouTube

Здравствуйте!

Необходимо сделать доработку функционала сайта, чтобы было возможно добавлять видео с сервисов Vimeo и YouTube в карточку товара.  Движок сайта OpenCart 3 (ocStrore 3.0.3.7)

Необходимый функционал:

1. Чтобы добавить видео достаточно зайти в админку в редактирование карточки товара, где будет вкладка Видео на которой достаточно вставить ссылку на ролик.

Для вставки видео с YouTube cсылка будет иметь вид (пример):

https://www.youtube.com/watch?v=GZeYsVjVQSM

Для вставки видео с Vimeo cсылка будет иметь вид (пример):

https://vimeo.com/354633934

Выглядеть это должно примерно вот так:


Добавление видео происходит путем нажатия кнопки Добавить (+).  Появляется поле для ввода ссылки на видео, вводим ссылку, подгружает превью для видеоролика. Можно добавить неограниченное кол-во роликов. Но по опыту будет от 1 до 3-х. Для видеороликов можно задавать сортировку, какое идет первое, а какое идет второе.

2. Добавить все загруженные к товару видео в галерею на сайте, чтобы отображались после изображений. Также после слайдера галереи будет идти кнопка Видео, при клике на которую будет открываться вкладка Видео. Будет выглядеть вот так (В примере у товара 3 фото, а потом идет 1 видео):


3. В карточке товара на сайте будет отображаться вкладка Видео на которой будут отображаться все видео, которые добавлены к товару. И будет указываться кол-во видео (в данном примере 2).

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


Более детально отобразил на видео:

https://www.loom.com/share/2a8ddfcda4764e048cea89f17aa8744c

А также можно глянуть пример, как нужно сделать, на этом сайте:

https://comfy.ua/smartfon-samsung-galaxy-s21fe-8-256gb-light-violet-sm-g990blvgsek.html

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

6. Сайт адаптивный, потому на мобильных устройствах видео в карточке товара будет выглядеть так (не отображаем иконку Видео, а видео в галереи идут после фото, как и на декстопной версии).

Сайт использует тему ReMarket:

https://re-market.octemplates.net/apple-ru-3/iphone-ru/smartfon-apple-iphone-xi-violet-ru

Ссылку на сайт могу скинуть в личном сообщении. Предоставляются все необходимые иконки.

От себя могу добавить, что уже существуют скрипты, позволяющие получать от Vimeo и YouTube (имея ссылку на ролик) превью и все необходимые данные. Как пример вот ссылки на такие php скрипты:

https://shra.ru/2019/08/poluchenie-prevyu-kartinki-vimeo/

https://gist.github.com/cmsx/5539570

Бюджет обсуждается в личных сообщениях.