ВК-дан бейнені веб-сайтқа қалай ендіруге болады

ВКонтакте веб-сайтыңызға қосуға болатын көптеген бейнелерді қамтиды. Бұл мақалада біз ВКонтакте сайтынан веб-сайт бетіне бейне кірістірудің бірнеше жолдарын қарастырамыз.

Кодты пайдаланып қойыңыз

ВКонтакте желісіндегі бейне бетіне өтіңіз

Ойнатқыштың астындағы «Қосымша» сілтемесін басып, «Экспорттау» тармағын таңдаңыз.

Пайда болған терезеде кодты <iframe> тегімен көшіріңіз. Қажет болса, бейне өлшемін таңдай аласыз (опциялардың бірі немесе ерікті параметрлерді көрсетіңіз) және автоматты ойнатуды қосуға болады (әдепкі бойынша ол өшірілген, ойнату терезені басу арқылы басталады).

Содан кейін кодты html құжатының ішіне дұрыс жерге қойыңыз.

 

Осыдан кейін бейне бетте пайда болады

Әдепкі параметрлер аз болса, мұны қолмен жасауға болады.

Iframe тегіне қосуға болатын кейбір атрибуттарды қарастырайық:

  • frameborder – Ойнатқыштың айналасында жиекті көрсету немесе көрсетпеу керектігін орнатады.
  • allow мағынасымен:
    • autoplay – Бейне және аудио файлдарды автоматты түрде ойнатуға мүмкіндік береді
    • fullscreen – Енгізілген мазмұнды толық экранда ашуға мүмкіндік береді.
  • marginheight – мазмұннан жақтаудың шекарасына дейін үстіңгі және төменгі жағындағы толтыру.
  • marginwidth – мазмұннан жақтаудың шекарасына дейін солға және оңға толтыру.
  • hspace – жақтаудан қоршаған мазмұнға дейінгі көлденең шет
  • vspace – жақтаудан қоршаған мазмұнға дейінгі тік қашықтық.

Ойнатқыштың көрінісін өзгерту үшін стиль төлсипатын қосыңыз және мәнерлерді кілт ретінде тізімдеңіз: мән жұбы. Мысалы, бейнемізге жақтау қосып, түсін өзгертіп, шеттерін дөңгелектеп, көлеңке орнатайық. Аяқталған код келесідей көрінеді:

<iframe src="https://vk.com/video_ext.php?oid=-178652725&id=456239064&hd=2" width="853" height="480" allow="autoplay; encrypted-media; fullscreen; picture-in-picture;" frameborder="0" allowfullscreen style="border: 5px solid #df0da8;border-radius: 30px;box-shadow: -15px 15px 20px 0px rgba(3, 195, 0, 0.6);"></iframe>

Міне, нәтиже:

CMS ішіне енгізу

Егер сайт кез келген мазмұнды басқару жүйесінде (CMS) жұмыс істесе, стандартты құралдар да тұрақты кірістіру үшін жарамды. Мысалы, WordPress-те «Custom HTML» блогын пайдалану мүмкіндігі бар.

Ол үшін қажетті бейнені тауып, жоғарыдағы нұсқаулардағыдай кодты <iframe> тегімен көшіріңіз.

Аяқтағаннан кейін WordPress-ке оралыңыз және жазбаны өңдеу бетін ашыңыз.

Жаңа блок қосу үшін жоғарғы сол жақ бұрыштағы «+» түймесін басыңыз.

Блокты таңдау мәзірі ашылады. Іздеу жолағына «Custom HTML» енгізіп, сәйкес блокты таңдаңыз.

 

Көшірілген кадр кодын «HTML жазу...» өрісіне қойыңыз.

 

Жазбаны жариялаңыз, содан кейін бейне сайтта пайда болады.

Стандартты құралдардан басқа, WordPress-те плагиндер кітапханасы бар, соның ішінде бейнемен жұмыс істеуге арналған. Олар қосудың келесі жолдарын ұсынады: компьютерден, тікелей сілтеме арқылы немесе қысқа код арқылы жүктеп салу.

Міне, олардың бірнешеуі:

  • Жеңіл бейне ойнатқыш,
  • Videojs HTML5 ойнатқышы,
  • Соңғы бейне ойнатқышы,
  • HTML5 бейне ойнатқышы.

Бұл әдістер сіздің веб-сайтыңызға ВК-дан бейнені ендіруге мүмкіндік береді. Бірақ оларды пайдалану кезінде кодты қолмен өңдеу және бетті жаңарту қажет болуы мүмкін екенін ескерген жөн. Бірақ өзгертулер автоматты түрде қолданылатын шешім қажет болса, Qform бейне виджеті қолайлы. Оның көмегімен бетке бейнені бірнеше рет басу арқылы қосуға, дисплей түрлерінің бірін таңдауға және іске қосу параметрлерін конфигурациялауға болады.