Начална » Уеб дизайн » Създайте Самостоятелно Хоствано Dribbble Портфолио с Dribbbox

    Създайте Самостоятелно Хоствано Dribbble Портфолио с Dribbbox

    Dribbble е популярен уебсайт в сферата на дизайна, където можете да споделяте вашите WIP проекти, дизайни, макети и дори безплатни. В замяна ще получите обратна връзка и критики от колегите дизайнери, което е добре да подтигнете дизайна на следващото ниво.

    Ако искате да персонализирате начина на показване на портфолиото си, можете да покажете снимките под свой собствен домейн. За да ви помогне с това, можете да изпробвате Dribbbox.

    Dribbbox е библиотека, която ни помага да показваме Dribbble снимки под наш собствен домейн, няма да има никакви проблеми. Нека да разгледаме как можете да настроите Dribbbox за представяне на вашите произведения на изкуството.

    Инсталиране на Dribbbox

    Предполагам, че имате домейн и настройка на сървър; споделен хостинг трябва да работи добре. В противен случай можете да стартирате локален сървър, ако нямате такъв. Ако имате нужда от инструкции как да настроите локален сървър с AMPPS, прочетете за него тук.

    Изтеглете ZIP пакета и качете съдържанието на сървъра. Включете index.html, config.js и папката с активи.

    Отвори Config.js и посочете потребителското име за извличане на портфолиото ви от Dribbble.

    В този случай използвам портфолиото на Thoriq Firdaus за демонстрацията. Ето как можете да изтеглите портфейла.

     dribbbox.config = dribbble_username: "tfirdaus", short_description: "дизайнер от световна класа, който иска да бъде.", email_address: "[email protected]" 

    Запазете го и обновете страницата.

    Наистина е толкова просто, нали??

    Портфолиото ви в Dribbbox

    Настройката е проста. Имате три колони. Вашите данни за контакт са вляво в статичната странична лента. Вашите снимки от Dribbble са в средната превъртаща се колона, а отдясно - където зрителите могат да видят проекта ви изцяло, един по един. Настройката е идеална само като дисплей, което означава, че обществеността няма да може да ви даде обратна връзка като коментари или харесвания. И те няма да могат да споделят работата ви.

    Dribbbox е оптимизиран за показване на мобилни устройства. Когато уебсайтът се гледа на мобилни устройства, оформлението, както и HTML на дървото DOM ще бъдат реконструирани mobile.js. Посочете ширината на екрана, от която mobile.js трябва да се проведе в index.html.

     (function () var s = document.createElement ("скрипт") s.src = "assets / js /" + (matchMedia ("(max-width: 414px)"). съвпада? "mobile": "desktop" ) + ".js" document.head.appendChild (s)) () 

    заключение

    Dribbbox е удобна библиотека за показване на вашите Dribbble снимки под ваше собствено име на домейн. Тя е много интуитивна за работа, дори ако не знаете JavaScript; просто добавете потребителското си име и (по избор) имейл адреса си и всички сте готови. Ако не харесвате представянето по подразбиране, можете да персонализирате външния вид чрез CSS.

    Повече за Hongkiat: Хост Вашият статичен уебсайт в Dropbox с палачинка