Hướng dẫn Thay đổi Hiển thị Menu Điều hướng Di động cho Template Median-UI

Source: jagodesain.com

Một chút thay đổi về hình thức đối với những bạn có thể không thích menu điều hướng trên thiết bị di động hiện tại, thay đổi này sẽ không hiển thị trên màn hình máy tính để bàn.

Nếu bạn mở bài viết này trên điện thoại thông minh, menu điều hướng sẽ xuất hiện khác với các trang khác. Để áp dụng thay đổi này, bạn chỉ cần thêm một chút mã CSS vào mẫu, vui lòng làm theo hướng dẫn bên dưới:

Hướng dẫn

Tìm mã bên dưới trong mẫu của bạn và thêm một số mã được liệt kê ở dưới cùng

// Carilah kode dibawah ini:

]]></b:skin>

// Pada versi AMP carilah kode ini:

/*]]>*/</style>

// Letakan kode ini tepat sebelum kode diatas

@media screen and (max-width:640px){
  .navigation-mobile{margin: 0 10% 15px;border-radius: 25px;width: 80%;height: 45px;box-shadow: 0 6px 18px 0 rgba(9,32,76,.05)}
  .navigation-mobile svg{height: 18px}
  .navigation-mobile li.home-link{display: none}
  .navigation-menu .home{display: block}
}

// Berikut adalah contoh penempatan kode yang benar

@media screen and (max-width:640px){
  .navigation-mobile{margin: 0 10% 15px;border-radius: 25px;width: 80%;height: 45px;box-shadow: 0 6px 18px 0 rgba(9,32,76,.035)}
  .navigation-mobile svg{height: 18px}
  .navigation-mobile li.home-link{display: none}
  .navigation-menu .home{display: block}
}
  ]]></b:skin>

Lưu mẫu của bạn và xem sự khác biệt.