В прошлом моём посте про WordPress мне был задан вопрос: "как мне уменьшить высоту картинки в шапке темы?".
Попробую ответить как можно подробнее :)
Простая тема для WordPress состоит из нескольких строительных блоков: ("header" (шапка), "content" (контент), и "footer" (подвал)). Обычно это файлы, которые находятся в папке темы: header.php, index.php, page.php, single,php и footer.php. Каждый из этих файлов определяет соответственно из чего будет состоять верхняя часть блога (header), средняя часть - посты (content) и нижняя часть (footer). Перечисленные выше файлы определяют только структуру страницы блога, за внешний вид отвечает файл style.css - файл каскадных стилей.
И если мы хотим изменить только высоту рисунка, то нам надо будет работать только с файлом style.css, остальные файлы не трогаем :)
В файле style.css находим строки:
#header {
background-color: #73a0c5;
margin: 0 0 0 0px;
padding: 0;
height: 160px;
width: 900px;
}
#headerimg {
margin: 0;
height: 160px;
width: 100%;
}
Давайте разберёмся что здесь к чему. #header и #headerimg это стили, которые относятся и элементам страницы с одноимённым идентификатором. То есть, стиль #header отвечает за то как будет выглядеть элемент <div id="header">, а стиль #headerimg за элемент <div id="headerimg">.
Итак как мы помним мы хотели уменьшить высоту рисунка, значит нам надо изменить две стоки в этих стилях: height: 160px. Меняем цифровое значение на то которое нам надо, допустим на 100px. И в результате получаем:
#header {
background-color: #73a0c5;
margin: 0 0 0 0px;
padding: 0;
height: 100px;
width: 900px;
}
#headerimg {
margin: 0;
height: 100px;
width: 100%;
}(примечание: если в style.css есть другие стили с таким же идентификатором #header и #headerimg с заданным значением высоты - height, то это значение также надо поменять)
Однако на этом наша работа не заканчивается, нам остаётся только изменить высоту самого рисунка. Это можно сделать в любой программе для редактирования растровой графики, например в Photoshop.
Если Вы хотите заменить сам рисунок шапки, то для этого можно либо поменять стиль: (#header {
background: #73a0c5 url('images/kubrickheader.jpg') no-repeat bottom center;} ), либо заменить рисунок kubrickheader.jpg в папке images своим рисунком.
