Kohët e fundit një nga lexuesit tanë na pyeti se si të shtojmë efekt paralaks në ndonjë temë WordPress?

Efekti Parallax është një trend i njohur këto ditë në internet ku një imazh sfond lëviz më ngadalë sesa përmbajtja e planit të parë.

Në këtë manual, ne do t'ju tregojmë se si të shtoni lehtësisht efekt paralaks në çdo temë të WordPress.

Por, nëse nuk keni instaluar kurrë WordPress, zbuloni Si të instaloj një WordPress blog hapa 7 et Si të kërkoni, instaloni dhe aktivizoni një temë WordPress në blogun tuaj 

Por përsëri pse ne jemi këtu.

Si të shtoni efekt paralaks në çdo temë wordpress e1567702269161

Çfarë është efekti paralaks?

Efekti Parallax është një teknikë moderne e dizajnimit të uebit ku elementi i sfondit lëviz më ngadalë sesa përmbajtja e planit të parë. Ky efekt shton thellësi në imazhet e sfondit dhe i bën ato interaktive.

Zbuloni tonë Temat 25 WordPress me parallax për të krijuar një faqe interneti

Efekti Paralaks mund të përdoret në faqet ulje, faqet e shitjeve ose faqja kryesore e një uebfaqe biznesi. Shtë një mënyrë e shkëlqyeshme për të nxjerrë në pah seksione të ndryshme në një faqe të gjatë.

shumë Temat premium WordPress kanë një efekt paralaks të integruar në faqen e tyre kryesore. Ju gjithashtu mund të përdorni efektin paralaks me shumicën e shtojcave WordPress krijimi vizual i faqeve.

Megjithatë, të gjitha Temat e WordPress nuk ofron një efekt të integruar paralaks dhe mund të mos dëshironi të përdorni një ndërtues faqesh vizuale vetëm për një efekt paralaks.

Le të hedhim një vështrim se si ta shtojmë me lehtësi efektin paralaks në çdo temë WordPress.

Metoda 1: Shtoni efektin paralaks në çdo temë WordPress duke përdorur një shtojcë

Kjo metodë nuk kërkon shtimin e ndonjë kodi në temën tuaj WordPress. Easiershtë më e lehtë dhe e rekomanduar për shumicën e përdoruesve.

Gjëja e parë që duhet të bëni është të instaloni dhe aktivizoni plugin Sfondet e Avancuara të WordPress. Për më shumë detaje, shikoni udhëzuesin tonë hap pas hapi se si të instaloni një plugin WordPress.

Pas aktivizimit të shtojcës, duhet të redaktoni faqen ku dëshironi të shtoni efektin paralaks. Do të vëreni butonin e ri "Sfondet e Avancuara të WordPress»Në shiritin e veglave të redaktuesit vizual.

Shto sfond të përparuar të shtypit

Klikimi mbi të do të sjellë një dritare që shfaqet ku mund të ndryshoni cilësime të ndryshme të sfondit që dëshironi të shtoni.

Para së gjithash, duhet të zgjidhni një imazh si sfond dhe pastaj të kontrolloni opsionin " Zgjas'.

Sfond i përparuar i dritares së shtypit

Pastaj ju duhet të klikoni në butonin Zgjidhni Image Për të shkarkuar ose zgjedhur një imazh që dëshironi të përdorni. Sigurohuni që të përdorni një imazh të madh përndryshe ai do të shfaqet i pixelated.

Pas kësaj, ju duhet të aktivizoni efektin paralaks Duke zgjedhur një lloj efekti paralaks. Ka një numër stilesh të disponueshëm me të cilët mund të eksperimentoni. Efekti më i zakonshëm paralaks i përdorur është lëvizja.

Klikoni butonin Fut për të vazhduar.

Shtojca do të shtojë një shortcode në tuaj Botime Editor. Do të duket kështu:

