Minimal 15.02.2011 14:41

Урок, пишем свой движок блога.Урок 2: Обзор папок themes, lang. Детали папки include.

Начнем второй урок. Сразу предупреждаю что буду отвечать только на здоровые комментарии, относящиеся строго к сути статьи, остальные комменты типа "зачем велосипед" будут игнорироваться, давайте не будем захламлять флеймом.

ПРОДОЛЖАЕМ!

Начнем с обзора папки themes - эта папка служит для хранения шаблонов нашего сайта.
Создаем в ней папку будущего шаблона назовем ее test (название может быть любым), также туже создаем пустой файл index.html он потребуется для скрытия просмотра папки, есть и второй способ ограничения доступа, делается через файл .htaccess, я воспользовался на данном этапе index файлом, считаю что на данном этапе этого пока достаточно.

Переходим к обзору созданной папки в моем случае это папка test.
Создаем в ней файл main.tpl - этот файл будет отвечать за внешний вид нашего сайта, точнее будет хранить макет шаблона, создаем файл style.css - этот файл отвечает за стили нашего шаблона, создаем файл function_show_list.tpl - этот файл отвечает внешний вид (шаблон) функции function_show_list - эта функция будет отвечать за вывод списка постов, создаем файл пустой index.html.

Заполняем созданные файлы:

Файл main.tpl - содержит в себе html, для заполнения файла можно воспользоваться готовыми шаблонами, или написать свой, четких правил для написания этого шаблона нет, все в произвольной форме, только главное не забудьте указать теги для вывода, а то на выводе получите все тот же голый шаблон.
Служебные теги:
{blog_name} - выводит название блога
{blog_slogan} - выводит слоган блога
{blog_url} - выводит адрес блога
{page_title} - заголовок страницы
{config_keywords} - ключевые слова блога
{post_keywords} - ключевые слова поста
{config_description} - краткое описание блога
{post_description} - - краткое описание поста
{content} - выводи контент
{menu_category} - выводит меню категорий
{counter} - выводит счетчики
{copyright} - выводит авторские права

Я быстренько набросал простейший шаблончик, вот что получилось main.tpl:

 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!doctype html>
<html lang="ru">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="author" content="Minimal">
<meta name="keywords" content="{config_keywords}, {post_keywords}">
<meta name="description" content="{config_description}, {post_description}">
<meta name="generator" content="minimal blog v.1.0.0 beta">
<link rel="stylesheet" href="/themes/test/style.css" type="text/css">
<title>{page_title} - <{blog_name} - {blog_slogan}></title>
</head>
<body>

<!-- BEGIN #wrapper -->

<div id="wrapper">

<!-- BEGIN #header -->

<div id="header">

<h1><a href="{blog_url}">{blog_name}</a></h1>

<p>{blog_slogan}</p>

</div>

<!-- END #header -->

<!-- BEGIN #middle -->

<div id="middle">

<!-- BEGIN #container -->

<div id="container">

<!-- BEGIN #content -->

<div id="content">

{content}

</div>

<!-- END #content -->

</div>

<!-- END #container -->

<!-- BEGIN #side -->

<div id="side">

<h1>Темы блога</h1>

{menu_category}

<h1>Counter's</h1>

<p>{counter}</p>

</div>

<!-- END #side -->

</div>

<!-- END #middle -->

</div>

<!-- END #wrapper -->

<!-- BEGIN #footer -->

<div id="footer">

<p>© <a href="{blog_url}" title="{blog_name} - {blog_slogan}">{blog_name}</a></p>

<p>{copyright}</p>

</div>

<!-- END #footer -->

</body>
</html>



Файл style.css Также быстро набросал файл стиля:

  1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
* {
margin: 0;
padding: 0;
}

html {
height: 100%;
}

body {
font: 13px/19px Arial, Verdana, sans-serif;
width: 100%;
height: 100%;
background: #285079;
color: #eaeaea;
}

a:link, a:visited {
color: #ffa500;
outline: none;
text-decoration: none;
}

a:hover, a:active {
color: #ffa500;
text-decoration: underline;
}

p {
margin: 10px 0px 10px 0px;
}

img {
border: none;
}

input {
vertical-align: middle;
}

#wrapper {
width: 940px;
margin: 0 auto;
min-height: 100%;
height: auto !important;
height: 100%;
}

/* === Header === */

#header {
height: 120px;
border-bottom: 1px dashed #eaeaea;
margin: 0px 0px 30px 0px;
}

#header h1 {
font-size: 36px;
margin: 0;
padding: 50px 0px 0px 0px;
}

#header p {
margin: 10px 4px 0px 0px;
padding: 0;
}

#header a:hover, a:active {
text-decoration: none;
}

/* === Middle === */
#middle {
width: 100%;
padding: 0px 0px 100px 0px;
height: 1%;
position: relative;
}

#middle:after {
content: '.';
display: block;
clear: both;
visibility: hidden;
height: 0;
}

#container {
width: 100%;
float: left;
overflow: hidden;
}

#content {
padding: 0px 320px 0px 0px;
}

.post {
margin: 0px 0px 30px 0px;
}

.post h1 {
font-size: 18px;
}

.post .datetime {
margin: 5px 0px 15px 0px;
/*font-weight: bold;*/
font-style: italic;
}

/* === Sidebar === */
#side {

float: left;
margin-right: -3px;
width: 300px;
margin-left: -300px;
position: relative;

}

#side h1 {
font-size: 18px;
color: #ffa500;
}

#side ul
{
margin: 0px 0px 30px 0px;
padding: 0px 0px 0px 0px;
line-height: 160%;
list-style-type: none;
}

#side li
{
padding: 5px;
border-bottom: 1px dashed #eaeaea;
}

#side li:hover
{
border-bottom: 1px dashed #ffa500;
}

#side li a:link,
#side li a:visited
{
font-weight: bold;
margin: 0;
padding: 0;
}

#side li a:hover,
#side li a:active
{
margin: 0;
padding: 0;
text-decoration: none;
}

/* === Footer === */
#footer {
width: 940px;
margin: -100px auto 0;
height: 100px;
border-top: 1px dashed #eaeaea;
padding: 10px 0px 0px 0px;

}

#footer p {

margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}




Файл function_show_list.tpl также как и main.tpl содержит в себе html, этот файл нужен для настройки вывода листа постов.
Служебные теги:
{title_category} - вывод заголовка категории
{url_category} - вывод адреса категории
{title_post} - вывод заголовка поста
{url_post} - вывод адреса поста
{date_post} - вывод даты
{time_post} - вывод времени
{text_short_post} - вывод краткой версии поста

Быстренько набросал простейший шаблончик, вот что получилось function_show_list.tpl:

1
2
3
4
5
6
7
8
9
<div class="post">

<h1><a href="{url_category}">{title_category}</a> » <a href="{url_post}">{title_post}</a></h1>

<p class="datetime">Добавлено: {date_post} в {time_post}</p>

<p>{text_short_post}</p>

</div>



На этом пока все с папкой themes.

Переходим к обзору папки lang - папка отвечает за локализацию ядра.
Создаем в папке lang папку ru - в этой папке будет хранится наша локаль, и все тот же пустой index.html.
Переходим в папку ru и создаем там файл lang.php - файл с локалью, и тот же пустой index.html.

Файл lang.php - пока в этом файле всего одна запись, в будущем будем заполнять его.

1
2
3
4
5
&lt;?php

define('LANG_SHOW_LIST', 'Лента постов');

?&gt;



define( name, value ); - определяет именованную константу, имя константы задаётся параметром name; значение - параметром value.

На этом пока все с папкой lang.

Переходим к обзору папки include - тут находятся подключаемые файлы.
Создаем в папке include следующие файлы config.php - отвечает за конфигурацию блога, core.php - ядро блога, filter.php - класс фильтрации данных, function.php - все функции блога, mysql.php - конфигурация базы данных и соединение, tags.php - содержит в себе функции всех служебных тегов, index.html - все тот же и пустой, и папку function - подключает функции блога.

Надо срочно бежать, продолжу вечером.

ПРОДОЛЖЕНИЕ СЛЕДУЕТ!

Урок 1 / Урок 3


Тэги: blog cms mysql php Урок
+ 2 -
Похожие Поделиться

ak3n 15.02.2011 15:08 #

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Почему бы не

<!doctype html>
<html lang="ru">


И почему не class="post"
Ведь id нельзя употреблять больше 1 раза на странице.
Minimal 15.02.2011 15:15 #
я этот шаблон с генерировал на скорую руку на css генераторе, особого него не правил по этому как есть, на данном этапе шаблон не столь важен.

а по поводу классов или id мой валидатор не показал ошибки по этому так )
можно поправить всегда, это мелочи

П.С. за нормальные комменты получаешь +1
ak3n 15.02.2011 15:21 #
Лучше сразу делать правильно. Потому что потом все начинает скатываться в снежный ком в котором лень разбираться.

Он не показал ошибки, потому что ты наверное пока выводишь только 1 элемент с id="post". Когда это дело будет в цикле будет уже куча элементов с id="post", это уже ошибка.

