Det er litt vanskelig å bestemme hvordan Du Legger Til Ekstern CSS eller Javascript Til WordPress hvis Du bare er en nybegynner WP-bruker. Så før vi begynner å gi noen instruksjoner om å legge Til Ekstern CSS / Javascript på nettstedet ditt, vil jeg gjerne forklare de to hovedområdene der Du kanskje må bruke Ekstern CSS:
1) Nettstedstilpasninger
bruk av ekstern CSS og Javascript Er et godt valg når du tilpasser nettstedet ditt fordi du enkelt kan vedlikeholde koden, redigere og beholde filene og / eller kodene. Vi må imidlertid dele disse tilpasningene til to hovedtyper-mini tilpasninger og større tilpasninger. Jeg vil komme tilbake til disse typene senere og forklare hvilke måter Å legge CSS / JS koder vil være bedre for ulike situasjoner.
2) Tredjeparts Tjenesteintegrasjoner
som vi alle vet, gir NOEN av tjenestene CSS – og JS-filer som må legges til nettstedet ditt, Som Formtjenester, Chatbokser, legge Til Facebook-Pikselkode og Til Og Med Google Analytics. Som et eksempel støtter Vi Google Analytics, og faktisk er integrasjonsprosessen i Våre Temaalternativer veldig enkel og enkel, men hvis du vil spore noen forskjellige analyser og på en annen måte, må Du bruke de eksterne kodene som genereres Av Google.
3 Måter Å Legge Til Ekstern CSS / JavaScript
Ved Hjelp Av Temaalternativene
Hvis Du trenger å legge til andre koder eller legge til en rask OG liten CSS og Javascript for å tilpasse nettstedet ditt, Er Temaalternativer den mer hensiktsmessige løsningen. Det er en innebygd funksjon og er lett tilgjengelig Fra WordPress dashbordet.
Gå Til Jupiter > Temaalternativer > Avansert > Tilpasset CSS eller Tilpasset js-seksjon.
Vær oppmerksom på at når du legger til ekstern CSS eller JavaScript I Temaalternativer, kan du ikke legge til en kode som starter med < skript > < / skript> I Egendefinert JS-seksjon. Du må fjerne skriptet <> < / skript> i koden fordi koden du skriver I Den Egendefinerte js-delen, allerede publiserer med et skript <></skript> – taggen.
PROS:
- Beste måten å tilpasse små ting MED CSS og Javascript I Jupiter
- Beste måten å legge små TIL mellomtoner CSS og Javacscript koder I Jupiter
- ingen oppsett / installasjon kreves-det er allerede innebygd!
ULEMPER:
- Vanskeligere å vedlikeholde og oppdatere
- du kan ikke legge til filer direkte (.css eller .js-filer eksternt) med mindre DU vet AJAX-koding.
- du kan ikke velge om koden skal skyves i wp_header eller wp_footer.
Bruke En Plugin
Plugins er våre lojale hjelpere Mens Du bruker WordPress. Du kan også legge til kodene dine med et plugin som Sett Inn Topp-og Bunntekst. Det er en fin måte å legge til kodene dine på nettstedet ditt, og det fungerer på samme måte som vår innebygde funksjon. Det gode med dette pluginet er at du kan velge om du vil legge til koden din i bunnteksten eller topptekstområdet, noe som noen ganger er avgjørende for noen integrasjoner.
I Motsetning til vår innebygde løsning, kan du legge til < script > < / script> koder I Sett Inn Topp-og Bunntekst-plugin.
PROS:
- du kan velge kodestedet
- Flott alternativ til vår innebygde løsning
- Rask Og enkel måte å legge Til Facebook Pixel eller egendefinerte Google Analytics-koder.
- Flott måte for Tredjeparts Integrasjoner
ULEMPER:
- Trenger plugin installasjon / oppsett
- Vanskelig å vedlikeholde og oppdatere
- du kan ikke legge til filer direkte som vår innebygde løsning.
Bruk Av Barnetema Og Enqueqe Stil
Bruk Av Barnetema er det vi anbefaler hvis du vil gjøre noen mellomstore til store tilpasninger fordi det er den sikreste måten å tilpasse nettstedet ditt på. Med Barnetemaet kan du enkelt vedlikeholde kodene dine og oppdatere kjernetemafilene dine.
du kan installere vår offisielle Barn Tema eller du kan lage din egen. Du kan deretter begynne å legge TIL CSS-koder og tilpasse nettstedet ditt med En Gang I Utseende > Editor. Men hvis du vil legge til eksterne CSS-filer Og Javascripts-filer, må du ringe det og skrive noen koder i funksjoner.php.
Slik går det:
- Få CSS-Eller Javascript-Filen klar, eller hvis det er en ekstern kilde, få koblingen klar.
- Opprett en fil med navnet functions.php
- Legg til følgende kode i funksjoner.php
<?php
funksjon add_theme_codes () {
wp_enqueue_style (‘stil’, get_stylesheet_directory_uri ().’/myexternalcode.css’, ‘alle’);
}
add_action (‘wp_enqueue_scripts’, ‘add_theme_codes’ );
?>
med denne koden oppretter du en ny handling for stilarket ditt og kaller det fra barnetema-katalogen. La oss si at du har en » tilpasset.css » fil som må legges til nettstedet ditt.
Legg til den filen i wp-content/themes / jupiter-child VIA FTP, og opprett deretter en funksjon.php-fil. Deretter legger du til koden ovenfor og endrer ‘ / myexternalcode.css ‘ til ‘ tilpasset.css ‘ eller hva filnavnet ditt er. Til slutt må du legge til funksjonene dine.php til barnet ditt tema også.
her er et annet eksempel, hvis du ikke har en fil, men en ekstern kilde må legges til:
<?php
funksjon add_theme_codes () {
wp_enqueue_style( ‘stil’, ‘https://code.jquery.com/jquery-3.2.1.js’, ‘alle’);
}
add_action (‘wp_enqueue_scripts’, ‘add_theme_codes’ );
?>
i eksemplet ovenfor brukte vi ikke get_stylesheet_directory_uri () fordi kildefilen er ekstern. Du kan også ringe forskjellige filer fra serveren din ved å bruke koblinger som de ovenfor.
PROS:
- Best for alle typer tilpasninger
- Best for tredjeparts Og Komplekse Integrasjoner
- Lett å vedlikeholde Og redigere
- du kan legge til lokale eller eksterne filer direkte
- en av de sikreste metodene for oppdateringer
ULEMPER:
- Trenger litt å sette opp
- Krever litt kodingskunnskap(eller i det minste bør du være villig til å lære)
- Ikke den raskeste måten for små tilpasninger
Hvilken er det beste alternativet for forskjellige situasjoner?
Hvis Du vil gjøre raske endringer eller tilpasninger, Vil Temaalternativer være det beste alternativet for deg. Men hvis du vil ha mer fleksibilitet og kontroll på koden og kodeplasseringen, og du fortsatt har små til mellomstore tilpasninger, Vil Sett Inn Topp-og Bunntekster fungere bra for deg.
Men Hvis du vil gjøre store tilpasninger, tredjepartsintegrasjoner, eller hvis Du vil ha et vedlikeholdbart utviklingsmiljø, Er Barnetemaet det beste alternativet. Hvis du trenger mer hjelp til å legge til ekstern CSS eller Javascript på nettstedet ditt, kan Du alltid få Hjelp Av Artbees Care.
