Сайт на локальном сервере (продолжение)
Каждому хочется сделать, что-то своё уникальное, оригинальное, не похожее. И даже очень симпатичный шаблон, рано или поздно захочется изменить, сделать что-то по-своему.
Запустив на Денвере, CMS Сmsimple, как было мною описано, вы увидите серый, не приметный дизайн. Можно оставить и так, если сайт ни кому не показывать. Но я предполагаю, что вы всё-таки намерены поселить его в сети. Значит, переделка или адаптация шаблона обязательна.
Любая CMS использует шаблоны разметки. По-разному использует, есть в одном файле, есть, разбиты на несколько. В данном случае, это один файл, [cmsimple/templates/default/template.htm], в котором и находится наш шаблон. Откройте его блокнотом винды, или каким либо редактором, или в самой CMS [Login, Настройки, Редактировать шаблон] . Например, в тринадцатой строке мы видим: php echo head(), в опусе «Структура HTML или начало начал!» я рассказывал, о том, что такое head, и что между headерами стоит. Автор Сmsimple строкой php echo head() выводит всё необходимое, как он считает. И если вы уже хоть чуть-чуть постигли способы и методы разметки, вы найдёте в файле много подобных PHP вставок. Эти PHP вставки и выводят на нашу страничку всё необходимое, то что мы с такими муками придумывали.
Список тегов разметки, которые необходимо принять за данность в CMS Сmsimple:
php echo head() - вставляет meta-тэги страницы
php echo onload() - размещается внутри тега
. Вставляет параметры страницы.php echo toc() - выводит главное меню.
php echo editmenu() - в режиме администратора, выводит админскую панель
php echo content() - выводит контент страницы.
php echo loginlink() - выводит ссылку для входа в режим администратора - «Login».
php echo searchbox() - выводит ссылку «Поиск по сайту».
php echo submenu() - выводит меню страниц данного раздела.
php echo locator() - выводит маршрут по сайту.
php echo sitemaplink() - выводит ссылку «Карта сайта».
php echo languagemenu() - выводит языковое меню.
php echo lastupdate() - выводит дату последнего обновления сайта.
php echo sitename() - выводит название сайта.
php echo printlink() - выводит ссылку «Версия для печати».
php echo mailformlink() - выводит ссылку на форму обратной связи по email.
php echo guestbooklink() - выводит ссылку на гостевую книгу.
php echo previouspage() - выводит ссылку «Предыдущая страница».
php echo nextpage() - выводит ссылку «Следующая страница».
В этой CMS их не много, для полноценного сайта хватит. Посмотрите внимательно, где стоят эти теги в нашем шаблоне, и, я уверен, вы поймёте что и где можно поменять, чтобы ваш сайт стал привлекательным. А если встретится непонятная строка, например: php echo $pth['folder']['templateimages'], которая выводит картинку, расстраивается и паниковать не стоит. Принимаем это за данность.
Табличная вёрстка заключает в себе правильное расположение и придание свойств тегам table, tr, td. Броузер принимая и расшифровуя, то, что мы на ваяли, вырисовывает фоны, чёрточки, буковки и располагает в определённых местах картинки. Так мы и получаем результат.
Обратите внимание на шестнадцатою строку: table align="center" width="750" border="0" cellpadding="0" cellspacing="0". Особенно на: align="center" width="750". align="center" - это значит, что эта таблица стоит по центру, а width="750" - это значит, что ширина этой таблицы 750 пикселей. Так как, в этой таблице располагается всё содержимое нашей странички, то и вся страничка торчит по центру с шириной 750 пикселей. Попробуем увеличить число до 850. Если в панели CMS, то просто сохраните изменения, а если в блокноте или редакторе, то после сохранения обновите броузер. И наша страничка стала ширее, или ширше, как вам больше нравится. А вот, ежели, в четырнадцатой строке, число 808080 поменять на 000000 или на ffffff, если цвет фона менялся, то это правильный путь. Таким образом, можно изменять и не только ширину, цвет, размер шрифта, и всё остальное так же. На высоту полёта, или на цвет светофора, это не повлияет, но внешний вид своего сайта изменит до неузнаваемости можно.
Но есть ещё и свойства. Свойства прописаны в [cmsimple/templates/default/stylesheet.css], В отдельном файле с расширением .css. Который не загружается броузером, а только определяет, как броузер будет отображать тот или иной тег, то есть определяет его свойства.
Например, в файле [template.htm] есть строка body bgcolor="#808080 ?php echo onload();?, а ежели открыть файл [stylesheet.css] блокнотом или редактором, и найти строку BODY, TD {color: black; font: 9pt Verdana, Geneva, Arial, Helvetica;}, то увидим, что есть схожести. Обе строки что-то рассказывают броузеру про тег body. Например, font: 9pt Verdana, Geneva, Arial, Helvetica, рассказывает о размере шрифта, и какой будет применён шрифт. А если поставить 11pt, вместо 9pt, и в некоторых местах увеличится размер букв. В некоторых, потому, что стиль шрифта задан отдельно, там, где он не увеличился, прописаны свои свойства, свой размерчик шрифта.
Как вы видите, это не так уж и сложно, разобраться в этом можно. Результат мгновенным, естественно не будет. Научившись с этим управляться в самом начале, вы будете себя уверенно чувствовать в дальнейшем.
Приверженцев Macromedia Dreamwaver, FrontPage, E-Gloryon, Site Generator, SiteEdit или подобного, прошу не читать. А если прочитали и ваше мнение не изменилось, извините, зря. Быстрый результат, как правило, несёт в себе массу ошибок, недоработок, лишнего и необдуманного. Используя конструкторы можно добится тог, что сайт может и выглядеть хорошо, ну если вспомнить «китайскую» продукцию, которая тоже выглядит хорошо, и делается быстро, то можно провести апологию. Это конечно вам решать, или шлёпнуть быстро «китайский» сайт, или научится чему то стоящему. Научится, дольше и труднее, но результативнее. Я так думаю.
Для облегчения поисков в гугле или яндексе, скачайте небольшой файлик, в котором собраны и описаны практически все теги, свойства, а также таблица базовых цветов и специальные символы.
PS. Для финансовой поддержки моей писанины, не плохо было бы, не забыть тот факт, что за рекламу платят. Это в том случае, если опус понравился. Если не понравился, ну меня нафиг.
home
rss
email
Оставить комментарий