23:31 14.10.2012 Enjoy Life Forever StyleBook Пояснения Содержание: 1. Состав файлового архива стиля Enjoy Life Forever 2. Коды CSS для сайта __________________________________________________________________________________________________ 1. Состав файлового архива стиля Enjoy Life Forever __________________________________________________________________________________________________ ===Матрицы ============================= EnjoyLifeForever_Stylebook.cdr - элементы стиля в кривых (CorelDraw 15 \ Шрифты в архиве fonts.rar) EnjoyLifeForever_Stylebook.pdf - превью книги стиля (Adobe Reader 5) fonts.rar - шрифты стиля (Ubuntu и Trebuchet MS\стандартный шрифт Windows) EnjoyLifeForever_Site.png - превью оформления сайта ===для Сайта (папка Site) ==================== EnjoyLifeForever_Site_PSD.rar - файлы PSD (послойно) для оформления сайта EnjoyLifeForever_Site_PSD.gif - превью архива cut.gif - файл заглушка, прозрачный * EnjoyLifeForever_Site_BckgBLOCK-628-List.jpg - фон Поста EnjoyLifeForever_Site_BckgBLOCK-950.png - фон Виджетов EnjoyLifeForever_Site_BckgFOOTER_1600x200.png - фон подвала EnjoyLifeForever_Site_BckgMAIN-1150x825.jpg - фон страницы (header) EnjoyLifeForever_Site_Logo-960x200.png - логотип для шапки кнопки меню: EnjoyLifeForever_Site_ButtonBlue.png EnjoyLifeForever_Site_ButtonGold.png EnjoyLifeForever_Site_ButtonOrange.png EnjoyLifeForever_Site_ButtonRed.png ===дополнения (папка adv) ===================== EnjoyLifeForever_Site_BckgBLOCK-298.png - фон Виджетов 2 EnjoyLifeForever_Site_BckgBLOCK-628-List.png - фон Поста \ прозрачный EnjoyLifeForever_Site_BckgFOOTER_2560x250.jpg - фон подвала \ широкий, без знака EnjoyLifeForever_Site_BckgMAIN-1600x1148.jpg - фон страницы (header) \ широкий, для 1600 px ===Логотипы растровые (папка logo_PASTRE) ========== =иконки EnjoyLifeForever_Logo-ico11x11.gif EnjoyLifeForever_Logo-ico16x16.gif =разное EnjoyLifeForever_Site_Logo-50x50.gif EnjoyLifeForever_Site_Logo-60x60-mini.gif EnjoyLifeForever_Site_Logo-60x60.gif EnjoyLifeForever_Site_Logo-92x70-.gif EnjoyLifeForever_Site_Logo-92x70.gif EnjoyLifeForever_Logo-100x100-.gif EnjoyLifeForever_Logo-100x100.gif EnjoyLifeForever_Logo-100x100.png EnjoyLifeForever_Site_Logo-537x124.png ===Иллюстрации (архив ClipArt) =================== __________________________________________________________________________________________________ 2. Коды CSS для сайта, для WordPress __________________________________________________________________________________________________ =* все строки ниже, начинающиеся со знака "=" даны как комментарии, и не переносятся вместе с кодом =a. поместить все файлы оформления в новую папку http://enjoy-life-4ever.com/imagesnew/ =б. добавить коды CSS в header шаблона страниц сайта, в самый низ, между тегами =шаблон вставки: =ищем, где-то выше в тексте шаблона имеется тэг , идём него до тэга , на строку выше него вставляем: =а здесь должен теперь находиться закрывающийся тэг =конец шаблона вставки. =в. заменить логотип для шапки сайта, файл EnjoyLifeForever_Site_Logo-960x200.png =вместо имеющегося сейчас файла http://enjoy-life-4ever.com/wp-content/themes/gray-white-black/images/headers/enjoy1.jpg залить на сайт новый EnjoyLifeForever_Site_Logo-960x200.png и заменить в шаблоне ____________________пояснения по CSS __________________________ =Фон для страниц, файл EnjoyLifeForever_Site_BckgMAIN-1150x825.jpg === код CSS, заливку цветом страницы убираем, фоном ставим нашу картинку, центруем сверху и посередине body { background-image: url(http://enjoy-life-4ever.com/imagesnew/EnjoyLifeForever_Site_BckgMAIN-1150x825.jpg); background-repeat: no-repeat;background-position: center top; background-color: transparent; } _______________________________________________________________ =Фон для пунктов меню, файлы: =главная - EnjoyLifeForever_Site_ButtonRed.png =статьи - EnjoyLifeForever_Site_ButtonGold.png =обо мне - EnjoyLifeForever_Site_ButtonOrange.png =контакты - EnjoyLifeForever_Site_ButtonBlue.png =* показано на примере кода CSS для кнопки "ГЛАВНАЯ", далее прописываем такой же код для каждого #menu-item[подставляя номер кнопки], заменяя для каждого номера соответствующее кнопке имя файла: ===для ГЛАВНАЯ: рисунок красный (ButtonRed), повторяется по горизонтали, выровнен лево-верх, заливка цветом - прозрачный, цвет текста - белый #menu-item-6 { background: url(""http://enjoy-life-4ever.com/imagesnew/EnjoyLifeForever_Site_ButtonRed.png""); background-repeat: repeat-x;background-position: left top; background-color: transparent; color: white; } =добавляем функциональность меню .header ul.menu>li>a {background: #bf1313 url("http://enjoy-life-4ever.com/imagesnew/cut.gif") 0 0 repeat-x; color: #fff;} .header ul.menu>li>a:hover, .header ul.menu>li:hover>a, .header ul.menu>li.current-menu-item>a, .header ul.menu>li.current_page_item>a {background: #bf1313; color: #fff;} .header ul.menu ul li a {background: #bf1313; color: #fff;} .header ul.menu ul li a:hover, .header ul.menu ul li:hover>a {background: #e0d0a3; color: #fff;} _______________________________________________________________ =Фон для главного блока страницы, файл EnjoyLifeForever_Site_BckgBLOCK-628-List.jpg === код CSS .main { background-image: url(http://enjoy-life-4ever.com/imagesnew/EnjoyLifeForever_Site_BckgBLOCK-628-List.jpg); background-repeat: no-repeat; background-position: right top; background-color: white; } _______________________________________________________________ =Фон для остальных блоков страницы, файл EnjoyLifeForever_Site_BckgBLOCK-298.png === код CSS .main { background-image: url(http://enjoy-life-4ever.com/imagesnew/EnjoyLifeForever_Site_BckgBLOCK-298.png); background-repeat: no-repeat; background-position: right top; background-color: white; } _______________________________________________________________ =Фон для низа страницы, файл EnjoyLifeForever_Site_BckgFOOTER_1600x200.png === код CSS .footer { background-image: url(http://enjoy-life-4ever.com/imagesnew/EnjoyLifeForever_Site_BckgFOOTER_1600x200.jpg); background-repeat: no-repeat; background-position: right center; background-color: #3b4f1a; } _______________________________________________________________ end Readme