Надеюсь, что твой валидатор - http://validator.w3.org/

P.S. Нормальных комментов у меня много.
Minimal 15.02.2011 15:25 #
нет их у меня 4 уже, что спорить поправим.
_DM_ 15.02.2011 15:18 #
XHTML написать написали, но его стандартов не придерживаетесь. Отсюда подозрения...

Ведь id нельзя употреблять больше 1 раза на странице.

Так же и тег h1 должен быть один на странице.
xT 15.02.2011 16:54 #
Большие листинги стоит прятать в спойлер
wiz 15.02.2011 17:36 #
Уже второй урок, а рабочего кода всё нет...
exelens 15.02.2011 17:44 #
Что именно ты хочешь?
wiz 15.02.2011 17:45 #
Я бы хотел видеть уроки так:

1. Работает совсем чуть-чуть, но работает. Это УЖЕ блог.
2. Больше рюшечек
3. Больше рюшечек
4. Больше рюшечек
???
PROFIT!
exelens 15.02.2011 17:51 #
Думаю, что если скептики и дальше будут ему выносить мозг то до ожидаемых тобой частей не дойдёт.
wiz 15.02.2011 17:52 #
Про то и речь. А так хоть с первой же части уже было бы на что посмотреть...
exelens 15.02.2011 17:54 #
Может ты слишком быстр? =)

Куда спешить... Я понимаю тут у нас КУРЫ ГУРЫ кодинга вокруг... Подождать нужно.
exelens 15.02.2011 17:54 #
2. Больше рюшечек
3. Больше рюшечек
4. Больше рюшечек

ой, это уже БИТРИКС получился =))
wiz 15.02.2011 17:56 #
ну да. а потом продаёшься 1c и PROFIT!
Minimal 15.02.2011 17:52 #
Будет тебе код, жди.
GalS 15.02.2011 17:58 #
В основном придирки по форме:
также туже создаем

создаем файл function_show_list.tpl - этот файл отвечает внешний вид (шаблон) функции function_show_list - эта функция будет отвечать за вывод списка постов
Кто за что отвечает ???
{copyright} - выводит авторское право
хм-м-м...
BIGIN

пака хранит
бывает понимаю

Кроме запятых, в тексте стоит использовать и точки - для разделения на предложения.
Minimal 15.02.2011 18:05 #
+1

Пишу как говориться на коленке.
kirpichtion 16.02.2011 07:18 #
А по каким праздникам ты пишешь не на коленке?
Minimal 16.02.2011 10:30 #
Слушай, я пишу исключительно в свое удовольствие, могу накодить чтоб пользователей с именем КиRилл )))) при написание коммента "посылали лесом".

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

Надеюсь фрилансеры меня понимают ;)
inst 19.02.2011 13:27 #
За этот блог мне не кто не платит, он бесплатный сыр.
По этому нет смысла мне его выводить и шлифовать до идеала.
Если так рассуждать, то и за Linux никто не платит, так что никто не должен доводить его до идеала.
Sylar 15.02.2011 18:10 #
BIGIN как-то режет глаз.
Volant 15.02.2011 19:27 #
И всё бегом, бегом, впопыхах.

А ведь придумали же люди WordWriter для таких вещей.
kirpichtion 16.02.2011 07:17 #
От чего не использовать Smarty или что-то еще? Зачем делать функцию отвечающую за вывод списка? Здоровый лоб, неужели не понимаешь что это идиотизм. Твой код пропитан смрадом Data Life Engine. Пойми, есть в мире веб-разработки вещи более качественные и достойные внимания. Обрати свой взор к ним.
Minimal 16.02.2011 10:33 #
Кто говорит что я не вижу их?
Бесплатный сыр - пишу в свое удовольствие как хочу и что хочу, не нравится проходи мимо.
Volant 16.02.2011 11:04 #
Отвечу немного по-другому.

Есть и Joomla и Bitrix и Drupal. Но во-первых статья называется "пишем сами", во вторых - расширение кругозора даже, если кто-то захочет написать свою ОСь - не будет лишним, хотя вон они - ОСи - десятки - выбирай любую.
vovans 16.02.2011 16:09 #
да автор цикла статей в самом начале сказал - покажу как писать свою ЦМС, потому что вордпресс говно, а больше ничего нет :)

То, что пытается писать с нуля, это конечно же хорошо! :) но аргументация...

Кстати, интересно было бы так же нечто подобное на базе фреймворка... Правда, без знаний чистого пыха, пожалуй, с фреймворками пока лучше работать...