Евгений Самко

Не все иконки подгружаются с getbootstrap.com

Recommended Posts

Подскажите, где копать, ставлю в класс:

class="glyphicon glyphicon-rub"

но эта иконка не отображается на сайте, тоже самое и с glyphicon glyphicon-ruble, и с многими другими...
Может стоят ограничения? как быть?
 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

причин может быть несколько....

использовать только со строчным span, нельзя использовать дочерние элементы, проверить месторасположение и наличие икончатого шрифта(при смене перекомпилировать less),

и шрифт не грузится, а сидит в ../fonts.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

правильное отображение иконки для bootstrap 3.0.0

<span class="glyphicon glyphicon-search"></span>

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Изначально было так: <i class="glyphicon glyphicon-ruble"></i>
поменял на : <span class="glyphicon glyphicon-ruble"></span> - не работает.

Но проблема только с определенными иконками: -ruble, -hourglass, -rub
а другие работают: -flag, -user и многие другие ...

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

в 3 версии бутстрапа нету таких иконок. их нужно отдельно скачивать и прописывать

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

не подскажите путь к этим иконкам ?

 

в bootstrap.css нашел, вот такого вида записи:

.glyphicon-user:before {
  content: "\e008";
}
 
как с ними работать?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Наличие этих иконок зависит от версии bootstrap, все эти иконки присутствуют только в последних версиях. Если не ошибаюсь, то начиная с версии 3.3.4.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

 

не подскажите путь к этим иконкам ?

 

в bootstrap.css нашел, вот такого вида записи:

.glyphicon-user:before {
  content: "\e008";
}
 
как с ними работать?

 

 

Эти иконки находятся в папке fonts, точнее не сами иконки, а шрифт, из которого они образуются. Попробуйте обновить этот шрифт и в bootstrap.css добавить:

.glyphicon-ruble:before {

  content: "\20bd";

}

.glyphicon-rub:before {

  content: "\20bd";

}

.glyphicon-hourglass:before {

  content: "\231b";

}

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Огромное спасибо, помогло!

Может кому-то пригодиться:
качаем новые шрифты с http://getbootstrap.com/getting-started/#download
и перезаливаем в /site/www/template/frontend/realto/assets/fonts
далее качаем css:  /site/www/template/frontend/realto/assets/css/bootstrap.css
и прописываем нужные иконки, пример:
.glyphicon-hourglass:before {
  content: "\231b";
}
где, "
\231b" - это код необходимой иконки

да, не забываем чистить кэш браузера

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Может кому-то пригодиться:

+ небольшие заметки:

1) лучше использовать тогда уж минифицированную версию (весит меньше), ну или сжать потом.

2) лучше инклюдить ещё свой css файл и дописывать в нём (на случай обновления шаблона) или дописывать в существующем файле в шаблоне style.css.

3) необходимо иметь ввиду, что версии разные и в вашем шаблоне использовался Bootstrap v3.0.0

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

+ ещё одно замечание:

1. Подключение стилей должно быть чётко прописано.

2. Учитывает сам шаблон.

3.Иногда тот же css от бутстрапа перекомпелируется с less и вносятся некоторые графические изменения, после компилируются в обычный css. Для некоторых шаблонов я так и делаю. Т.к. мне не нравится оформление некоторых элементов.Так что замена бутстрапа только на ваш страх и риск. И если в этом случае что-то отвалится или съедает то читаем тематику офомления ошибок или пишем в разделе фриланс

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас