Главная » Интересное » Firebug для Firefox — как пользоваться необходимым плагином для вебмастеров

Firebug для Firefox — как пользоваться необходимым плагином для вебмастеров

Здравствуйте, уважаемые друзья!
Сегодня я напишу об одном очень полезном дополнении для браузера Firefox, которое называется Файрбаг. С помощью этого плагина можно легко делать различные изменения и доработки на своем сайте, не владея особыми знаниями css или html. Но больше всего плагин мне нравится за то, что он позволяет забрать на свой сайт любой элемент другого ресурса сети интернет :smile:.

Признаюсь честно, я не знаю на 100% языков программирования css или html, но, тем не менее, все, что есть на моих ресурсах, сделано мной. Я переделал два бесплатных шаблона, сделал форму подписки, 404 страницухлебные крошки, кнопки социальных сетей,  пользовательский поиск Google и многое другое. В этом всем помог мне, конечно, плагин Firebug для Firefox.

Моя схема очень проста, я нахожу на чужом сайте элемент, который мне нравится, копирую его html код и css стили. Потом эти коды вставляю на свой ресурс и получаю идеальный результат. Я могу, конечно, сделать это все сам, но зачем тратить время, если есть люди, которые все уже сделали :smile:.

Итак, сейчас я напишу, где скачать дополнение Firebug для Firefox и подробно опишу, как пользоваться Firebug.

Для установки перейдите на эту страницу  и нажмите на кнопку «Добавить в Firefox»:

firebug скачать бесплатно

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

Для начала вам нужно открыть абсолютно любой сайт в браузере Mozilla Firefox, нажать в любом месте сайта правой кнопкой мыши и выбрать пункт в самом низу «инспектировать элемент с помощью Firebug»:

инспектировать элемент с помощью Firebug

Сейчас нам открылось окошко, в левой части которого расположен html код, а в правой css. Это окошко мы можем свернуть, развернуть или закрыть. Также, его можно просто сузить или расширить, если навести курсор на край окна.

дополнение firebug

Начнем с самого интересного, как с помощью расширения Firebug для Firefox можно забрать на свой сайт любой элемент другого сайта. Припустим, я хочу забрать со своего блога кнопку «оставить комментарий». Для этого выбираю специальный инструмент в левом верхнем углу (просто кликаю на него левой кнопкой мыши):

firebug для firefox

Навожу этим инструментом на кнопку и кликаю по ней:

плагин firebug

Теперь слева плагин Firebug для Firefox показывает мне html код этой кнопки, а справа css стили:

расширение firebug

Все что мне нужно, это просто скопировать сначала html код и вставить в то место, где я хочу видеть кнопку на своем сайте. Потом скопировать css стили и вставить в файл стилей. Кроме этого нужно скачать также саму кнопку, закинуть ее на свой хостинг и прописать путь к ней в таблице стилей. А можно и не скачивать, а просто сделать скриншот кнопки, как я в этой статье :smile:.

Кроме этого с помощью файрбаг можно посмотреть полный html код другого сайта или таблицу стилей:

дополнение firebug

Можно отредактировать и html код, а после этого сразу же посмотреть изменения на странице:

Firebug

Содержание некоторых html тегов изначально скрыто. Если это так, то рядом с тегом будет значок «+». Если тег раскрыт, то « — »Для того, чтобы скрыть или раскрыть все теги, достаточно кликнуть на значок мышкой:

Firebug для firefox - как пользоваться

Нравится в Firebug и то, что прямо на сайте можно все что угодно изменить, и смотреть, как после этого будет выглядеть сайт. Потом достаточно просто обновить страницу, и все вернется на свои места:

плагин firebug

Можно просто убрать какой-нибудь элемент стилей:

firebug для firefox убрать

Если навести курсор мыши на файл стилей, то можно увидеть путь к ней на хостинге. А если кликнуть, то вы увидите полное ее содержание:

файрбаг

Плагин Firebug также удобен тем, что с его помощью можно очень быстро посмотреть код любой ссылки. Не секрет, что ссылки могут быть закрыты от индексации тегом rel="nofollow" или noindex, а также проставлены через редирект. Для того, чтобы это все увидеть, достаточно кликнуть правой кнопкой мыши на ссылку и выбрать пункт «инспектировать элемент с помощью Firebug». С помощью html кода мы можем легко определить, ссылка открыта для индексации или закрыта.

Как видите плагин Firebug для Firefox – это очень полезная штука. Я пользуюсь браузером google chrome, но если мне нужно что-то прикрутить к своему сайту, то открываю Мазилу, потому что там есть дополнение Файрбаг. Советую обязательно установить на свой браузер это расширение, и даже если вам поначалу что-то покажется непонятным, то со временем вы научитесь хорошо им пользоваться и сможете существенно упростить свою работу.

На этом все на сегодня. А что вы думаете по поводу этого плагина?

vachevskiy 19 января 2014