Domača » Oblikovanje spletnih strani » Prilagajanje trendov, orodij in okvirov postavitev zagonskega zapisa

    Prilagajanje trendov, orodij in okvirov postavitev zagonskega zapisa

    Bootstrap je trenutno okvir prvega dela in enostavno najhitrejši način za izdelavo postavitev. To je bilo približno za let in tretji razvijalci so celo objavili svoje lastne vire na spletu. Ti viri segajo od brezplačne teme do podrobni vtičniki in okviri.

    V tem članku bi rad delil nekaj teh najboljših praks za razvijalce, ki želijo nadaljevati s programom Bootstrap.

    Vse viri na tem mestu so brezplačni, tako da jih lahko uporabite, kot se vam zdi primerno. Tudi če niste uporabljali Bootstrap-a, boste zagotovo našli nekaj, kar vam bo pomagalo začeti.

    Restyling z Bootstrap

    Privzeta knjižnica Bootstrap je priložena lasten edinstven dizajn to izgleda fantastično. To je splošno znano v spletu in lahko enostavno ugotovite, kdaj je spletno mesto z uporabo tradicionalnih elementov Bootstrap.

    Lahko pa tudi preoblikujte te elemente sami uporabite kodo Bootstrap kot osnovo za vašo postavitev.

    Obstajajo nekaj različnih načinov zmoreš:

    • Dodajte svoj slogovni slog, da prepišete privzeto.
    • Prilagodite izhodno datoteko BootStrap, tako da dobite le tiste elemente, ki jih želite.
    • Združite z dodatki in vtičniki / temami.

    Ta zadnja možnost je najpogostejša in je eden od razlogov, da je Bootstrap tako hitro zrasel.

    Odobren sem, da sem tudi njihov velik oboževalec orodje za prilagajanje ker je popolnoma brezplačna in vam daje toliko nadzora katere funkcije želite uporabiti.

    Obstajajo tone virov za BootStrap 3/4, ki so jih ustvarili razvijalci drugih proizvajalcev, zato je lažje kot kdajkoli prej ustvarite svoje edinstvene postavitve BootStrap brez pisanja veliko kode.

    Vtičniki in dodatki

    Ker Bootstrap prihaja z obsežno knjižnico JavaScript, je dovolj preprosta razširite funkcije JavaScript. In razvijalci so vsekakor storili s svojimi plugins, mnogi sprosti brezplačno na spletu.

    To so moje najljubše Podpora Bootstrap nativen. Veliko njih teči na jQuery, zato jih lahko enostavno prilagodite, če poznate svojo knjižnico jQuery.

    Validator obrazca

    Najprej je moja najljubša vtičnik za preverjanje obrazca, Validator obrazca. Deluje na jQuery in podpira celotno kopico okvirov frontendov: Bootstrap, Foundation, Pure, UIKit in druge.

    Ti lahko ročno dodajte poljubno število 51 validatorjev na kateri koli obrazec na vašem spletnem mestu. To pomeni, da bodo morali obiskovalci izpolniti zahteve za preverjanje veljavnosti, preden bodo lahko predložili vsebino.

    Številne kontaktne obrazce uporabljajo te validatorje zahtevajo delovne e-poštne naslove. Lahko pa jih uporabite tudi za nalaganje slik ali gesla, kar je vse, kar vaš Bootstrap-srce želi.

    Izbirnik podatkov v času

    Zbiralci datumov so tudi velika bolečina, da se kodirate sami. Veliko oblik preprosto uporabite spustne menije za nastavitve dan / mesec / leto, lahko pa jih uporabite tudi Vtičnik za izbiranje datuma za zagon da bi si rešili težave.

    To je popolnoma odprtokodni vir teče v knjižnici Bootstrap 3.x. Prav tako ga boste opazili podpira oba datuma in čas z drugim vtičnikom jQuery, Moment.js.

    Na splošno je ta knjižnica fantastična, da je aktivni izbirnik za datum. Ima veliko odvisnosti vendar, na srečo, vam ne bo treba pisati veliko kodo, da bi bilo delo.

    Ocene zvezdic

    Tukaj je še ena kul funkcija ocene zvezdic na spletu. Ti lahko dodajte oceno ena na pet zvezdic kjer koli na vašem spletnem mestu z uporabo knjižnice Bootstrap za vedenje JavaScripta.

    Ko se uporabnik zadrži nad temi zvezdicami, se zaslon spremeni v ne glede na to, ali je ocena odvisna od položaja kazalca. Nato uporabnik z enim klikom glasuje in nastavi oceno, vključno z oceno pol zvezdic.

    Ta plugin je zagotovo zapleteno ker lahko spremenite veliko privzetih nastavitev za naprednejše tehnike. Ampak, lahko vidite preprost demo v živo, da bi ocenili, če se ta plugin z zvezdicami ujema z vašim spletnim mestom.

    Vodljivo

    Bootstrap prihaja z njegovim lasten slog postavitve tabele za prikaz tabelarnih podatkov na sprednji strani. Toda z Zaslonski vtičnik, V tabele Bootstrap lahko dodate celo vrsto dodatnih funkcij.

    To je eden izmed najbolj podrobnih vtičnikov jQuery tam in to so le nekatere od funkcij, ki jih lahko dodate:

    • Paginiranje po meri.
    • Razvrščanje stolpcev.
    • Filtriranje podatkov.
    • Učinki animacije tabele.
    • Preverite, ali želite izbrati celotne vrstice.

    WATable je opisan kot a Švicarski vojski nož čepov za mizo in strinjam se s tem opisom. Dejstvo, da podpira Bootstrap, je samo zaledenitev pogače.

    To so bili nekateri od mojih najljubših vtičnikov, vendar jih je veliko. Na tej strani lahko brskate še več, če ste radovedni.

    Okviri za zagonska orodja

    Bootstrap je dejansko velik okvir, ker omogoča uporabnikom prilagodite privzete sloge HTML in CSS nekaj razredov.

    Razvijalci so prevzeli privzeto knjižnico BootStrap in dodali svoje lastne sloge, da bi ustvarili še večje okvire delo kot teme, tako da vam ni treba znova oblikovati Bootstrap-a.

    K sreči so vsi prosti in vsi delujejo na privzetih razredih BootStrap.

    Bootflat

    Morda je najbolj znan BootStrap okvir Uporabniški vmesnik Bootflat to sledi trendu ravnega oblikovanja.

    Deluje z vse privzete funkcije programa Bootstrap, vključno z vsemi komponentami JavaScripta. Večje razlike so več oblikovanje in strukturo kjer elementi strani uporabljajo ravne barvne sheme, da se odmaknejo od stilov gradienta Bootstrap.

    Bootflat ni bila uporabljena preveč zelo veliko, tako da lahko dodate ta okvir na katero koli ciljno stran ali domačo stran, da ustvarite edinstven videz vašega spletnega mesta.

    To je 100% brezplačno in celo prihaja z izbirnik barv, tako lahko najdete ravno barvne sheme, ki ustrezajo vaši postavitvi.

    Vzemi sranje

    To presenetljivo top vmesnik UI prav tako gradi na vrhu knjižnice Bootstrap 3 in je brezplačno izdana na GitHubu.

    Get Shit Done prihaja iz ekipe Creative Creative, kjer prodajajo nekaj premijskih sredstev. Ta poseben komplet uporabniškega vmesnika ima pro verzijo, vendar sploh ni potreben.

    Odprtokodna različica ima več kot dovolj za vsakogar in lahko preverite demo v živo da vidite, kako izgleda v brskalniku.

    Zasnova materiala za zagonska sredstva

    Še en priljubljen trend oblikovanja je Googlova zasnova materialov. To je oblikovalski jezik, ki je bil prvotno narejen za oblikovalce aplikacij Android, od takrat pa je širjenje po spletu in pridobili veliko podpore oblikovalcev uporabniškega vmesnika / UX.

    Ta neverjetni material Bootstrap uporablja materialne značilnosti oblikovanja ustvarite slog oblikovanja po meri iz knjižnice Bootstrap.

    Privzeto je podpira vse v programu BootStrap 3 in se trenutno preoblikuje, da podpira tudi zagonsko datoteko 4. Več o tem lahko izveste na uradni domači strani, ki ima dokumentacijo in predstavitve.

    Podobna knjižnica, ki jo lahko poskusite, je MDBootstrap, čeprav se mi zdi, da je to malo težje delati.

    Bootplus

    Google je ustvaril jezik oblikovanja materiala, vendar imajo tudi svoje lastne sloge za mnoga svoja orodja in spletne aplikacije.

    Bootplus posnema slog vmesnika Google+, skupaj z mnogimi Googlovimi dokumenti za pomoč, Google Drive in podobnimi spletnimi aplikacijami. Ima vse enake funkcije kot zagonski trak, vključno z mrežami, slogi postavitve, slogi elementov in komponentami JavaScripta.

    Lahko celo brskate po demo na spletnem mestu, da si ogledate razlike med Bootplusom in prvotnim uporabniškim vmesnikom Bootstrap. Za brezplačen vir, Bootplus je obsežen in je kot nalašč za vsakogar, ki ima radi Googlove tehnike oblikovanja.

    Orodja in viri

    Nazadnje, želim se potopiti v številna brezplačna orodja prilagajanje in gradnjo postavitev zagonskega traku.

    Ta orodja so vse spletne aplikacije in mnoge od njih so celo odprte v GitHubu. Izdelani so tako, da vam prihranijo čas in vam pomagajo oblikovati neverjetne Bootstrap postavitve brez veliko kode.

    Urejevalnik v živo

    Brezplačno Bootstrap urednik v živo je eno najboljših orodij za netehnične oblikovalce. Če ne veste, kako vnašati kodo, se lahko zanašate na gradnika zagonskega traku, da ustvarite celotno postavitev iz nič.

    To deluje v brskalniku za začetek lahko izberete celo prednastavljene predloge.

    Možnosti v stranski vrstici vam omogočajo dodajte določene vrednosti CSS če veste nekaj frontend kodiranja. Lahko pa uporabite tudi grafični uporabniški vmesnik za spreminjanje barv, pisav, velikosti in skoraj vsega drugega.

    Ko končate, kliknite “Pridobite temo” Posodobljene sloge CSS lahko kopirate / prilepite v svoj projekt. Super enostaven način za restyle Bootstrap, ne da bi morali vse ponavljati iz nič.

    Oblikovalec obrazca

    To brezplačno Izdelovalec obrazcev za zagon je orodje brskalnika »povleci in spusti« ki vam omogoča ustvarjanje obrazcev za zagon z začetka.

    Spet to zahteva znanje brez kodiranja in imate popoln dostop do vseh elementov Bootstrap 3. Izberite element, ki ga želite, in ga povlecite desno v levo. Od tu lahko spremenite vse, od besedila ograde do razreda CSS.

    Daleč najbolj kul oblikovalec obrazov, ki sem ga kdajkoli videl in je 100% brezplačen!

    BootSwatchr

    Še eno brezplačno orodje, ki mi je res všeč BootSwatchr. Zanaša se na okvir Bootstrap in vam omogoča posodobite barve, sloge teme, in celotno postavitev strani.

    Kaj mi je všeč v tej aplikaciji je, kako je tudi priti s brezplačno galerijo vnaprej oblikovanih stilov.

    Torej, lahko prenesete načrt, ki nekdo drug ali pa jo uporabite kot izhodišče za prilagajanje lastne teme.

    Premikanje naprej

    Bootstrap je vedno bolj priljubljen, zato je zdaj najboljši čas v tem okviru. K sreči obstajajo na ducate vtičnikov, okvirov in brezplačnih orodij, s katerimi lahko pospešite proces.

    V tem članku sem pravkar pokazal vrh ledene gore, tako da, če ne vidite ničesar, kar bi bilo koristno, se obrnite na Google in poglejte, kaj še lahko najdete.