Ustvarite Self-Hosted Dribbble Portfolio z Dribbboxom
Dribbble je priljubljena spletna stran v oblikovalski sferi, kjer lahko delite svoje WIP projekte, modele, modele in celo freebies. V zameno boste dobili povratne informacije in kritike kolegov oblikovalcev, kar je dobro, da vašo zasnovo potisnete na naslednjo stopnjo.
Če želite prilagoditi prikaz portfelja, lahko prikažete posnetke pod lastno domeno. Da bi vam pomagali pri tem, lahko preizkusite Dribbbox.
Dribbbox je knjižnica, ki nam pomaga prikazati posnetke Dribbble pod lastno domeno, ne bo nobenih težav. Oglejmo si, kako lahko nastavite Dribbbox za predstavitev vaših umetniških del.
Namestitev Dribbboxa
Predvidevam, da imate svojo domeno in nastavitev strežnika; deljeno gostovanje bi moralo delovati v redu. V nasprotnem primeru lahko zaženete lokalni strežnik, če ga nimate. Če potrebujete navodila za nastavitev lokalnega strežnika z AMPPS, preberite tukaj.
Prenesite paket ZIP in naložite vsebino na strežnik. Vključite index.html, config.js in mapo s sredstvi.
Odprite config.js in določite uporabniško ime za pridobitev vašega portfelja iz Dribbble.
V tem primeru uporabljam portfelj Thoriq Firdaus za predstavitev. Tukaj lahko najdete portfelj.
dribbbox.config = dribbble_username: "tfirdaus", short_description: "oblikovalec svetovnega razreda wanna-be.", email_address: "[email protected]"
Shranite ga in osvežite stran.
Res je tako preprosto, kajne?
Vaš portfelj na Dribbboxu
Nastavitev je preprosta. Imate tri stolpce. Vaši kontaktni podatki so na skrajni levi v statični stranski vrstici. Vaši posnetki Dribbble so v srednjem stolpcu, ki ga lahko pomikate, in na desni strani, kjer lahko gledalci vidijo vaš projekt v celoti, enega za drugim. Namestitev je popolna le kot prikaz, kar pomeni, da vam javnost ne bo mogel dati povratnih informacij, kot so komentarji ali podobno. Tudi ti ne bodo mogli deliti vašega dela.
Dribbbox je optimiziran za ogled na mobilnih napravah. Ko je spletna stran prikazana na mobilnih napravah, bo postavitev in HTML drevesa DOM prenovljena mobile.js
. Določite širino prikaza, katerega mobile.js
potekati v. \ t index.html
.
(function () var s = document.createElement ("script") s.src = "sredstva / js /" + (matchMedia ("(max-width: 414px)"). se ujema? "mobile": "desktop" ) + ".js" document.head.appendChild (s)) ()
Zaključek
Dribbbox je priročna knjižnica za prikazovanje posnetkov Dribbble pod lastnim imenom domene. Zelo intuitiven je za delo, tudi če ne poznate JavaScripta; preprosto dodajte svoje uporabniško ime in (po želji) vaš e-poštni naslov in vsi ste pripravljeni. Če vam privzeta predstavitev ni všeč, jo lahko dodatno prilagodite prek CSS-ja.
Več na Hongkiat: gostiteljica vaše statične spletne strani v Dropbox z palačinka