Glyphicons từ bootstrap không hiển thị

Question

<div class="container-fluid"> 
    <div class="sidebar left"> 
    <div id="app-navigation" class="well"> 
     <h5>Administration</h5> 
     <ul class="administration-list"> 
     <li class="user"><a href="#user">User</a></li> 
     <li class="emails"><a href="#emails">Emails</a></li> 
     <li class="settings"><a href="#Settings">Settings</a></li> 
     <li class="logs"><a href="#Logs">Logs</a></li> 
     <li class="help"><a href="#Help">Help</a></li> 
     </ul> 
     <h5>Managing tools</h5> 
     <ul class="tools-list"> 
     <li class="ressource"><a href="#Ressources"><i class="icon-home icon-white" </i>Ressources</a></li> 
     <li class="playlist"><a href="#Playlist">Playlist</a></li> 
     <li class="schedule"><a href="#Schedule">Schedule</a></li> 
     <li class="stations"><a href="#Stations">Stations</a></li> 
     </ul> 
    </div> 
    </div> 
</div> 

Tôi không hiểu tại sao biểu tượng của tôi không hiển thị. Tôi đang bắt đầu một dự án mới và quyết định dùng thử initializr với bootstrap. Chỉ không thể làm cho những biểu tượng đó xuất hiện. Có vẻ như có một biểu tượng vô hình ngay trước văn bản của tôi ... Tôi cũng kiểm tra tài liệu, here. Tôi cũng kiểm tra trong vòng của tôi boostrap.less, sprites.less và variables.less (mọi thứ có vẻ ổn ...).

Biến của tôi được đặt chính xác và hình ảnh của tôi (PNG) nằm trong thư mục ../img của tôi.

// Sprite icons path 
// ------------------------- 
@iconSpritePath:   "../img/glyphicons-halflings.png"; 
@iconWhiteSpritePath:  "../img/glyphicons-halflings-white.png"; 

Answer 1

Tệp variables.less nằm trong thư mục bootstrap, vì vậy bạn cần thêm một cấp để truy cập thư mục gốc.

Cố gắng thiết lập các đường dẫn đến:

@iconSpritePath:   "../../img/glyphicons-halflings.png"; 
@iconWhiteSpritePath:  "../../img/glyphicons-halflings-white.png"; 

Answer 2

Tôi phải sao chép thư mục img từ thư mục khởi động vào thư mục ít hơn ... hoặc bạn có thể thay đổi biến để trỏ tới thư mục gốc/img.

Answer 3

Mở tệp rewrites.php trong thư mục 'lib'. Thêm dòng sau đây trong chức năng 'roots_add_rewrites ($ content)':

'assets/fonts/(.*)' => THEME_PATH . '/assets/fonts/$1', 

Chức năng nên xem xét như thế này:

function roots_add_rewrites($content) { 
    global $wp_rewrite; 
    $roots_new_non_wp_rules = array(
    'assets/css/(.*)'  => THEME_PATH . '/assets/css/$1', 
    'assets/js/(.*)'  => THEME_PATH . '/assets/js/$1', 
    'assets/img/(.*)'  => THEME_PATH . '/assets/img/$1', 
    'assets/fonts/(.*)' => THEME_PATH . '/assets/fonts/$1', 
    'plugins/(.*)'   => RELATIVE_PLUGIN_PATH . '/$1' 
); 
    $wp_rewrite->non_wp_rules = array_merge($wp_rewrite->non_wp_rules, $roots_new_non_wp_rules); 
    return $content; 
} 

Answer 4

Trong các biểu tượng Bootstrap mới nhất được kèm với glyphicon lớp mới :

<i class="glyphicon glyphicon-heart"></i> 

Trong một số trường hợp có thể sẽ là vấn đề.