diff --git a/pskov/en/education.01.why.html b/pskov/en/education.01.why.html index 73d93f3..2e095be 100644 --- a/pskov/en/education.01.why.html +++ b/pskov/en/education.01.why.html @@ -64,9 +64,17 @@ text-align: left; color: #444; } + #footer + { + text-align: center; + } + #lang + { + float: right; + }
You might know there already exist quite a lot of static site generators, why create another one? Because they are not good enough for Opensource Game Studio needs.
+You might know there already exist quite a lot of static site generators, why create another one? Because they were not good enough for Open Game Studio needs.
Here's a list of features we don't need:
1 | Learning anything beyond HTML, CSS, JavaScript, and Markdown | -These technologies are enough to deliver information to users | +These technologies are enough to have a clean web site |
2 | @@ -129,12 +141,12 @@ Education: 01. Why|||
3 | Installation | -We had enough updates that were never requested | +No more forced updates that were never requested |
4 | Comprehensible source code | -Single file with just enough number of lines | +No more millions of source code files |
Table of contents
cfg
filepskov.cfg
fileitem.template
fileabout.md
and cv.md
filesSome time later you have the following files in your site directory:
Let's look at their contents closer.
-cfg
filecfg
file has the following contents:
pskov.cfg
filepskov.cfg
file has the following contents:
input = .
item = item.template
-cfg
is an INI file with the following keys specified:
pskov.cfg
is an INI file with the following keys specified:
In our case, item.template
file is located alongside cfg
, so we use .
to denote current directory.
In our case, item.template
file is located alongside pskov.cfg
, so we use .
to denote current directory.
item.template
fileitem.template
file has the following contents:
PSKOV_ITEM_TITLE
Title:
part of page's header sectionTitle
key of the page's Markdown filePSKOV_ITEM_CONTENTS
Notes:
about.md
and cv.md
filesHeader constant | +Header key | Description |
---|---|---|
Title: |
+Title |
Provides value for PSKOV_ITEM_TITLE constant when generating HTML out of Markdown |
Slug: |
+Slug |
Tells PSKOV that particular Markdown file should be saved under <slug>.html filename |
PSKOV_ITEM_TITLE |
-Provides title from Title: part of page's header section |
+Value of Title key of the page's Markdown file |
PSKOV_ITEM_CONTENTS |
@@ -326,21 +338,21 @@ PORT: '8000'
Introduced header constants include:
+Introduced header keys include:
Header constant | +Header key | Description |
---|---|---|
Title: |
+Title |
Provides value for PSKOV_ITEM_TITLE constant when generating HTML out of Markdown |
Slug: |
+Slug |
Tells PSKOV that particular Markdown file should be saved under <slug>.html filename |
Table of contents
cfg
filepskov.cfg
fileNow that you have your web site in English you start to wonder why there's no Russian version, you're Russian after all!
You set on to create the following directory structure:
cfg
pskov.cfg
en/item.template
en/about.md
en/cv.md
Let's look at the contents of these files closer.
-cfg
filecfg
file has the following contents:
pskov.cfg
filepskov.cfg
file has the following contents:
input = en;ru
item = item.template
@@ -185,14 +197,14 @@ item = item.template
PSKOV_ITEM_URL
<slug>.html
As you see, PSKOV_ITEM_URL
is all you need to have your page in as many languages as you please.
en/about.md
and en/cv.md
files look almost exactly as before. ru/about.md
and ru/cv.md
are simply Russian variants of the same pages.
en/about.md
and en/cv.md
files look almost exactly as before. ru/about.md
and ru/cv.md
are simply Russian variants of corresponding pages.
For example, ru/cv.md
has the following contents:
Title: Резюме
Slug: cv
@@ -208,11 +220,11 @@ item = item.template
| Учёба | Императорская Академия художеств |
| Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) |
-Note: Russian page has exactly the same Slug:
value as English one.
Note: Russian page has exactly the same Slug
value as English one.
Launch LFSA so that it points to directory with the files we just observed:
-$ /path/to/lfsa-201905.py /path/to/dir/02.Language
+$ /path/to/lfsa_1.0.0.py /path/to/dir/02.Language
Generate the site:
@@ -235,7 +247,7 @@ item = item.template
PSKOV_ITEM_URL
-Provides generated page's file name: <slug>.html
+Provides generated page's file name
@@ -257,6 +269,11 @@ item = item.template
In this document we create "dynamic" pages like blog posts.
+In this document we create "dynamic" pages for a blog.
Estimated completion time: 20 minutes.
Table of contents
cfg
filepskov.cfg
fileSo, you have your web site in both English and Russian. You start to feel the need to constantly share your thoughts with the world as blog posts.
+So, you have your web site in both English and Russian. You start to feel the need to regularly share your thoughts with the world as blog posts.
You set on to create the following directory structure:
cfg
pskov.cfg
en/blog/
item.template
index.template
Let's look at the contents of these files closer.
-cfg
filecfg
file has the following contents:
pskov.cfg
filepskov.cfg
file has the following contents:
input = en/page;ru/page;en/blog;ru/blog
item = item.template
preview = preview.template
@@ -171,7 +183,7 @@ previewEnding = . . .
previewsPerPage = 3
previewPageBaseName = index
-Apart from already used input
and item
keys, we have quite a lot of new ones. Let's break them down:
You already met input
and item
keys. Let's see into new ones:
preview |
-Points to an HTML template file that is used to generate HTML previews out of the first previewSize (approximately) characters of Markdown files |
+Points to an HTML template that is used to generate HTML preview out of the first previewSize (approximately) characters for each Markdown file |
index |
-Points to an HTML template file that is used to generate HTML index (summary) files to host previews | +Points to an HTML template that is used to generate preview page to host previews |
paginationPrev |
-Points to an HTML template file that is used to generate pagination section used by the last index (summary) file | +Points to an HTML template that is used to generate pagination section to navigate backwards |
paginationNext |
-Points to an HTML template file that is used to generate pagination section used by the first index (summary) file | +Points to an HTML template that is used to generate pagination section to navigate forward |
paginationPrevNext |
-Points to an HTML template file that is used to generate pagination section used by index (summary) files except the ones at the beginning and at the end | +Points to an HTML template that is used to generate pagination section |
previewSize |
-How many characters (approximately) to take out of a Markdown file to generate an HTML preview | +How many characters (approximately) to take out of a Markdown file to generate a preview |
previewEnding |
-String to use at the end of HTML previews | +String to use at the end of each preview |
previewsPerPage |
-Number of HTML previews hosted by single index (summary) file | +Maximum number of previews hosted by a preview page |
previewsPageBaseName |
-Index (summary) file base name | +Base file name for preview pages |
200
characters in size (approximately). . .
string at the end of each preview3
previews maximumindex.html
, index2.html
, index3.html
, etc.3
previews maximumindex.html
, index2.html
, index3.html
, etc.As you can see, both files look similar to item.template
files we saw before.
The changes include:
page
directory and first index (summary) file in blog
directorycontents
section as a link to complete pagepage
directory and the first preview page in blog
directorycontents
section as a link pointing to a complete blog postDate reference uses new PSKOV_ITEM_DATE
constant:
PSKOV_ITEM_DATE
Date:
part of page's header sectionDate
key of the page's Markdown filePreviews have no <head>
, <body>
, and similar full page HTML tags. Previews represent sections inserted into index (summary) files.
Previews have no <head>
, <body>
, and similar full page HTML tags. Previews represent sections inserted into preview pages.
Preview itself is referenced by PSKOV_PREVIEW
constant:
PSKOV_PREVIEW |
-Provides contents from a Markdown file limited by previewSize characters (approximately) |
+Provides contents of a Markdown file limited by previewSize characters (approximately) |
en/blog/index.template
contents:
- - - - Collapsed for brevity - - - -
@@ -411,7 +423,6 @@ PSKOV_PAGINATION
- beginning and ending were collapsed for brevity
PSKOV_INDEX_URL
constant is used to provide language selection
Index (summary) files are used to host previews.
Here are new PSKOV constants explained:
PSKOV_INDEX_URL |
-Provides generated page's file name: <previewsPageBaseName><id>.html |
+Provides generated preview page file name: <previewsPageBaseName><id>.html |
PSKOV_PREVIEWS |
-Provides a combination of PSKOV_PREVIEW sections |
+Provides a set of previews |
PSKOV_PAGINATION |
-Provides pagination section to navigate index (summary) pages | +Provides pagination section to navigate preview pages |
Pagination templates represent sections used to navigate index (summary) pages.
+Pagination templates represent HTML sections to navigate preview pages.
There are free pagination templates:
prev | -Is used for the last index (summary) page because we can only go backwards | +Previous | +A visitor can only go backwards |
next | -Is used for the first index (summary) page because we can only go forward | +Next | +A visitor can only go forward |
both | -Is used for intermediate index (summary) pages because we can either go backwards, or forward | +Both | +A visitor can either go backwards, or forward |
PSKOV_PAGE_ID
1
1
PSKOV_PAGES_COUNT
PSKOV_PREV_PAGE_URL
PSKOV_NEXT_PAGE_URL
Date is used to sort blog posts by date in ascending order:
+Date is used to sort blog posts by date in descending order:
Header constant | +Header key | Description |
---|---|---|
Date: |
+Date |
Provides value for PSKOV_ITEM_DATE constant when generating HTML out of Markdown |
PSKOV_ITEM_DATE |
-Provides date from Date: part of page's header section |
+Value of Date key of the page's Markdown file |
PSKOV_PREVIEW |
-Provides contents from a Markdown file limited by previewSize characters (approximately) |
+Provides contents of a Markdown file limited by previewSize characters (approximately) |
PSKOV_INDEX_URL |
-Provides generated page's file name: <previewsPageBaseName><id>.html |
+Provides generated preview page file name: <previewsPageBaseName><id>.html |
PSKOV_PREVIEWS |
-Provides a combination of PSKOV_PREVIEW sections |
+Provides a set of previews |
PSKOV_PAGINATION |
-Provides pagination section to navigate index (summary) pages | +Provides pagination section to navigate preview pages |
PSKOV_PAGE_ID |
-Provides index (summary) page id starting from 1 |
+Provides preview page id starting from 1 |
PSKOV_PAGES_COUNT |
-Provides total number of index (summary) pages generated | +Provides total number of generated preview pages |
PSKOV_PREV_PAGE_URL |
-Provides previous index (summary) page file name | +Provides previous preview page file name |
PSKOV_NEXT_PAGE_URL |
-Provides next index (summary) page file name | +Provides next preview page file name |
preview
previewSize
(approximately) characters of Markdown filespreviewSize
(approximately) characters for each Markdown fileindex
paginationPrev
paginationNext
paginationPrevNext
previewSize
previewEnding
previewsPerPage
previewsPageBaseName
Introduced header constants include:
+Introduced header keys include:
Header constant | +Header key | Description |
---|---|---|
Date: |
+Date |
Provides value for PSKOV_ITEM_DATE constant when generating HTML out of Markdown |
This was the final document to make you proficient in generating static sites with PSKOV. If you like what we do, support us by joining our group at Twitter, Facebook, or VK.
+This was the final document to make you proficient in generating static sites with PSKOV. If you like what we do, join us at VK, Twitter, or Facebook.
Now use PSKOV to generate your very own web site!
Item | +Property | Details |
---|
Item | +Property | Details |
---|
Item | +Property | Details |
|
---|---|---|---|
Introduced header constants | -
|
+Introduced header keys | +
|
Item | +Property | Details |
---|
Item | +Property | Details | |
---|---|---|---|
Description | -Learn how to create "dynamic" pages like blog posts | +Learn how to create "dynamic" pages for a blog | |
Estimated completion time | @@ -210,13 +222,18 @@ Education
|
||
Introduced header constants | -
|
+Introduced header keys | +
|
If you like what we do, support us by joining our group at Twitter, Facebook, or VK.
+If you like what we do, join us at VK, Twitter, or Facebook.
+ diff --git a/pskov/en/education.md b/pskov/en/education.md index 62d092f..846ea15 100644 --- a/pskov/en/education.md +++ b/pskov/en/education.md @@ -1,5 +1,5 @@ Title: Education -Date: 2019-05-20 00:00 +Date: 2019-06-18 00:00 Category: Page Slug: education Lang: en @@ -8,32 +8,32 @@ Here is a set of documents to make you proficient in generating static sites wit ## [01. Why][why] -| Item | Details | +| Property | Details | |---|---| | Description | Find out why **PSKOV** was created | | Estimated completion time | 5 minutes | ## [02. Dependencies][deps] -| Item | Details | +| Property | Details | |---|---| | Description | Install dependencies to start using **PSKOV** | | Estimated completion time | 5 minutes | ## [03. Site][site] -| Item | Details | +| Property | Details | |---|---| | Description | Learn how to create a simple static web site with two pages | | Estimated completion time | 10 minutes | | Demonstration | [TwoPages][01-sample] | | Introduced PSKOV constants |< Назад | +Начало | +Далее > | +
---|---|---|
01. Почему | +Обучение | +03. Сайт | +
В этом документы мы коснёмся зависимостей ПСКОВА и их установку.
+Ожидаемое время завершения: 5 минут.
+Содержание
+ + +Мы спроектировали ПСКОВ таким образом, чтобы он исполнялся в веб-браузере. Для запуска ПСКОВА вам понадобятся:
+№ | +Зависимость ПСКОВА | +Подробности | +
---|---|---|
1 | +Веб-браузер 2010-го года или новее | +ПСКОВ использует ECMAScript 5 (2009), любой современный веб-браузер должен подойти | +
2 | +К локальной файловой системе доступ | +ЛФСД предоставляет ПСКОВУ доступ к вашей локальной файловой системе. Установите ЛФСД, чтобы использовать ПСКОВ. | +
Внимание: установите ЛФСД, чтобы использовать ПСКОВ.
+ +ПСКОВ:
+ЛФСД:
+< Назад | +Начало | +Далее > | +
---|---|---|
01. Почему | +Обучение | +03. Сайт | +
< Назад | +Начало | +Далее > | +
---|---|---|
02. Зависимости | +Обучение | +04. Язык | +
В этом документы мы создадим простой статический сайт с двумя страницами.
+Ожидаемое время завершения: 10 минут.
+Содержание
+pskov.cfg
item.template
about.md
и cv.md
Представьте, что вы являетесь выдающимся русским живописцем Валентином Серовым. Каждый раз, когда кто-либо хочет узнать о вас, он идёт на Википедию. Сегодня утром вы просыпаетесь раньше обычного с отчётливым желанием создать свой собственный веб-сайт.
+Вы приступаете к созданию следующих страницы:
+Несколько позже в директории вашего сайта у вас оказываются следующие файлы:
+Давайте взглянем на их содержимое.
+ +pskov.cfg
Файл pskov.cfg
содержит следующее:
input = .
+item = item.template
+
+pskov.cfg
является файлом настроек со следующими ключами:
Ключ | +Описание | +
---|---|
input |
+Указывает на директорию с файлом, на который ссылается ключ item |
+
item |
+Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown | +
В нашем случае файл item.template
расположен рядом с pskov.cfg
, поэтому мы используем .
для обозначения текущей директории.
item.template
Файл item.template
содержит следующее:
<!DOCTYPE html>
+<html>
+ <meta charset="utf-8">
+ <head>
+ <style>
+ - - - - Схлопнуто для краткости - - - -
+ </style>
+ <title>Serov</title>
+ </head>
+ <body>
+ <div id="header">
+ <strong>Serov</strong>
+ <a href="about.html">About me</a>
+ <a href="cv.html">CV</a>
+ </div>
+ <center>
+ <h1>PSKOV_ITEM_TITLE</h1>
+ <div class="contents">
+PSKOV_ITEM_CONTENTS
+ </div>
+ <div id="footer">
+ This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>.
+ </div>
+ </center>
+ </body>
+</html>
+
+Внимание: стиль схлопнут для краткости.
+Как видите, item.template
представляет из себя обычный файл HTML с двумя константами ПСКОВА:
Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_TITLE |
+Значение ключа Title из файла Markdown страницы |
+
PSKOV_ITEM_CONTENTS |
+Предоставляет содержимое HTML, сгенерированное из Markdown | +
Замечания:
+about.md
и cv.md
Файл about.md
содержит следующее:
Title: About me
+ Slug: about
+
+ Hi, my name is Valentin Serov. Here's my self-portrait:
+
+ ![Valentin Serov self-portrait][serov-portrait]
+
+ - - - - Схлопнуто для краткости - - - -
+
+ Have a look at my [CV][cv] now.
+
+ [serov]: https://en.wikipedia.org/wiki/Valentin_Serov
+ [revolution]: https://en.wikipedia.org/wiki/Russian_Revolution
+ [serov-portrait]: myself.jpg
+ [serov-work]: mywork.jpg
+ [girl-with-peaches]: https://en.wikipedia.org/wiki/Girl_with_Peaches
+ [pskov]: http://opengamestudio.org/pskov
+ [cv]: cv.html
+
+about.md
начинается с так называемого заголовка:
Ключ заголовка | +Описание | +
---|---|
Title |
+Предоставляет значение для константы PSKOV_ITEM_TITLE во время генерации HTML из Markdown |
+
Slug |
+Сообщает ПСКОВУ о том, что этот файл должен быть сохранён как <slug>.html |
+
В остальном содержимое about.md
ничем не отличается от любых других файлов Markdown.
Внимание: ссылка на страницу cv
указана как cv.html
, не cv.md
Файл cv.md
содержит следующее:
Title: Curriculum vitae
+ Slug: cv
+
+ Here's my CV in case my paintings still interest you. I took a bit of a modern IT approach to structure my CV as key-value pairs of a dictionary (map), enjoy!
+
+ | Key | Value |
+ |---|---|
+ | Name | Valentin Serov |
+ | Age | 46 |
+ | Marital status | Married |
+ | Country | Russian Empire |
+ | Alma mater | Imperial Academy of Arts |
+ | Education | * Member Academy of Arts (1898) <br> * Full Member Academy of Arts (1903) |
+
+Как видите, в cv.md
нет ничего нового за исключением таблицы Markdown.
Запустите ЛФСД с указанием директории, содержащей только что рассмотренные файлы:
+$ /путь/до/lfsa_1.0.0.py /путь/до/директории/01.TwoPages
+
+Вы должны увидеть примерно такой вывод:
+DIR: '/Users/kornerr/p/site-pskov-sample/01.TwoPages'
+PORT: '8000'
+
+
+Настало время сгенерировать свой собственный веб-сайт:
+Путь
указывает на нужную директориюВходящая директория
и Шаблон элемента
содержат значения из pskov.cfg
Генерировать
для генерации файлов HTML рядом с файлами Markdownabout.html
из директории сайтаВы успешно сгенерировали веб-сайт с двумя страницами. Проверьте результат.
+Представлены константы ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_TITLE |
+Значение ключа Title из файла Markdown страницы |
+
PSKOV_ITEM_CONTENTS |
+Предоставляет содержимое HTML, сгенерированное из Markdown | +
Представлены ключи настроек:
+Ключ | +Описание | +
---|---|
input |
+Указывает на директорию с файлом, на который ссылается ключ item |
+
item |
+Указывает на файл с шаблоном HTML, который используется для генерации файлов HTML из Markdown | +
Представлены ключи заголовка:
+Ключ заголовка | +Описание | +
---|---|
Title |
+Предоставляет значение для константы PSKOV_ITEM_TITLE во время генерации HTML из Markdown |
+
Slug |
+Сообщает ПСКОВУ о том, что этот файл должен быть сохранён как <slug>.html |
+
< Назад | +Начало | +Далее > | +
---|---|---|
02. Зависимости | +Обучение | +04. Язык | +
В этом документе мы добавим выбор языка.
+Ожидаемое время завершения: 10 минут.
+Содержание
+pskov.cfg
Теперь, когда у вас есть собственный веб-сайт на английском, вы задумываетесь о русской версии, ведь вы же всё-таки русский!
+Вы создаёте директорию со следующей структурой файлов:
+pskov.cfg
en/item.template
en/about.md
en/cv.md
ru/item.template
ru/about.md
ru/cv.md
Давайте взглянем на содержимое этих файлов.
+ +pskov.cfg
Файл pskov.cfg
содержит следующее:
input = en;ru
+item = item.template
+
+Как видите, input
может принимать несколько директорий, разделённых символом ;
. ПСКОВ обработает каждую указанную директорию так же, как и ранее.
В нашем случае каждая из директорий - en/
и ru/
- содержит собственный шаблон item.template
.
Содержимое en/item.template
:
- - - - Схлопнуто для краткости - - - -
+ <title>Serov</title>
+ </head>
+ <body>
+ <div id="header">
+ <strong>Serov</strong>
+ <a href="about.html">About me</a>
+ <a href="cv.html">CV</a>
+ <div id="lang">
+ <a href="../en/PSKOV_ITEM_URL">EN</a>
+ <a href="../ru/PSKOV_ITEM_URL">RU</a>
+ </div>
+ </div>
+ <center>
+- - - - Схлопнуто для краткости - - - -
+
Содержимое ru/item.template
:
- - - - Схлопнуто для краткости - - - -
+ <title>Серов</title>
+ </head>
+ <body>
+ <div id="header">
+ <strong>Серов</strong>
+ <a href="about.html">Обо мне</a>
+ <a href="cv.html">Резюме</a>
+ <div id="lang">
+ <a href="../en/PSKOV_ITEM_URL">EN</a>
+ <a href="../ru/PSKOV_ITEM_URL">RU</a>
+ </div>
+ </div>
+ <center>
+- - - - Схлопнуто для краткости - - - -
+
Внимание: начало и конец схлопнуты для краткости.
+Как видите, en/item.template
и ru/item.template
очень похожи на виденный ранее item.template
.
Изменения следующие:
+<div id="lang">...</div>
для отображения выбора языкаВыбор языка использует следующую новую константу ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_URL |
+Предоставляет имя файла генерируемой страницы | +
Использование PSKOV_ITEM_URL
даёт вам поддержку стольких языков, сколько пожелаете.
Файлы en/about.md
и en/cv.md
выглядят почти идентично виденным ранее. ru/about.md
и ru/cv.md
представляют собой русские версии соответствующих английских страниц.
Например, ru/cv.md
содержит:
Title: Резюме
+ Slug: cv
+
+ Здесь вы можете увидеть моё резюме в том случае, если мои произведения всё ещё вас интересуют. Я использовал современный подход ИТ для структурирования своего резюме в виде пар ключ-значение словаря (карты). Наслаждайтесь!
+
+ | Ключ | Значение |
+ |---|---|
+ | Имя | Валентин Серов |
+ | Возраст | 46 |
+ | Семейное положение | Женат |
+ | Страна | Российская Империя |
+ | Учёба | Императорская Академия художеств |
+ | Звания | * академик ИАХ (1898) <br> * действительный член ИАХ (1903) |
+
+Внимание: русская страница использует точно такое же значение Slug
, как и английская страница.
Запустите ЛФСД с указанием директории, содержащей только что рассмотренные файлы:
+$ /путь/до/lfsa_1.0.0.py /путь/до/директории/02.Language
+
+Сгенерируйте сайт:
+Генерировать
en/about.html
или ru/about.html
из директории сайтаВы успешно добавили выбор языка. Проверьте результат.
+Представлены константы ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_URL |
+Предоставляет имя файла генерируемой страницы | +
В этом документе мы создадим "динамические" страницы блога.
+Ожидаемое время завершения: 20 минут.
+Содержание
+pskov.cfg
Итак, у вас есть веб-сайт на Английском и Русском языках. Вы начинаете ощущать желание регулярно делиться своими мыслями с миром в виде заметок блога.
+Вы создаёте директорию со следующей структурой файлов:
+pskov.cfg
en/blog/
item.template
index.template
preview.template
pagination.template
pagination.prev.template
pagination.next.template
1885.md
1886.01.md
1886.02.md
1887.01.md
1887.02.md
1888.md
1896.md
1899.md
en/page/
item.template
about.md
cv.md
ru/blog/
item.template
index.template
preview.template
pagination.template
pagination.prev.template
pagination.next.template
1885.md
1886.01.md
1886.02.md
1887.01.md
1887.02.md
1888.md
1896.md
1899.md
ru/page/
item.template
about.md
cv.md
Давайте взглянем на содержимое этих файлов.
+ +pskov.cfg
Файл pskov.cfg
содержит следующее:
input = en/page;ru/page;en/blog;ru/blog
+item = item.template
+preview = preview.template
+index = index.template
+paginationPrev = pagination.prev.template
+paginationNext = pagination.next.template
+paginationPrevNext = pagination.template
+previewSize = 200
+previewEnding = . . .
+previewsPerPage = 3
+previewPageBaseName = index
+
+Вы уже встречались с ключами input
и item
. Рассмотрим остальные:
Ключ | +Описание | +
---|---|
preview |
+Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых previewSize (приблизительно) символов для каждого файла Markdown |
+
index |
+Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами | +
paginationPrev |
+Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу | +
paginationNext |
+Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу | +
paginationPrevNext |
+Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам | +
previewSize |
+Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра | +
previewEnding |
+Строка для добавления в конец каждого предпросмотра | +
previewsPerPage |
+Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами | +
previewsPageBaseName |
+Базовое имя файла для страниц с предпросмотрами | +
В нашем случае:
+200
символами (приблизительно). . .
в конце каждого предпросмотра3
предпросмотраindex.html
, index2.html
, index3.html
и т.д.Содержимое en/blog/item.template
:
- - - - Схлопнуто для краткости - - - -
+<body>
+ <div id="header">
+ <strong>Serov</strong>
+ <a href="../../en/blog/index.html">Blog</a>
+ <a href="../../en/page/about.html">About me</a>
+ <a href="../../en/page/cv.html">CV</a>
+ <div id="lang">
+ <a href="../../en/blog/PSKOV_ITEM_URL">EN</a>
+ <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a>
+ </div>
+ </div>
+ <center>
+ <h1>In the blog...</h1>
+ <div class="contents">
+ <h2 class="itemTitle">
+ <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a>
+ </h2>
+ <p class="itemDate">PSKOV_ITEM_DATE</p>
+PSKOV_ITEM_CONTENTS
+ </div>
+ <div id="footer">
+ This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>.
+ </div>
+ </center>
+</body>
+- - - - Схлопнуто для краткости - - - -
+
Содержимое ru/blog/item.template
:
- - - - Схлопнуто для краткости - - - -
+<body>
+ <div id="header">
+ <strong>Серов</strong>
+ <a href="../../ru/blog/index.html">Блог</a>
+ <a href="../../ru/page/about.html">Обо мне</a>
+ <a href="../../ru/page/cv.html">Резюме</a>
+ <div id="lang">
+ <a href="../../en/blog/PSKOV_ITEM_URL">EN</a>
+ <a href="../../ru/blog/PSKOV_ITEM_URL">RU</a>
+ </div>
+ </div>
+ <center>
+ <h1>В блоге...</h1>
+ <div class="contents">
+ <h2 class="itemTitle">
+ <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a>
+ </h2>
+ <p class="itemDate">PSKOV_ITEM_DATE</p>
+PSKOV_ITEM_CONTENTS
+ </div>
+ <div id="footer">
+ Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>.
+ </div>
+ </center>
+</body>
+- - - - Схлопнуто для краткости - - - -
+
Внимание: начало и конец схлопнуты для краткости.
+Как видите, оба файла выглядят практически так же, как и файлы item.template
, рассмотренные ранее.
Изменения следующие:
+page
и первой страницы с предпросмотрами в директории blog
contents
в качестве ссылки на полную заметку блогаДату мы получаем из константы PSKOV_ITEM_DATE
:
Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_DATE |
+Значение ключа Date файла Markdown |
+
Содержимое en/blog/preview.template
:
<div class="contents">
+ <h2 class="itemTitle">
+ <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a>
+ </h2>
+ <p class="itemDate">PSKOV_ITEM_DATE</p>
+PSKOV_PREVIEW
+ <div class="itemMore">
+ <a href="PSKOV_ITEM_URL">Continue reading</a>
+ </div>
+</div>
+
Содержимое ru/blog/preview.template
:
<div class="contents">
+ <h2 class="itemTitle">
+ <a href="PSKOV_ITEM_URL">PSKOV_ITEM_TITLE</a>
+ </h2>
+ <p class="itemDate">PSKOV_ITEM_DATE</p>
+PSKOV_PREVIEW
+ <div class="itemMore">
+ <a href="PSKOV_ITEM_URL">Читать дальше</a>
+ </div>
+</div>
+
У предпросмотров нет <head>
, <body>
и прочих полностраничных тэгов HTML. Предпросмотры являются секциями, вставляемыми в страницы с предпросмотрами.
Сам предпросмотр мы получаем из константы PSKOV_PREVIEW
:
Константа ПСКОВА | +Описание | +
---|---|
PSKOV_PREVIEW |
+Предоставляет содержимое файла Markdown, ограниченное previewSize символами (приблизительно) |
+
Содержимое en/blog/index.template
:
- - - - Схлопнуто для краткости - - - -
+<body>
+ <div id="header">
+ <strong>Serov</strong>
+ <a href="../../en/blog/index.html">Blog</a>
+ <a href="../../en/page/about.html">About me</a>
+ <a href="../../en/page/cv.html">CV</a>
+ <div id="lang">
+ <a href="../../en/blog/PSKOV_INDEX_URL">EN</a>
+ <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a>
+ </div>
+ </div>
+ <center>
+ <h1>Blog</h1>
+PSKOV_PREVIEWS
+PSKOV_PAGINATION
+ <div id="footer">
+ This sample web site has been generated by <a href="http://opengamestudio.org/pskov">PSKOV</a>.
+ </div>
+ </center>
+</body>
+- - - - Схлопнуто для краткости - - - -
+
Содержимое ru/blog/index.template
:
- - - - Схлопнуто для краткости - - - -
+<body>
+ <div id="header">
+ <strong>Серов</strong>
+ <a href="../../ru/blog/index.html">Блог</a>
+ <a href="../../ru/page/about.html">Обо мне</a>
+ <a href="../../ru/page/cv.html">Резюме</a>
+ <div id="lang">
+ <a href="../../en/blog/PSKOV_INDEX_URL">EN</a>
+ <a href="../../ru/blog/PSKOV_INDEX_URL">RU</a>
+ </div>
+ </div>
+ <center>
+ <h1>Блог</h1>
+PSKOV_PREVIEWS
+PSKOV_PAGINATION
+ <div id="footer">
+ Этот пример сайта сгенерирован <a href="http://opengamestudio.org/pskov">ПСКОВОМ</a>.
+ </div>
+ </center>
+</body>
+- - - - Схлопнуто для краткости - - - -
+
Замечания:
+PSKOV_INDEX_URL
используется для выбора языкаНовые константы ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_INDEX_URL |
+Предоставляет генерируемое имя файла страницы с предпросмотрами: <previewsPageBaseName><id>.html |
+
PSKOV_PREVIEWS |
+Предоставляет набор предпросмотров | +
PSKOV_PAGINATION |
+Предоставляет секцию для перехода между страницами с предпросмотрами | +
Постраничные шаблоны являются секциями HTML для перехода между страницами с предпросмотрами.
+Существует три постраничных шаблона:
+Постраничный шаблон | +Описание | +
---|---|
Предыдущий | +Посетитель может перейти лишь назад | +
Следующий | +Посетитель может перейти лишь вперёд | +
Оба | +Посетитель может перейти либо вперёд, либо назад | +
Рассмотрим английские постраничные шаблоны:
+Содержимое en/blog/pagination.prev.template
:
<p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p>
+<p>
+ <a href="PSKOV_PREV_PAGE_URL">« Newer</a>
+</p>
+
Содержимое en/blog/pagination.next.template
:
<p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p>
+<p>
+ <a href="PSKOV_NEXT_PAGE_URL">Older »</a>
+</p>
+
Содержимое en/blog/pagination.template
:
<p>Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT</p>
+<p>
+ <a href="PSKOV_PREV_PAGE_URL">« Newer</a>
+ <a href="PSKOV_NEXT_PAGE_URL">Older »</a>
+</p>
+
Русские версии выглядят схожим образом. Например, содержимое ru/blog/pagination.template
:
<p>Страница PSKOV_PAGE_ID из PSKOV_PAGES_COUNT</p>
+<p>
+ <a href="PSKOV_PREV_PAGE_URL">« Новее</a>
+ <a href="PSKOV_NEXT_PAGE_URL">Старее »</a>
+</p>
+
+Новые константы ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_PAGE_ID |
+Предоставляет порядковый номер страницы с предпросмотрами, начиная с 1 |
+
PSKOV_PAGES_COUNT |
+Предоставляет количество сгенерированных страниц с предпросмотрами | +
PSKOV_PREV_PAGE_URL |
+Предоставляет имя файла предыдущей страницы с предпросмотрами | +
PSKOV_NEXT_PAGE_URL |
+Предоставляет имя файла следующей страницы с предпросмотрами | +
Файлы Markdown являются заметками блога, они похожи на файлы Markdown обычных страниц. Вот как выглядит содержимое en/blog/1885.md
:
Title: Bullocks
+ Date: 1885
+ Slug: 1885.01.bullocks
+
+ ![Bullocks][bullocks]
+
+ I've been painting "Bullocks" sketch while I was staying in Odessa at Kuznetsov's in 1885.
+
+ [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg
+
+Заметки блога сортируются по дате: новые заметки размещаются перед старыми.
+Ключ заголовка | +Описание | +
---|---|
Date |
+Предоставляет значение для константы PSKOV_ITEM_DATE при генерации HTML из Markdown |
+
Запустите ЛФСД с указанием директории, содержащей только что рассмотренные файлы:
+$ /путь/до/lfsa_1.0.0.py /путь/до/директории/03.Blog
+
+Сгенерируйте сайт:
+Генерировать
en/blog/index.html
или ru/blog/index.html
из директории сайтаВы успешно сгенерировали веб-сайт с "динамическими" страницами блога. Проверьте результат.
+Представлены константы ПСКОВА:
+Константа ПСКОВА | +Описание | +
---|---|
PSKOV_ITEM_DATE |
+Значение ключа Date файла Markdown |
+
PSKOV_PREVIEW |
+Предоставляет содержимое файла Markdown, ограниченное previewSize символами (приблизительно) |
+
PSKOV_INDEX_URL |
+Предоставляет генерируемое имя файла страницы с предпросмотрами: <previewsPageBaseName><id>.html |
+
PSKOV_PREVIEWS |
+Предоставляет набор предпросмотров | +
PSKOV_PAGINATION |
+Предоставляет секцию для перехода между страницами с предпросмотрами | +
PSKOV_PAGE_ID |
+Предоставляет порядковый номер страницы с предпросмотрами, начиная с 1 |
+
PSKOV_PAGES_COUNT |
+Предоставляет количество сгенерированных страниц с предпросмотрами | +
PSKOV_PREV_PAGE_URL |
+Предоставляет имя файла предыдущей страницы с предпросмотрами | +
PSKOV_NEXT_PAGE_URL |
+Предоставляет имя файла следующей страницы с предпросмотрами | +
Представлены ключи настроек:
+Ключ | +Описание | +
---|---|
preview |
+Указывает на шаблон HTML, используемый для генерации предпросмотра HTML из первых previewSize (приблизительно) символов для каждого файла Markdown |
+
index |
+Указывает на шаблон HTML, используемый для генерации страницы с предпросмотрами | +
paginationPrev |
+Указывает на шаблон HTML, используемый для генерации секции с переходом лишь на предыдущую страницу | +
paginationNext |
+Указывает на шаблон HTML, используемый для генерации секции с переходм лишь на следующую страницу | +
paginationPrevNext |
+Указывает на шаблон HTML, используемый для генерации секции с переходами по страницам | +
previewSize |
+Количество символов (приблизительное) из файла Markdown, используемое для генерации предпросмотра | +
previewEnding |
+Строка для добавления в конец каждого предпросмотра | +
previewsPerPage |
+Максимальное количество предпросмотров, умещающееся на странице с предпросмотрами | +
previewsPageBaseName |
+Базовое имя файла для страниц с предпросмотрами | +
Представлены ключи заголовка:
+Ключ заголовка | +Описание | +
---|---|
Date |
+Предоставляет значение для константы PSKOV_ITEM_DATE при генерации HTML из Markdown |
+
Это был последний документ, призванный научить вас уверенно владеть генератором статических сайтов ПСКОВ. Если вам нравится наш труд, присоединяйтесь к нам в VK, Twitter или Facebook.
+А теперь используйте ПСКОВ для генерация своего собственного веб-сайта!
+PSKOV_ITEM_DATE
+PSKOV_ITEM_CONTENTS +PSKOV_ITEM_DATE
+PSKOV_ITEM_CONTENTS +Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT
++ « Newer +
+ ``` + +* Содержимое `en/blog/pagination.next.template`: + + ``` +Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT
++ Older » +
+ ``` + +* Содержимое `en/blog/pagination.template`: + + ``` +Page PSKOV_PAGE_ID of PSKOV_PAGES_COUNT
+ + ``` + +Русские версии выглядят схожим образом. Например, содержимое `ru/blog/pagination.template`: + +``` +Страница PSKOV_PAGE_ID из PSKOV_PAGES_COUNT
+ +``` + +Новые константы **ПСКОВА**: + +| Константа ПСКОВА | Описание | +|---|---| +| `PSKOV_PAGE_ID` | Предоставляет порядковый номер страницы с предпросмотрами, начиная с `1` | +| `PSKOV_PAGES_COUNT` | Предоставляет количество сгенерированных страниц с предпросмотрами | +| `PSKOV_PREV_PAGE_URL` | Предоставляет имя файла предыдущей страницы с предпросмотрами | +| `PSKOV_NEXT_PAGE_URL` | Предоставляет имя файла следующей страницы с предпросмотрами | + + + +## 07. Изучите файлы Markdown + +Файлы Markdown являются заметками блога, они похожи на файлы Markdown обычных страниц. Вот как выглядит содержимое `en/blog/1885.md`: + +``` + Title: Bullocks + Date: 1885 + Slug: 1885.01.bullocks + + ![Bullocks][bullocks] + + I've been painting "Bullocks" sketch while I was staying in Odessa at Kuznetsov's in 1885. + + [bullocks]: https://upload.wikimedia.org/wikipedia/commons/c/cb/Walentin_Aleksandrovich_Serov_Bullocks.jpg +``` + +Заметки блога сортируются по дате: новые заметки размещаются перед старыми. + +| Ключ заголовка | Описание | +|---|---| +| `Date` | Предоставляет значение для константы `PSKOV_ITEM_DATE` при генерации HTML из Markdown | + + + +## 08. Запустите ЛФСД и сгенерируйте сайт + +Запустите [ЛФСД][lfsa] с указанием директории, содержащей только что рассмотренные файлы: + +``` +$ /путь/до/lfsa_1.0.0.py /путь/до/директории/03.Blog +``` + +Сгенерируйте сайт: + +* Перейдите на страницу [Инструмент][tool] +* Нажмите кнопку `Генерировать` +* Откройте сгенерированный файл `en/blog/index.html` или `ru/blog/index.html` из директории сайта +* Осуществите переход между страницами предпросмотра + + + +## 09. Итог + +Вы успешно сгенерировали веб-сайт с "динамическими" страницами блога. [Проверьте результат][03-sample]. + +Представлены константы **ПСКОВА**: + +| Константа ПСКОВА | Описание | +|---|---| +| `PSKOV_ITEM_DATE` | Значение ключа `Date` файла Markdown | +| `PSKOV_PREVIEW` | Предоставляет содержимое файла Markdown, ограниченное `previewSize` символами (приблизительно) | +| `PSKOV_INDEX_URL` | Предоставляет генерируемое имя файла страницы с предпросмотрами: `Представленные здесь документы научат вас уверенно владеть генератором статических сайтов ПСКОВ. Советуем читать документы по порядку.
+Свойство | +Подробности | +
---|---|
Описание | +Узнайте причины создания ПСКОВА | +
Ожидаемое время завершения | +5 минут | +
Свойство | +Подробности | +
---|---|
Описание | +Установите зависимости, чтобы начать использовать ПСКОВ | +
Ожидаемое время завершения | +5 минут | +
Свойство | +Подробности | +
---|---|
Описание | +Научитесь создавать простой статический сайт с двумя страницами | +
Ожидаемое время завершения | +10 минут | +
Демонстрация | +ДвеСтраницы | +
Представленные константы ПСКОВА | +
|
+
Представленные ключи настроек | +
|
+
Представленные ключи заголовка | +
|
+
Свойство | +Подробности | +
---|---|
Описание | +Научитесь добавлять выбор языка | +
Ожидаемое время завершения | +10 минут | +
Демонстрация | +Язык | +
Представленные константы ПСКОВА | +
|
+
Свойство | +Подробности | +
---|---|
Описание | +Научитесь создавать "динамические" страницы для блога | +
Ожидаемое время завершения | +20 минут | +
Демонстрация | +Блог | +
Представленные константы ПСКОВА | +
|
+
Представленные ключи настроек | +
|
+
Представленные ключи заголовка | +
|
+
Если вам нравится наш труд, присоединяйтесь к нам в VK, Twitter или Facebook.
++ ПСКОВ является генератором статических сайтов, работающим прямо в веб-браузере. + Этот сайт тоже сгенерирован ПСКОВОМ. Познакомьтесь с ним на странице обучения. +
++ К Локальной Файловой Системе Доступ + | +|
Путь: | +Обновление... | +
+ Настройки + + | +|
Входящая директория: | ++ |
Шаблон элемента ('item'): | ++ |
Шаблон предпросмотра ('preview'): | ++ |
Шаблон страницы с предпросмотрами ('index'): | ++ |
Постраничный шаблон 'Предыдущий' ('paginationPrev'): | ++ |
Постраничный шаблон 'Следующий' ('paginationNext'): | ++ |
Постраничный шаблон 'Предыдущий/Следующий' ('paginationPrevNext'): | ++ |
Количество символов в предпросмотре: | ++ |
Строка завершения предпросмотра: | ++ |
Предпросмотров на странице: | ++ |
Базовое название страницы с предпросмотрами: | ++ |
+ Новости + + | +|
Журнал | +|
+ |