Firebug. Дополнение к Mozilla Firefox

Firebug это дополнение к Mozilla Firefox, которое можно использовать для проверки кода веб-сайта, изменения CSS и обнаружения ошибок.

Загрузить дополнение можно с официального сайта http://getfirebug.com/. Нажмите на кнопку Install Firebug (Установить Firebug) на сайте, чтобы установить дополнение.

После установки Вы увидите значок в виде жучка в правом нижнем углу браузера.

Если значок не появился, убедитесь, что Панель Дополнений включена в настройках браузера. Для этого перейдите к меню Вид > Панель инструментов > Панель Дополнений

Чтобы открыть окно Firebug нажмите на значок жучка. Вы должны увидеть рабочий блок Firebug:

Просмотр HTML кода

Просмотр HTML кода поможет определить расположение нужных Вам элементов. Он показывает HTML-теги, классы, их содержание.

1. Нажмите на значок Firebug в правом нижнем углу окна браузера
2. Нажмите на кнопку Инспектировать
3. Наведите курсор мыши на элемент, который хотите найти.

Пожалуйста, ознакомьтесь с детальным, обучающим видео ниже:

Редактирование стилей CSS

Редактирование стилей CSS через Firebug позволяет видеть как изменения повлияют на Ваш сайт, какие атрибуты стиля относятся к каждому элементу и как Вы можете их изменить.

1. Нажмите на значок Firebug в правом нижнем углу окна браузера
2. Нажмите на кнопку Инспектировать
3. Наведите курсор мыши на элемент, который хотите найти.
4. В правой колонке рабочего экрана Firebug отредактируйте стили CSS.

Обратите внимание, Firebug также показывает нужные строки в файле CSS, где Вы можете найти необходимый элемент класса. Наведение курсора мыши на имя файла CSS покажет Вам расположение нужного файла.

Изменения, сделанные в Firebug, не будут сохранены. Вы можете только увидеть как изменения повлияют на Ваш сайт. Чтобы сохранить изменения необходимо редактировать указанные .HTML и .CSS файлы.

Пожалуйста, ознакомьтесь с детальным, обучающим видео ниже:

Обнаружение ошибок

Иногда при установке шаблона некоторые функции могут не работать. Без инструментов разработчика трудно найти причину проблемы. Дополнение Firebug поможет найти и устранить проблему. Если на сайте есть какие-либо ошибки — Firebug будет показывать их в правом нижнем углу.

Откройте окно Firebug и перейдите ко вкладке "Консоль". Убедитесь, что Вы включили опции "Показывать ошибки Javasctipt" и "Показывать Ошибки Сети". Затем обновите страницу веб-сайта.

Firebug покажет все ошибки на сайте и некоторые подсказки, необходимые для их решения.

Большинство ошибок имеют свои коды. На скриншотах выше Вы можете увидеть ошибки 404. Это означает, что указанные файлы отсутствуют. Попробуйте перезагрузить их на сервер.

Вы также можете использовать вкладку "Сеть", чтобы увидеть файлы, которые являются причиной ошибок. Ошибки будут отмечены красным цветом.

Пожалуйста, ознакомьтесь с детальным, обучающим видео ниже: