Creëer zelf-gehoste dribbelportfolio met Dribbbox
Dribbble is een populaire website om in de ontwerpwereld je WIP-projecten, ontwerpen, mockups en zelfs freebies te delen. Als tegenprestatie krijg je feedback en kritiek van collega-ontwerpers, wat goed is om je ontwerp naar een hoger niveau te tillen.
Als u wilt personaliseren hoe u uw portfolio weergeeft, kunt u de shots onder uw eigen domein weergeven. Om u daarbij te helpen, kunt u Dribbbox uitproberen.
Dribbbox is een bibliotheek die ons helpt Dribbble-shots onder ons eigen domein weer te geven, zonder gedoe. Laten we eens kijken hoe u Dribbbox kunt instellen voor het presenteren van uw kunstwerken.
Dribbbox installatie
Ik neem aan dat u uw domein en een serverinstelling hebt; een shared hosting zou prima moeten werken. Anders kunt u een lokale server uitvoeren als u die niet heeft. Als u instructies nodig hebt over het instellen van een lokale server met AMPPS, leest u dit hier.
Download het ZIP-pakket en upload de inhoud naar de server. Voeg de index.html, de config.js en de map assets toe.
Open config.js en geef de gebruikersnaam op om uw portfolio op te halen van Dribbble.In dit geval gebruik ik de portfolio van Thoriq Firdaus voor de demo. Hier ziet u hoe u de portefeuille ophaalt.
dribbbox.config = {dribbble_username: "tfirdaus", short_description: "Een ontwerper van wereldklasse wanna-be.", email_address: "[email protected]"}
Sla het op en vernieuw de pagina.
Het is echt zo simpel, toch?Uw portfolio op Dribbbox
De opzet is eenvoudig. Je hebt drie kolommen. Uw contactgegevens staan helemaal links in een statische zijbalk. Je Dribble-opnamen bevinden zich in de middelste schuifbare kolom en aan de rechterkant kunnen kijkers je project één voor één in het volle zicht bekijken. De opstelling is alleen perfect als een weergave, wat betekent dat het publiek je geen feedback kan geven zoals opmerkingen of likes. Ze zullen uw werk ook niet kunnen delen.
Dribbbox is geoptimaliseerd voor weergave op mobiele apparaten. Wanneer de website op mobiel wordt bekeken, wordt zowel de lay-out als de HTML van de DOM-structuur gereconstrueerd via mobile.js
. Geef de viewport-breedte op waarvan de mobile.js
in de index.html
moet plaatsvinden.
(function () {var s = document.createElement ("script") s.src = "assets / js /" + (matchMedia ("(max-width: 414px)"). komt overeen? "mobiel": "desktop" ) + ".js" document.head.appendChild (s)}) ()
Conclusie
Dribbbox is een handige bibliotheek om je Dribbble-shots onder je eigen domeinnaam te laten zien. Het is erg intuïtief om mee te werken, zelfs als je geen JavaScript kent; voeg eenvoudig uw gebruikersnaam en (optioneel) uw e-mailadres toe, en u bent klaar. Als je de standaardpresentatie niet leuk vindt, kun je het uiterlijk verder personaliseren via CSS.
Meer over Hongkiat: host uw statische website in Dropbox met Pancake
Hoe het internet reageerde op Apple's Airpods
Met de komst van iPhone 7 nemen we afscheid van de oortelefoonaansluiting en hallo tot een nieuw tijdperk van ... draadloze oortelefoons. Dubbed "Airpods", de nieuwe draadloze koptelefoon - hoewel niet de eerste in zijn soort - signaleert een verandering die velen ongemakkelijk maakt. En omdat dit internet is, is de enige juiste reactie om erover te grappen
9 manieren waarop 3D-printen de wereld verandert
Hobbyist 3D-printen is een van de populairste trends in de technische wereld en mensen hebben het gebruikt om allerlei dingen te creëren voor entertainment, kunst, werk, onderwijs, medische behoeften en meer. We komen langzaam te weten wat de mogelijkheden zijn die 3D-geprinte materialen op de plaat kunnen brengen in verschillende industrieën, waaronder productie, onderwijs, ruimte en zelfs wapens.I