Trang chủ » Thiết kế web » Tạo danh mục Dribbble tự lưu trữ với Dribbbox

    Tạo danh mục Dribbble tự lưu trữ với Dribbbox

    Dribbble là một trang web phổ biến trong lĩnh vực thiết kế nơi bạn có thể chia sẻ các dự án WIP, thiết kế, mockup và thậm chí là miễn phí. Đổi lại, bạn sẽ nhận được phản hồi và lời chỉ trích từ các nhà thiết kế đồng nghiệp, điều này rất tốt để đẩy thiết kế của bạn lên một tầm cao mới.

    Nếu bạn muốn cá nhân hóa cách bạn hiển thị danh mục đầu tư của mình, bạn có thể hiển thị các bức ảnh dưới tên miền của riêng bạn. Để giúp bạn với điều đó, bạn có thể dùng thử Dribbbox.

    Dribbbox là một thư viện giúp chúng tôi hiển thị các bức ảnh Dribbble trong tên miền của chúng tôi, sẽ không gặp rắc rối. Hãy xem cách bạn có thể thiết lập Dribbbox để giới thiệu các tác phẩm nghệ thuật của bạn.

    Cài đặt Dribbbox

    Tôi giả sử rằng bạn có tên miền của bạn và thiết lập máy chủ; một lưu trữ chia sẻ nên hoạt động tốt. Nếu không, bạn có thể chạy một máy chủ cục bộ nếu bạn không có. Nếu bạn cần hướng dẫn về cách thiết lập máy chủ cục bộ với AMPPS, hãy đọc về nó ở đây.

    Tải xuống gói ZIP và tải nội dung lên máy chủ. Bao gồm index.html, config.js và thư mục tài sản.

    Mở config.js và chỉ định tên người dùng để truy xuất danh mục đầu tư của bạn từ Dribbble.

    Trong trường hợp này, tôi đang sử dụng danh mục đầu tư của Thoriq Firdaus cho bản demo. Đây là cách bạn lấy danh mục đầu tư.

     dribbbox.config = dribbble_username: "tfirdaus", short_description: "Một nhà thiết kế đẳng cấp thế giới muốn có.", email_address: "[email protected]" 

    Lưu nó và làm mới trang.

    Nó thực sự đơn giản, phải không?

    Danh mục đầu tư của bạn trên Dribbbox

    Việc thiết lập rất đơn giản. Bạn có ba cột. Chi tiết liên lạc của bạn ở phía xa bên trái trong một thanh bên tĩnh. Các bức ảnh Dribbble của bạn nằm trong cột có thể cuộn ở giữa và bên phải là nơi người xem có thể thấy dự án của bạn ở chế độ xem toàn bộ, từng cái một. Thiết lập chỉ hoàn hảo như một màn hình, điều đó có nghĩa là công chúng sẽ không thể cung cấp cho bạn phản hồi như nhận xét hoặc lượt thích. Họ sẽ không thể chia sẻ công việc của bạn.

    Dribbbox đã được tối ưu hóa để xem trên thiết bị di động. Khi trang web được xem trên thiết bị di động, bố cục cũng như HTML của cây DOM sẽ được xây dựng lại thông qua mobile.js. Chỉ định chiều rộng khung nhìn trong đó mobile.js nên diễn ra trong index.html.

     (function () var s = document.createEuity ("script") s.src = "Tài sản / js /" + (matchMedia ("(max-width: 414px)"). ) + ".js" document.head.appendChild (s)) () 

    Phần kết luận

    Dribbbox là một thư viện tiện dụng để thể hiện các bức ảnh Dribbble của bạn dưới tên miền của riêng bạn. Nó rất trực quan để làm việc với ngay cả khi bạn không biết JavaScript; chỉ cần thêm tên người dùng của bạn và (tùy chọn) địa chỉ email của bạn, và bạn đã hoàn tất. Nếu bạn không thích bản trình bày mặc định, bạn có thể cá nhân hóa giao diện thông qua CSS.

    Thông tin thêm về Hongkiat: Lưu trữ trang web tĩnh của bạn trong Dropbox với Pancake