[nk_awb awb_type = "image" awb_stretch = "true" awb_image = "22" awb_image_size = "full" awb_parallax = "scroll" awb_parallax_speed = "0.5" awb_mouse_parallax = "true" x këtu [/ nk_awb]

Zëvendëso " kjo përmbajtje Nga përmbajtja juaj, atëherë ruani faqen tuaj.

Ju mund të vizitoni faqen tuaj të internetit për ta parë atë në veprim.

Efekt paralaksi në shtypMetoda 2: Shtoni efektin "Parallax" në çdo temë WordPress me CSS

Kjo metodë kërkon që ju të keni disa njohuri për "HTML / CSS" si dhe si funksionojnë temat dhe shtojcat e WordPress.

Së pari, duhet të ngarkoni në bibliotekën tuaj mediatike WordPress, imazhin që dëshironi të përdorni për efektin paralaks duke vizituar " media> Shto të reja '.

Shkoni më tej duke zbuluar Si të organizoni mediat në blogun tuaj WordPress

Pas ngarkimit të imazhit, duhet të kopjoni url-në e imazhit duke redaktuar imazhin në bibliotekën e mediave WordPress.

Kopjoni url-në e imazhit në wordpress

Pastaj duhet të shtoni kodin HTML të mëposhtëm në faqen ku dëshironi të shfaqni efektin paralaks. Ju gjithashtu mund ta shtoni këtë kod HTML në tuaj Tema e WordPress ose tema e fëmijës suaj.

div klasi = "paralaksi"> Përmbajtja juaj këtu ...

Atëherë duhet të shtoni kodin e mëposhtëm të personalizuar CSS në temën tuaj të WordPress.

.parallax {background-image: url ("http://example.com/wp-content/uploads/2017/08/my-background-image.jpg"); lartësia: 100%; background-attachment: fikse; background-position: qendra; sfond-përsëritje: jo-përsëritje; background-size: mbuluar; margin-left: -410px; diferencë-drejtë: -410px; } .parallax-content {width: 50%; diferencë: 0 auto; Ngjyra: #FFF; mbushje-lart: 50px; }

Mos harroni të zëvendësoni URL-në e imazhit të sfondit me imazhin tuaj.

Tani mund të ruani ndryshimet tuaja dhe të vizitoni faqen tuaj të internetit.

Shembull i efektit paralaks WordPress

Ketu eshte ! Tani mund të shtoni efektin paralaks në faqen tuaj të internetit WordPress.

Zbuloni gjithashtu disa tema dhe shtesa premium WordPress  

Mund të përdorni të tjera WordPress plugins për të dhënë një pamje moderne dhe për të optimizuar trajtimin e blogut ose faqes tuaj të internetit.

Ne ju ofrojmë këtu disa shtesa premium WordPress që do t'ju ndihmojnë ta bëni atë.

1. Donacion WooCommerce

Pranoni përmes kësaj shtese donacionet në faqen tuaj të internetit WooCommerce me shumat e specifikuara nga klientët. Kjo do t'i lejojë ata të japin sa të duan. Eachdo dhurim mund të paraqitet si çdo produkt i zakonshëm i WooCommerce


Shtojca e dhurimit të Woocommerce

Nëse klienti kalon faqen e karrocës ose shkon direkt në arkë pa dhuruar, një lidhje do të shfaqet mbi faqen e arkë në mënyrë që të mund të dhurojë.

Çdo hap i përdorimit të Dhurimit WooCommerce shpjegohet në një dokumentacion me screenshots. Vetëm aktivizoni shtojcën dhe do të gjeni fushën e "Shto dhurim" në karrocë.

Shkarko | DEMO web hosting

2. LinkedIn Më shumë

LinkedIn Plus është një plugin WordPress e cila ju lejon të prezantoni profilin tuaj në LinkedIn në blogun tuaj. Gjithashtu funksionon për blogjet me shumë autorë. Ai shton butonat Follow and Share në postimet, faqet ose miniaplikacionet tuaja të WordPress.Linkedin plus LinkedIn wordpress plugin

Shtë një mënyrë e shkëlqyeshme për të shtuar të gjitha tiparet e LinkedIn në blogun tuaj dhe për të vërtetuar markën tuaj me konsumatorët. Ju jep mundësinë të personalizoni pamjen e saj, të konfiguroni cilësimet dhe të aktivizoni opsione të tjera të përparuara për të promovuar profilin tuaj tek rekrutuesit ose punëdhënësit e mundshëm. 

Shkarko | DEMO | web hosting

3. YouTuber

YouTubeR është një plugin WordPress platformë unike, e cila ju lejon të ngarkoni video në YouTube nga faqja juaj e internetit dhe të futni lehtësisht videot, listat e luajtjes dhe kanalet e YouTube në faqen tuaj të internetit.

Shtojcë wordpress Youtuber youtube

Me këtë shtojcë, ju keni mundësinë për të krijuar galeri video të jashtëzakonshme në faqen tuaj të internetit.

Karakteristikat e tjera të saj janë: mundësia e lehtë ngarkoni video në YouTube nga faqja juaj e internetit WordPress, integrimi video të lehta, listat për luajtje dhe kanalet YouTube në faqen tuaj të internetit, mbështetje për Visual Composer, scrolling pafund në listat e dëgjimit, caching të shkëlqyera, paraqitjen e përgjegjshme, dokumentacion i detajuar dhe më shumë.

Shkarko | DEMO | web hosting

Burimet e rekomanduara

Mësoni rreth burimeve të tjera të rekomanduara për t'ju ndihmuar të ndërtoni dhe menaxhoni uebfaqen tuaj.

Përfundim

Kjo është e gjitha! Shpresojmë të ketë qenë një ndihmë e madhe. Mos hezitoni të ndajeni me miqtë tuaj në rrjetet tuaja të preferuara sociale

Megjithatë, gjithashtu do të jeni në gjendje të konsultoheni me ne RESSOURCES, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress.

Dhe nëse keni ndonjë sugjerim ose vërejtje, lërini ato në seksionin tonë komente.

...