Nedavno nas je jedan od naših čitatelja koji nisu imali Pro verziju Elementara izazvao kako može dodati prilagođeni CSS na svoju web stranicu.

Budući da je problem malo složeniji, mislili smo da bi se nekoliko korisnika moglo suočiti s tim problemom. Stoga smo odlučili pružiti detaljan članak o tome kako doći.

U ovom ćemo vam članku pokazati kako lako dodati prilagođeni CSS na stranicu ili web mjesto Elementara.

Tri su načina dodavanja prilagođenog CSS-a na stranicu ili web mjesto Elementara:

  • Dodajte CSS kôd putem HTML elementa.
  • Putem dodatka Kôd isječka.
  • Korištenje Elementarovog prilagođavača tema

Metoda 1: Dodajte CSS kôd iz Elementorovog HTML elementa

Koristite ovu metodu ako želite dodati CSS samo na jednu stranicu.

Korak 1: Povucite i ispustite Elementor-ov HTML element

Ovaj HTML element možete smjestiti bilo gdje na stranici i on će sasvim dobro funkcionirati.

Korak 2: Kliknite ikonu Uredi HTML

Kliknite na ikonu Uredi html desno od elementa HTML elementa. Klikom na njega prikazat će se alatni okvir za uređivanje HTML-a na lijevoj strani zaslona.

Korak 3: Dodajte svoj CSS kôd

  1. Kliknite karticu Sadržaj i otvorite padajući popis HTML kod.
  2. Postavite svoj CSS kôd u svjetionici.

Metoda 2: Prilagođeni CSS za Elementor putem dodatka za isječke koda

Prednosti upotrebe dodatka Code Snippets:

  • Ako želite promijeniti ili ažurirati svoju WordPress temu, CSS će se uvijek primijeniti.
  • Ovo je najprikladniji i najučinkovitiji način dodavanja CSS koda jer možete omogućiti ili onemogućiti CSS kôd poput dodataka.

1. korak: Otvorite izbornik proširenja na nadzornoj ploči

Korak 2: Dodajte novi dodatak

Kliknite na gumb Dodaj On »Za pristup stranici za dodavanje novih dodataka.

  1. Potražite dodatak " Isječci koda ".
  2. Instalirajte ga klikom na gumb sada instalirati nakon što rezultati istraživanja budu pozitivni.

Korak 3: Aktivirajte dodatak

Prilagođeni CSS u Elementoru

Kliknite na gumb aktivirati »Nakon završetka instalacije za aktiviranje dodatka Isječci koda.

Korak 4: Otvorite stranicu dodatka i dodajte isječak koda

  1. Otvorite izbornik izvadci s vaše nadzorne ploče
  2. Kliknite na gumb Nouveau za dodavanje novog isječka koda

Korak 5: Stvorite isječak i aktivirajte ga

  1. Dajte imenu svoj isječak koda.
  2. Unutar oznake napišite svoj kod. Ovaj je kod dostupan u nastavku za kopiranje.
  3. Kliknite na gumb Spremi izmjene Da biste spremili isječak koda.
  4. Nakon spremanja CSS-a, kliknite na " aktivirati Za aktiviranje CSS koda.

Kopirajte kod

add_action( 'wp_head', function () { ?>
<style>
//VOTRE CODE ICI
</style>
<?php } );

3. metoda: Upotrijebite element za prilagođavanje teme Elementor

Napomena: Budite oprezni prije upotrebe ove metode jer ako promijenite temu izgubit ćete ovaj prilagođeni CSS.

Korak 1: Otvorite alat za prilagodbu teme

Prilagođeni CSS u Elementoru

Idite na svoje web mjesto i kliknite opciju prilagodbe na gornjoj navigacijskoj traci. Ovo će otvoriti prozor za prilagodbu teme.

Korak 2: Kliknite dodatnu karticu CSS


Ovo će otvoriti CSS ulaznu stranicu.

Korak 3: Dodajte svoj CSS kôd

Prilagođeni CSS u Elementoru

Dobro ! Sada znate kako jednostavno dodati prilagođeni CSS na stranicu ili web mjesto Elementor. To će dizajn jedinstvenih web stranica u Elementor Free učiniti fleksibilnijim.

Nabavite Elementor Pro odmah!

Otkrijte i neke 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. FileBird

Filebird

Jeste li se ikada mučili s upravljanjem tisućama datoteka slika, videozapisa ili dokumenata koje ste prenijeli na svoj WordPress FTP? da ili ne, nije važno, važno je znati da je WordPress plugin FileBird će vam pomoći upravljati vašim medijskim datotekama s lakoćom i donijeti više snage vašoj knjižnici.

Njegovo bešavno korisničko sučelje i kontekstni izbornik omogućuju korisnicima da povuku i ispuste datoteke u mape ili imaju potrebna prava za brzo stvaranje, preimenovanje ili brisanje mapa na isti način kao na računalu.

S ovim dodatkom u ruci, vaše će se medijske datoteke sustavno organizirati i lako možete odabrati sliku koju ćete umetnuti na stranicu ili je objaviti. Osim toga, ovaj je dodatak u potpunosti kompatibilan s najpopularnijim dodacima, posebno s WooCommerce, a također podržava veliki broj jezika.

Da biste saznali više, otkrijte Kako upravljati datotekama i mapama WordPress

Ako želite potaknuti snagu upravljanje svojom medijskom bibliotekomje WordPress plugin FileBird bi mogao biti vaše tajno oružje.

Preuzmitedemo | Web hosting

2. Ultimate WooCommerce proširive kategorije

Vrhunske woocommerce proširive kategorije

Ce WordPress plugin omogućuje vam jednostavnu izmjenu dugih popisa dosadnih WooCommerce kategorija i njihovu zamjenu različitim razinama podstavki u izborniku harmonike.

Glavne su mu funkcionalnosti: mogućnost aktiviranja i konačno da radi automatski (parametri nisu potrebni!), Podrška za više razina kategorija (kategorije, potkategorije itd.), Isticanje aktivna kategorija, otvaranje svih nadređenih kategorija ako je trenutna kategorija unutra, kompatibilnost s bilo kojom WooCommerce tema, odgovara na želju, besplatna ažuriranja i vrlo aktivna korisnička podrška.

Preuzmite | demo | Web hosting

3. WavePlayer

Kao što možete pogoditi iz naziva, WavePlayer je dodatak za audio player koji preuzima valni oblik reproducirane audio datoteke. Pomoću ovog dodatka moći ćete ugostiti pjesme ili ga jednostavno integrirati s drugim uslugama.gostovanje u oblaku, kao što je SoundCloud.

Waveplayer premium wordpress dodaci dodaju audio player

Također se može koristiti u svrhe podcastinga, a nudi i druge značajke kao što su: podrška za HTML5, responzivni izgled, integracija WooCommerce itd.

Moći ćete i vizualno stvoriti popis pjesama prije nego što ga objavite. Druga bitna značajka je brzina i učinkovitost.

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.

Zaključak

Ovdje! To je sve za ovaj vodič, nadamo se da će vam pomoći da besplatno dodate prilagođeni CSS u Elementor. 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.

Ako imate prijedloge ili primjedbe, ostavite ih u našem odjeljku Komentari.

...