Skapa självhärdad Dribbble Portfolio med Dribbbox
Dribbble är en populär webbplats i designområdet där du kan dela dina WIP-projekt, mönster, mockups och till och med freebies. I gengäld får du feedback och kritik från medarbetare som är bra att driva din design upp till nästa nivå.
Om du vill personifiera hur du visar din portfölj kan du visa skotten under din egen domän. För att hjälpa dig med det kan du prova Dribbbox.
Dribbbox är ett bibliotek som hjälper oss att visa Dribbble-skott under vår egen domän, kommer inget av krångel. Låt oss ta en titt på hur du kan installera Dribbbox för att visa dina konstverk.
Dribbbox Installation
Jag antar att du har din domän och en serverinstallation; en delad hosting ska fungera bra. Annars kan du köra en lokal server om du inte har en. Om du behöver instruktioner om hur du konfigurerar en lokal server med AMPPS, läs om det här.
Hämta zip-paketet och ladda upp innehållet till servern. Inkludera index.html, config.js och mappen tillgångar.
Öppna config.js och ange användarnamnet för att hämta din portfölj från Dribbble.
I det här fallet använder jag Thoriq Firdaus portfölj för demo. Så här hämtar du portföljen.
dribbbox.config = dribbble_username: "tfirdaus", short_description: "En världsklass designer vill-vara.", email_address: "[email protected]"
Spara det och uppdatera sidan.
Det är verkligen så enkelt, är det inte?
Din portfölj på Dribbbox
Inställningen är enkel. Du har tre kolumner. Dina kontaktuppgifter finns längst till vänster i en statisk sidofält. Dribbelspel är i mellanspjälkbar kolumn, och till höger är var tittarna kan se ditt projekt i full visning, en i taget. Inställningen är perfekt endast som en bildskärm vilket innebär att allmänheten inte kan ge dig feedback som kommentarer eller liknande. De kommer inte heller att kunna dela med dig av ditt arbete.
Dribbbox har optimerats för visning på mobila enheter. När webbplatsen ses på mobilen, kommer layouten såväl som HTML av DOM-trädet att rekonstrueras genom mobile.js. Ange visningsbredden för vilken mobile.js bör äga rum i index.html.
(funktion () var s = document.createElement ("script") s.src = "tillgångar / js /" + (matchMedia ("(maxbredd: 414px)". ) + ".js" document.head.appendChild (s)) () Slutsats
Dribbbox är ett praktiskt bibliotek för att visa upp dina Dribbble-skott under ditt eget domännamn. Det är mycket intuitivt att arbeta med även om du inte känner till JavaScript; Lägg bara till ditt användarnamn och (valfritt) din e-postadress, och du är helt och hållet inställd. Om du inte gillar standardpresentationen kan du ytterligare anpassa utseendet via CSS.
Mer om Hongkiat: Värda din statiska webbplats i Dropbox med pannkaka
