Jedna od ekskluzivnih odredišnih stranica koju mnogi pružaju svojim pretplatnicima tijekom razdoblja Cyber ​​​​Mondaya je odredišna stranica za izdanje fantastičnog softvera. Ovaj izgled sadrži sjajne ilustracije i jedinstvenu upotrebu razdjelnika odjeljaka koji će oduševiti čitatelje. posjetitelji.

cyber ponedjeljak.jpg

Kako dobiti ekskluzivni softver Cyber ​​Monday objavljuje odredišnu stranicu

Prije nego što uskočite u ovu upotrebu, trebali biste se upoznati s ekskluzivnom odredišnom stranicom Cyber ​​Monday, koju možete dobiti tako što ćete postati novi član Elegant Themesa, nadograditi svoj postojeći račun ili već biti doživotni član. s nama. Ako ste već doživotni član, možete se prijaviti u naše područje za članove i ovdje preuzeti sve naše ekskluzivne stranice. Svi ostali korisnici morat će upotrijebiti donji gumb za kupnju ili nadogradnju prije nego što mogu dovršiti ostatak našeg vodiča.

Već ste životni član? Paket možete preuzeti sada, nema potrebe za sudjelovanjem u dogovoru o Cyber ​​ponedjeljku!

Kako stvoriti kontekstualni demo video na Divi

Nakon preuzimanja nove softverske verzije odredišne ​​stranice iz područja naših članova možete nastaviti čitati dalje.

U slučaju korištenja ovog vodiča, pokazat ćemo vam kako stvoriti video demo klikom na gumb. Video koji se pojavi na klik izgledat će sjajno na desktopu i malim ekranima. Ovo je sjajan pristup ako ne želite uključiti video izravno na svoju stranicu, već želite stvoriti interakciju s njim posjetitelji.

pregled

Prije nego što uđemo u tutorial, pogledajmo krajnji rezultat u različitim veličinama zaslona.

Biro

konačni rezultat divi video popup.gif

Mobilni

rezultat mobilni video popup divi.gif

Krenimo!

Koristite besplatni dodatak Video PopUp

Instalirajte i aktivirajte dodatak

Prvo što trebate učiniti je preuzeti uključiti besplatno PopUp Video . Ovaj dodatak možete pronaći na svom web stranica WordPress > Dodaci > Dodaj novo > Traži 'Video PopUp'. Jednom kada pronađete ovaj dodatak, instalirajte ga. Kada završite, aktivirajte dodatak.

video popup.jpg

Postavke dodataka

Nastavite tako da idete do općih postavki ovog dodatka i aktivirate dvije mogućnosti na vrhu.

konfiguracija video popup.jpg

Dodajte novu stranicu pomoću odredišne ​​stranice verzije softvera

Dodajte novu stranicu i aktivirajte se koristeći Visual Builder

Vrijeme je da počnemo stvari provoditi u praksi! Dodajte novu stranicu, dajte svojoj stranici naslov i odmah aktivirajte Visual Builder.

stvorite novu stranicu divi.jpg

Preuzmite izgled softverske verzije iz spremljenih izgleda

Idite na "Spremljeni izgledi" i preuzmite odredišnu stranicu koju ste prenijeli.

preuzeti izgled divi.jpg

Dodajte tekstualni modul ispod modula Blurb na gumbu za reprodukciju

Kao što vidite, stranica već ima gumb za reprodukciju koji će nam pomoći da postignemo željeni rezultat. Ali da bi ovo uspjelo, moramo ponovno stvoriti dizajn u modulu Blurb pomoću tekstualnog modula. Dodajte novi tekstualni modul odmah ispod modula Blurb.

dodajte tekst iznad modula blurb.jpg

Dodajte sliku u područje sadržaja

Nakon što dodate tekstualni modul, dodajte sliku gumba za reprodukciju u područje sadržaja tekstualnog modula klikom na " Dodajte medij »I odabir gumba za reprodukciju iz vaše medijske biblioteke.

Dodajte medij modulu zamućenja divi.jpg

odaberite sliku divi.jpg

Dodajte kopiju na mjesto sa sadržajem

Nastavite dodavanjem kopije odmah ispod slike.

duplikat blurb.jpg modul

Postavke teksta

Da bi modul odgovarao izgledu, omogućit ćemo središnju orijentaciju teksta u postavkama teksta modula.

omogućiti središnju orijentaciju.jpg

Zadane postavke teksta veze

I također ćemo u skladu s tim promijeniti postavke teksta veze:

  • Link font: Cabin
  • Težina poveznice: podebljana
  • Boja teksta veze: rgba (162,176,193,0.7)
  • Veličina teksta veze: 17px
  • Visina linija: 1.6em

Dizajn izbornik link divi.jpg

Zadržite pokazivač miša iznad postavki teksta

Promijenite boju teksta veze prilikom zadržavanja miša iznad miša.

  • Boja teksta veze: # a2b0c1

promijenite boju veze divi.jpg

razmak

Na kraju dodajte i negativni gornji rub u tekstualni modul.

  • Top marign: -20vw

postavi gornju maržu divi.jpg

Dodajte kontekstualno čitanje sadržaju tekstualnog modula

Prebacite se na uređivač teksta

Da bismo stvorili skočni prozor na klik, morat ćemo dodati prilagođenu vezu na sadržaj tekstualnog modula. Vratite se na područje sadržaja modula teksta i odaberite način uređivanja teksta.

izmijenite tekstualni modul u načinu za uređivanje teksta divi.jpg

Dodajte vezu na sav sadržaj

Povežite mjesto sa sadržajem na skočni prozor dodavanjem veze na sliku i kopiju. Obavezno zamijenite URL veze svojim.

<a class="vp-s vp-yt-type" href="https://www.youtube.com/watch?v=zesTKCnvyAU" data-dwrap="1"></a>

dodajte vezu sliku s video divi.jpg

Ukloni modul Blurb s gumba za reprodukciju

Sad kad smo stvorili tekstualni mod koji izgleda potpuno isto kao i mod Blurb, možemo ukloniti modul Blurb koji je postojao prije i to je to! Ovu metodu možete primijeniti na bilo koju vrstu izgleda koji upotrebljavate, ali to je stvarno velika dodana vrijednost za odredišnu stranicu verzije softvera.

uklonite neiskorišteni modul zamućenja divi.jpg

Završne misli

Kao što vidite, dodavanje skočnog prozora na Divi pomoću Video Popup dodatka prilično je jednostavno. To će vam omogućiti predstavljanje videozapisa na blog bez potrebe za automatskom integracijom u sadržaj.