В этой статье мы немного отойдем от рассмотрения WordPress тем и коснемся поиска необходимых CSS стилей. Очень часто можно столкнуться с тем, что вам требуется изменить некоторые части шаблона или разметки. К примеру, вы хотите убрать границу между сайдбаром и остальной частью страницы. Как найти стили, отвечающие за описание границы?
В этом случае вам придется включить внимательность. Вы знаете, что вам требуется сделать, но не представляете себе, как найти нужное стилевое правило, отвечающее за лишнюю границу.
Самое простое решение — тщательно исследовать исходный код страницы веб-сайта. Сделать это можно следующим способом: открываем свой браузер и выбираем в нем настройку VIEW > PAGE SOURCE (или VIEW > SOURCE). Для активации поиска используйте сочетание клавиш Ctrl+F. Теперь у вас возникнет вопрос: что искать? Раз граница находится у сайдбара, значит, нам нужно найти его идентификатор. Для этого достаточно взять любой заголовок, который находится в сайдбаре. Этот заголовок мы и будем искать.
Введите заголовок в строку поиска и нажмите «Find». Если вы не использовали эту фразу в своих записях, то первое же ее вхождение укажет вам на сайдбар. В противном случае вам нужно будет еще раз щелкнуть по кнопке «Find». Делайте это до тех пор, пока не отыщите требуемую фразу в необходимой области.
Если вы используете Internet Explorer, то вы можете воспользоваться специальным инструментом — Internet Explorer Developer Toolbar, который позволит вам визуально увидеть и выбрать элементы, идентификаторы и классы на странице. Все элементы выводятся в иерархической структуре. Вы всегда можете скачать Internet Explorer Developer Toolbar со страницы Microsoft.
Как только вы найдете требуемую фразу, вам останется лишь отыскать в коде слова, связанные с сайдбаром — sidebar, menu или sidecolumn:
<div id="sidebar"> или <div class="sidebar">
В примере приведена секция, отвечающая за сайдбар. Теперь нам необходимо открыть файл style.css и отыскать в нем правила следующего вида:
#sidebar или .sidebar
Изучите стили, заданные в этих CSS селекторах, и посмотрите, нет ли среди них упоминаний границы. Обычно стили, отвечающие за представление сайдбара, выглядят следующим образом:
#sidebar {position: relative; float: right; width: 170px;
color: blue; font-size: 90%; border-right: solid 1px blue; }
Стоит помнить, что не всегда виновником может выступать именно сайдбар. Иногда граница может быть установлена в основном контенте.
Источник: http://codex.wordpress.org/Finding_Your_CSS_Styles
Доброго времени суток. У меня следующий вопрос: хочется расширить саму тему WP, т.е. сделать немного шире (не что то одно, а все вместе), а то текст выглядит узким на фоне двух сайдбаров слева и справа. Я так понял это тоже в CSS делается. Если есть возможность, подскажи решение проблемы. Где хотя бы искать и что в CSS менять, и как вообще попасть в редактор CSS (не с помощью ли кнопки "исходный код"?))
Пасиб.
Сначала отвечу с конца — попасть в редактор можно именно через кнопку "Исходный код") Но я предпочитаю работать непосредственно с файлами через текстовый редактор Notepad++, у которого есть подсветка кода. Так удобнее разбираться. Правда для этого необходим доступ к файлам через FTP.
Если есть желание расширить тему, то лучше найти подходящую тему, которая бы уже имела достаточный размер. Просто так взять и расширить обычно очень трудно, потому что поменяв одно значение в CSS, потом может сбиться что-то другое, и тогда вообще весь сайт перекосит. Хорошо, если область контента задана в процентах, тогда еще можно их подкорректировать, но в таком случае придется менять проценты и для сайдбаров, чтобы в сумме все составляло 100%. Бывает еще, что область контента фиксирована, но здесь тоже могут возникнуть проблемы с изменением значений. Ручная подгонка всех цифр — это обычно такой геморрой, что лучше сразу от этого всего отказаться, особенно если нет в наличи свободного времени и желания. Проще доверить каким-нибудь фрилансерам, пусть сами парятся по этому поводу за каких-то триста рублей.
Подведу итоги: все зависит от самой темы. Если текст выглядит узким на фоне двух сайдбаров, то лучше найти тему с одним сайдбаром. Это гораздо проще, чем разбираться в дебрях кода. Неизвестно, как прописаны значения, фиксирована ширина у этого шаблона или задана как плавающая. В любом случае, если хочется поэкспериментировать, то лучше делать это на локальном сервере — в онлайн режиме проверять такое я бы не советовал, потому что если посетители зайдут на ресурс и увидят там перекошенную тему, то они уже вряд ли вернутся. И никаких объяснений по поводу экспериментов с темой слушать не захотят)
Мне нужно 2 сайтабара, в этом вся проблема. Я замучился искать подходящую тему под сайт. Тема, что ща стоит вроде норм, но есть свои минусы и один из них — узкость текста.) В любом случае спасибо, теперь не буду париться с тем, что бы самому расширить, раз это проблематично…
Как только появился Яндекс браузер с элементами для разработчика, поиск и замена стала сущим пустяком. Теперь можно отыскать нужный элемент и прямо в браузере заменить стили и посмотреть что меняется!