Как сделать видео на фоне в магазине сервера

[kill nova]

Приветствую, недавно увидел магазин, на заднем фоне которого воспроизводилось видео, захотел сделать себе так же, и поделится с вами.
Для того что бы нам сделать такой фон, нам нужно сначала создать магазин в сервисе: gamestores.ru
После того как мы создали магазин, нам нужно перейти в настройки нашего магазина, после во внешний вид, и там выбрать вкладку виджеты.
Там нам нужно создать пользовательский виджет и вписать в него следующие:

<video loop="true" muted="true" autoplay="true" playsinline="true" style="width: 100%; position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: -1;"><source src="https://files.facepunch.com/s/rust/f14016" type="video/mp4"></video>

Приведу пример, создал новый чистый магазин, в котором нет товаров:
server-rustt.gamestores.ru

кому нужны будут еще фоновые видео, обращайтесь, скину.
(нет скринов из за того что я нуб по написанию тем на этом сайте, простите)

 

[darkcote]

Поставил бы луцк,но пока не могу.Взял себе на заметку.

 

[Svinger]

добавлю в тему магазина - как добавить виджет-кнопку или кликабельную картинку
- заходим в добавление виджетов, создаем новый
- в поле HTML копируем код

<div class="xbox">
<center><a href="здесь ссылка (например ваш вк/сайт) - куда вас перебросит при нажатии"><img src="ссылка на картинку" width="262"
   height="70" alt="текст, если картинка не загрузится/не поставите"></a></center>
</div>

вот как это выглядит

 

[kill nova]

добавлю в тему магазина - как добавить виджет-кнопку или кликабельную картинку
- заходим в добавление виджетов, создаем новый
- в поле HTML копируем код

<div class="xbox">
<center><a href="здесь ссылка (например ваш вк/сайт) - куда вас перебросит при нажатии"><img src="ссылка на картинку" width="262"
   height="70" alt="текст, если картинка не загрузится/не поставите"></a></center>
</div>

вот как это выглядит

возьму на вооружение

 

[Басотник]

Нужно будет поменять)

 

[kill nova]

Нужно будет поменять)

в коде я скинул видеоролик с сайта раста, там не сложно поискать на форуме еще интересные видео

 

[Басотник]

в коде я скинул видеоролик с сайта раста, там не сложно поискать на форуме еще интересные видео

Ютуб подойдет?

 

[kill nova]

Ютуб подойдет?

нет, сам хотел закинуть ютуб, но не работает, работать будет если закинуть на свой сайт

 

[kill nova]

Ютуб подойдет?

возможно я допустил ошибку, сейчас еще раз попробую

 

[kill nova]

Ютуб подойдет?

эх, не работает, если найду способ отпишу

 

[FREDWAY]

Очень неплохо даже, благодарю

 

[kill nova]

не за что

Очень неплохо даже, благодарю

 

[SysBlack]

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

<video loop="true" muted="true" autoplay="true" playsinline="true" style="width: 100%; position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: -1;"><source src="http://sysblack.ru/rust.mp4" type="video/mp4"></video>

Ну и сайт с примером ТУТ

 

[kill nova]

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

<video loop="true" muted="true" autoplay="true" playsinline="true" style="width: 100%; position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: -1;"><source src="http://sysblack.ru/rust.mp4" type="video/mp4"></video>

Ну и сайт с примером ТУТ

Спасибо, думаю сегодня наснимаю немного красивых пролёток, и выложу сюда

 

[Gunu4]

Благодарю)

 

[Anatoly Piratov]

А как сделать прозрачный фон на магазине OVH+картинку запилить?

 

[Anatoly Piratov]

Нашёл решение. На OVH спросил. скинули настройку

 

[Fartus]

@kill nova, прикольно, спасибо за инфу!

 

[Alirt]

Большое спасибо за инфу,только учусь все это делать,поэтому лично для меня очень интересно,полезно и информативно)

 

[BeDLaM]

Кто знает, как исправить неработающий скроллбар в браузере при включенном виджете видео на фоне? Колесом мыши он проматывается а курсором не таскается вверх-вниз. Код виджета оригинальный с первого поста этой темы.