no.hideout-lastation.com
Paradis For Designere Og Utviklere


Slik legger du til ferieopplysninger til WordPress-siden din

Festligheter er over oss og hvilken bedre måte å spre cheer enn å sette opp en ferie-tema varsel på nettstedet ditt ? Du kan gå på ferie snart, kanskje du vil hilse på dine besøkende med et spesielt kort, eller du vil kanskje bare vise en spesiell melding.

Det er mange WordPress Christmas plugins der ute, vi har allerede sett på, men hva med å gjøre det på egen hånd? Har du litt tid til et kort WordPress-prosjekt i løpet av ferien? Følg med for å lære hvordan du legger til noen julemeldinger på nettstedet ditt via tekstdisplay, klebrig bar og en teller-widget.

Opprette en tekst widget

Det er ingen rakettvitenskap her, beklager! Du kan legge til en rask melding og vise den i et widget-område ved å gå til Utseende> Widgets, dra en tekst-widget i en sidebjeld og skriv inn meldingen i boksen. Du kan bruke HTML der inne, slik at du kan krydre ting med et bilde hvis du vil.

Jeg er enig, dette er litt kjedelig, men det kan være akkurat den riktige mengden festlighet å legge til. Mange mer seriøse nettsteder som e-handelsnettsteder eller personlige porteføljer vil bli påvirket negativt ved å danse Santas, men folk fortsatt setter pris på en liten ferie jubel likevel.

Sticky Bar

Hva med en stangfelt, som ligner på Quick Notice-plugin-en, men vi kodet oss selv? Vi kan også få det til å holde seg til toppen av siden på rulle enkelt.

Det første trinnet er å lage et plugin, la meg vise deg hvordan:

I din plugin-katalog, opprett en ny mappe med navnet "my-sticky-bar". Inne i den mappen opprett en fil med navnet "my-sticky-bar.php" og lim inn følgende innhold i det:

Når du har lagret denne filen, bør du kunne aktivere pluginet via Plugins-delen i WordPress-administrasjonen. Det gjør ikke noe ennå, men vi vil snart fikse det!

Vi må gjøre to ting: bruk PHP og HTML for å sende ut meldingen vår og bruk CSS til å stile den.

