Nedavno nas je jedan od naših čitatelja pitao kako dodati paralaksni efekt bilo kojoj WordPress temi?
Učinak Parallax popularan je trend danas na webu gdje se pozadinska slika sporije pomiče od sadržaja u prvom planu.
U ovom uputstvu pokazat ćemo vam kako lako dodati paralaksni efekt bilo kojoj WordPress temi.
Ali, ako nikad niste instalirali WordPress, otkrijte Kako instalirati 7 korake WordPress blog et Kako pronaći, instalirati i aktivirati WordPress temu na svoj blog
Ali, vratimo se zašto smo ovdje.
Što je efekt paralaksa?
Parallax Effect je moderna tehnika web dizajna gdje se pozadinski element pomiče sporije od sadržaja u prvom planu. Ovaj efekt dodaje dubinu pozadinskim slikama i čini ih interaktivnim.
Otkrijte naše 25 WordPress teme s paralakse za stvaranje web stranice
Parallax efekt se može koristiti na odredišne stranice, prodajne stranice ili početnu stranicu poslovnog web mjesta. To je sjajan način da istaknete različite odjeljke na dugoj stranici.
Mnogi premium WordPress teme imaju ugrađeni paralaksni učinak na svojoj početnoj stranici. Učinak paralakse možete koristiti i kod većine dodataka WordPress vizualno stvaranje stranica.
Međutim, sve WordPress teme ne nudi ugrađeni efekt paralakse i možda ne biste željeli koristiti alat za izradu vizualnih stranica samo za efekt paralakse.
Pogledajmo kako lako dodati efekt paralaksa u bilo koju WordPress temu.
1. metoda: Dodajte paralaksni efekt bilo kojoj WordPress temi pomoću dodatka
Ova metoda ne zahtijeva dodavanje bilo kojeg koda u vašu WordPress temu. Jednostavnije je i preporučljivo za većinu korisnika.
Prvo što trebate učiniti je instalirati i aktivirati dodatak Napredne WordPress pozadine, Za više detalja, potražite naš korak po korak vodič kako instalirati WordPress dodatak.
Nakon aktiviranja dodatka, morate urediti stranicu na koju želite dodati efekt paralakse. Primijetit ćete novi gumb "Napredne WordPress pozadine»Na alatnoj traci vizualnog uređivača.
Klikom na njega otvorit će se skočni prozor u kojem možete promijeniti razne pozadinske postavke koje želite dodati.
Prije svega, trebate odabrati sliku kao pozadinu, a zatim označiti opciju " Rastegnuti".
Tada morate kliknuti na gumb Odaberite Slika Za preuzimanje ili odabir slike koju želite koristiti. Obavezno upotrijebite veliku sliku jer će se u protivnom prikazati pikselirano.
Nakon toga, morate aktivirati učinak Paralaksa Odabirom vrste efekta paralaksa. Dostupni su brojni stilovi s kojima možete eksperimentirati. Najčešći korišteni efekt paralakse je pomicanje.
Kliknite na gumb umetak za nastavak.
Dodatak će dodati a kratki kôd na vašem objavljivanje urednik, Izgledat će ovako:
[Nk_awb awb_type = "slika" awb_stretch = "true" awb_image = "22" awb_image_size = "pune" awb_parallax = "pomicanje" awb_parallax_speed = "0.5" awb_mouse_parallax = "true" awb_mouse_parallax_size = "30" awb_mouse_parallax_speed = "10000"] Vaš sadržaj ovdje [/ nk_awb]
Zamijeni " ovaj sadržaj Prema vlastitom sadržaju, a zatim spremite svoju stranicu.
Možete posjetiti vašu web stranicu kako biste je vidjeli u akciji.
Metoda 2: Dodajte efekt "Parallax" bilo kojoj WordPress temi s CSS-om
Ova metoda zahtijeva da imate neko znanje o "HTML / CSS" kao i o tome kako rade WordPress teme i dodaci.
Prvo trebate prenijeti u svoju WordPress medijsku biblioteku, sliku koju želite koristiti za efekt paralaksa posjetom " mediji> Dodaj novo ".
Idite dalje otkrivanjem Kako organizirati medije na vaš WordPress blog
Nakon prijenosa slike trebate kopirati URL slike uređivanjem slike u WordPress medijskoj knjižnici.
Zatim morate dodati sljedeći HTML kôd na stranicu na kojoj želite prikazati efekt paralakse. Ovaj HTML kôd možete dodati i na svoj WordPress tema ili tema vašeg djeteta.
div class = "paralaksa"> Vaš sadržaj ovdje ...
Zatim morate dodati sljedeći prilagođeni CSS kôd vašoj WordPress temi.
.parallax {background-image: url ("http://example.com/wp-content/uploads/2017/08/my-background-image.jpg"); visina: 100%; background-attachment: fiksno; Pozadina: centar; pozadina ponoviti: ne-ponoviti; pozadina veličine: pokriti; margin lijevi: -410px; margin-right: -410px; } .parallax-sadržaj {širina: 50%; margina: 0 auto; boja: #fff; padding-top: 50px; }
Ne zaboravite zamijeniti URL pozadinske slike vlastitom slikom.
Sada možete spremiti svoje promjene i posjetiti svoju web stranicu.
Ovdje je ! Sada možete dodati efekt paralaksa na svoju web stranicu WordPress.
Otkrijte i neke teme i premium WordPress dodatke
Možete koristiti druge WordPress plugins dati moderan izgled i optimizirati rukovanje vašim blogom ili web stranicom.
Ovdje vam nudimo nekoliko premium WordPress dodataka koji će vam pomoći u tome.
1. Donacija WooCommercea
Prihvatite putem ovog proširenja donacije na svojoj web stranici WooCommerce s iznosima koje odrede kupci. Moći će dati koliko žele. Svaka donacija može se predstaviti kao i svaki uobičajeni proizvod WooCommerce.
Ako kupac preskoči stranicu s košaricom ili prijeđe izravno na blagajnu bez doniranja, pojavit će se veza iznad stranice za naplatu kako bi mogao donirati.
Svaki korak korištenja WooCommerce donacije objašnjen je u dokumentaciji sa snimkama zaslona. Samo aktivirajte dodatak i na košarici ćete pronaći polje "Dodaj donaciju".
Preuzmite | demo | Web hosting
2. LinkedIn More
LinkedIn Plus je WordPress plugin koji vam omogućuje da svoj LinkedIn profil predstavite na svom blogu. Također radi za blogove s više autora. Dodaje gumbe za praćenje i dijeljenje vašim WordPress postovima, stranicama ili widgetima.
To je sjajan način da dodate sve LinkedIn značajke na svoj blog i potvrdite svoju marku kod potrošača. Omogućuje vam prilagodbu izgleda, konfiguriranje postavki i aktiviranje drugih naprednih opcija za promociju vašeg profila potencijalnim regrutima ili poslodavcima.
Preuzmite | demo | Web hosting
3. YouTubea
YouTubeR je a WordPress plugin jedinstvena platforma koja vam omogućuje učitavanje videozapisa na YouTube s vaše web stranice i jednostavno ugrađivanje YouTube videozapisa, popisa za reprodukciju i kanala na vašu web stranicu.
Pomoću ovog dodatka imate mogućnost stvaranja izvanrednih video galerija na vašoj web stranici.
Ostale su mu značajke: mogućnost lako prenesite videozapise na YouTube s vašeg WordPress web mjesta, integracija jednostavni videozapisi, popisi za reprodukciju i YouTube kanali na vašu web stranicu, podrška za Visual Composer, beskonačno pomicanje popisa za reprodukciju, odličan predmemoriranje, prilagodljiv izgled, detaljna dokumentacija i još mnogo toga.
Preuzmite | demo | Web hosting
Preporučeni resursi
Saznajte više o drugim preporučenim resursima koji će vam pomoći u izgradnji i upravljanju web mjesta.
- Kako ispraviti pogrešku "Ne mogu zapisati na disk" na WordPressu
- Kako postati uspješan bloger i zaraditi novac WordPressom
- Kako objavljivati svoje članke putem e-pošte na WordPress
- Kako postati uspješan bloger i zaraditi novac WordPressom
Zaključak
To je sve! Nadamo se da je to bilo od velike pomoći. Ne ustručavajte se dijelite sa svojim prijateljima na svojim omiljenim društvenim mrežama.
Međutim, također ćete moći konzultirati naše sredstva, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress.
A ako imate prijedloge ili primjedbe, ostavite ih u našem odjeljku Komentari.
...
