nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


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

Catalogus aanmaken met "Prijsaanvraag" met WooCommerce

Catalogus aanmaken met "Prijsaanvraag" met WooCommerce

WooCommerce biedt een geweldige manier om uw producten te vermelden en maakt het vrij gemakkelijk voor uw klanten om te kopen en om uw bestellingen te beheren . Soms wilt u uw spullen misschien niet echt verkopen, maar gewoon presenteren.In dit artikel laat ik je zien hoe je gemakkelijk een geweldige catalogus kunt maken en een prijsverzoekoptie kunt bieden door alleen de inherente WooCommerce-opties en een paar mooie standaardaanpassingsfragmenten te gebruiken

(Technische en ontwerptips)

Hoe Firefox Reader View aan te passen voor betere leesbaarheid

Hoe Firefox Reader View aan te passen voor betere leesbaarheid

Reader View is een populaire functie van de Firefox-browser, die het uiterlijk van een webpagina verandert en deze beter leesbaar maakt door visuele rommel te verwijderen zoals afbeeldingen, advertenties, koppen en zijbalken. Reader View is echter niet beschikbaar voor alle startpagina's.Als de functie beschikbaar is voor een bepaalde pagina, vindt u het pictogram om dit in te schakelen in de vorm van een klein boekpictogram dat rechts van de adresbalk wordt weergegeven

(Technische en ontwerptips)