I filen "my-sticky-bar.php" bruker du følgende kode for å legge til nødvendig HTML på riktig sted:

 add_action ('wp_footer', 'my_sticky_bar_display'); funksjon my_sticky_bar_display () {echo " 
God jul alle sammen!
";}

Den første linjen er en WordPress-krok, det forteller WordPress å utføre funksjonen "my_sticky_bar_display" like før slutten av kroppen. Det er greit å laste HTML-koden til baren vår på slutten av siden. Det er ikke så viktig og kan flyttes via CSS.

På dette stadiet bør du kunne se meldingen din nederst på nettstedet ditt, uten formatering. For å legge til formatering må vi legge ved et stilark ved å skrive inn det.

I samme fil:

 add_action ('wp_enqueue_scripts', 'my_sticky_bar_styles'); funksjon my_sticky_bar_styles () {wp_enqueue_style ('my-sticky-bar', plugin_dir_url (__FILE__). '/my-sticky-bar.css'); } 

Enqueueing er en måte å legge til skript og stiler modulært til WordPress. Du trenger ikke å forstå alt det skjønt - hvis du limer dette inn i pluginfilen og lager filen "my-sticky-bar.css", kan du begynne å legge til stilene dine. La oss gjøre det nå.

 # my-sticky-bar {posisjon: absolutt; topp: 0px; bredde: 100%; tekst-align: center; farge: #fff; bakgrunn: # 810400; polstring: 11px 0; tekst-transformer: store bokstaver; brevavstand: 2px; } 

Best av alt, hvis du erstatter "absolutt" med "fast", vil meldingen holde seg til toppen av vinduet og følge brukerne rundt når de ruller.

Denne metoden er stor fordi du har full kontroll over alt! For eksempel, om hvordan du holder denne plugin aktiv hele tiden, men bare viser meldingen den 25. desember? Ikke noe problem, bare endre my_sticky_bar_display funksjonen litt.

 add_action ('wp_footer', 'my_sticky_bar_display'); funksjon my_sticky_bar_display () {if (date ('d') == 25 && date ('m') == 12) {echo " 
God jul alle sammen!
";}}
Counter Widget

Vi har allerede lagt til litt enkel tekst i vår tekstdisplay, men hva med å lage nedtelling for brukerne?

Det første trinnet er å la WordPress vite at vi vil lage en egendefinert widget. Vi må definere en funksjon og koble den til widgets_init . Opprett et nytt plugin, som i det forrige, og i hovedfilen, lim inn følgende:

 add_action ('widgets_init', 'christmas_countdown_widget'); funksjon christmas_countdown_widget () {register_widget ('Christmas_Countdown_Widget'); } 

Vi må opprette en klasse som heter Christmas_Countdown_Widget med noen få funksjoner i den. La oss begynne med å skape en konstruktørfunksjon. Lim inn alt under i hovedpluginfilen også.

 klassen Christmas_Countdown_Widget utvider WP_Widget {funksjon __construct () {foreldre :: __ konstruere ('christmas_countdown_widget', 'Christmas Countdown Widget', array ('description' => 'En enkel Christmas nedtelling')); }} 

Konstruktørfunksjonen inneholder noen viktig informasjon som brukes til å bygge widgeten. Den inneholder iden til widgeten (christmas_countdown_widget), navnet som vil vises i backend-brukergrensesnittet (Christmas Countdown Widget) og beskrivelsen som også vises.

Vi kan legge til en funksjon som heter form() som kan brukes til å utføre noen innstillinger for widgeten. Vi vil ikke bruke det her, men husk det for fremtidige prosjekter. Jeg legger bare til en tom funksjon for nå.

Vi vil bruke widget() -funksjonen til å sende ut widgeten til forsiden. La oss legge til en enkel nedtelling nå. Lim inn følgende kode inne i klassen, under funksjonen __construct() . Merk at jeg også legger til den tomme form() -funksjonen nå.

 funksjonsskjema () {} funksjons widget () {echo "Tid til jul:". human_time_diff (tid (), mktime (0, 0, 0, 12, 25, dato ('Y'))); } 

Vi bruker funksjonen human_time_diff() som tilbys av WordPress, for å finne ut tiden mellom dag og juledag. Dette vil vise noe som: "Tid til jul: 5 dager".

Dette er ganske grunnleggende, men du kan bruke noen form for bilder, tekst, stiler og Javascript for å gjøre dette ser fantastisk ut. Den endelige og fullstendige koden for vår widget er som følger:

 add_action ('widgets_init', 'christmas_countdown_widget'); funksjon christmas_countdown_widget () {register_widget ('Christmas_Countdown_Widget'); } klasse Christmas_Countdown_Widget utvider WP_Widget {funksjon __construct () {foreldre :: __ konstruere ('christmas_countdown_widget', 'Christmas Countdown Widget', array ('description' => 'En enkel Christmas nedtelling')); } funksjonsform () {} funksjons widget () {echo "Tid til jul:". human_time_diff (tid (), mktime (0, 0, 0, 12, 25, dato ('Y'))); }} 
Glade helligdager!

Jeg håper jeg har gitt deg noen ideer for å legge til julehilsen på nettstedet ditt! Hvis du ikke feirer jul, kan du alltid bruke disse metodene og bruke dem til din egen kultur.

Spise og feire alt i løpet av ferien? Husk å lese vår artikkel på Christmas WordPress Plugins for mange gode ideer og rask tilgang til gode feriespørsmål!

Når handler Brand Design faktisk?

Når handler Brand Design faktisk?

Som en merkeidentitetsdesigner sliter jeg ofte med dette spørsmålet. Når jeg ser på selskaper som Apple, Dell, Google og Amazon, som alle startet med blide, uinspirerende logoer og ingen ekte merkeidentitet å snakke om, synes jeg ofte å tenke over hvilke av mine potensielle kunder som virkelig ville ha nytte av tjenestene mine, og som kanskje trenger noen flere år med å være i virksomhet før de kan få maksimal kostnadseffektivitet ved å ansette meg.I dag skal

(Tekniske og design tips)

Lær Adobe XD gratis med denne webguiden

Lær Adobe XD gratis med denne webguiden

Hvis du planlegger å lære Adobes nyeste UI / UX-programvare, vær da oppmerksom på at du vil være i for en ganske læringskurve fordi Adobe XD er et veldig komplekst designverktøy. Men hvis du vil spore læringsprosessen raskt, ta en titt på denne veiledningen som er publisert av XD Guru.Det er den største og mest omfattende veiledningen til Adobe XD-programvaren som du finner online. Den lære

(Tekniske og design tips)