Установить шрифты на сайт

Для установки нестандартных шрифтов на сайт можно воспользоваться как Гугл фонтс, так и загрузить их на сайт, а потом просто подключать. Второй способ лучше, т.к. нет подгрузки с сайта гугла.

Для подключения надо использовать код:
@font-face {
font-family: 'myfonts'; /*Любое имя для шрифта*/
src: local('☺'), url('/templates/svadba/css/webfont.ttf'); /*Папка, где лежит шрифт шрифта*/ }

Чтобы использовать этот шрифт пишите, к примеру так:
body {font-family: 'myfonts', Arial}

Упрощенный код подключения шрифта:
@font-face {
font-family: r1; /*Любое имя для шрифта*/
src: url(r1.ttf); /* Путь к файлу со шрифтом */ }

Иногда бывает, что стандартные ttf шрифты не работают - в этом случае либо они не поддерживают кириллицу, либо их надо преобразовать в расширение .otf, а затем использовать именно .otf версию шрифта.
Хороший онлайн преобразователь здесь: http://ru.fonts2u.com/font-converter.html

Кроссбраузерное подключение для старых IE и новых браузеров

Ужастные, старые браузеры IE не поддерживают подключение шрифтов. Для этого надо нужный шрифт перевести во-первых в другой формат .eot (можно здесь: http://www.fontsquirrel.com/tools/webfont-generator или здесь: ), а затем использовать следующий код:

/*для Internet Explorer*/
@font-face {
font-family: 'myfonts'; /*Любое имя для шрифта*/
src: local('☺'), url('/templates/svadba/css/webfont.eot'); /*Папка, где лежит шрифт шрифта*/ }

/*для других браузеров*/
@font-face {
font-family: 'myfonts'; /*Любое имя для шрифта*/
src: local('☺'), url('/templates/svadba/css/webfont.ttf'); /*Папка, где лежит шрифт шрифта*/ }

В этом коде сначала грузится .eot шрифт для IE, а для нормальных браузеров .ttf шрифт