Title: Обучение: 05. Блог Date: 2019-06-25 00:00 Category: Page Slug: education.05.blog Lang: ru | < Назад | Начало | Далее > | |---|---|---| | [04. Язык][prev] | [Обучение][index] | Отсутствует |
В этом документе мы создадим "динамические" страницы блога. Ожидаемое время завершения: 20 минут. **Содержание** * [01. Блог](#blog) * [02. Изучите файл `pskov.cfg`](#cfg) * [03. Изучите шаблоны элементов](#item) * [04. Изучите шаблоны предпросмотров](#preview) * [05. Изучите шаблоны страниц с предпросмотрами](#index) * [06. Изучите постраничные шаблоны](#pagination) * [07. Изучите файлы Markdown](#md) * [08. Запустите ЛФСД](#lfsa) * [09. Сгенерируйте сайт](#gen) * [10. Проверьте сайт](#observe) * [11. Итог](#summary) ## 01. Блог Итак, у вас есть веб-сайт на Английском и Русском языках. Вы начинаете ощущать желание регулярно делиться своими мыслями с миром в виде заметок блога. Вы создаёте директорию со [следующей структурой файлов][03-files]: * `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` Давайте взглянем на содержимое этих файлов. ## 02. Изучите файл `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` и т.д. ## 03. Изучите шаблоны элементов * Содержимое `en/blog/item.template`: ``` - - - - Схлопнуто для краткости - - - -

In the blog...

PSKOV_ITEM_TITLE

PSKOV_ITEM_DATE

PSKOV_ITEM_CONTENTS
- - - - Схлопнуто для краткости - - - - ``` * Содержимое `ru/blog/item.template`: ``` - - - - Схлопнуто для краткости - - - -

В блоге...

PSKOV_ITEM_TITLE

PSKOV_ITEM_DATE

PSKOV_ITEM_CONTENTS
- - - - Схлопнуто для краткости - - - - ``` **Внимание**: начало и конец схлопнуты для краткости. Как видите, оба файла выглядят практически так же, как и файлы `item.template`, рассмотренные [ранее][prev]. Изменения следующие: * новые URL страниц в директории `page` и первой страницы с предпросмотрами в директории `blog` * заголовок используется внутри секции `contents` в качестве ссылки на полную заметку блога * дата используется для подчёркивания временной зависимости между заметками блога Дату мы получаем из константы `PSKOV_ITEM_DATE`: | Константа ПСКОВА | Описание | |---|---| | `PSKOV_ITEM_DATE` | Значение ключа `Date` файла Markdown | ## 04. Изучите шаблоны предпросмотров * Содержимое `en/blog/preview.template`: ```

PSKOV_ITEM_TITLE

PSKOV_ITEM_DATE

PSKOV_PREVIEW
``` * Содержимое `ru/blog/preview.template`: ```

PSKOV_ITEM_TITLE

PSKOV_ITEM_DATE

PSKOV_PREVIEW
``` У предпросмотров нет ``, `` и прочих полностраничных тэгов HTML. Предпросмотры являются секциями, вставляемыми в страницы с предпросмотрами. Сам предпросмотр мы получаем из константы `PSKOV_PREVIEW`: | Константа ПСКОВА | Описание | |---|---| | `PSKOV_PREVIEW` | Предоставляет содержимое файла Markdown, ограниченное `previewSize` символами (приблизительно) | ## 05. Изучите шаблоны страниц с предпросмотрами * Содержимое `en/blog/index.template`: ``` - - - - Схлопнуто для краткости - - - -

Blog

PSKOV_PREVIEWS PSKOV_PAGINATION
- - - - Схлопнуто для краткости - - - - ``` * Содержимое `ru/blog/index.template`: ``` - - - - Схлопнуто для краткости - - - -

Блог

PSKOV_PREVIEWS PSKOV_PAGINATION
- - - - Схлопнуто для краткости - - - - ``` **Замечания**: * начало и конец схлопнуты для краткости * константа `PSKOV_INDEX_URL` используется для выбора языка Новые константы **ПСКОВА**: | Константа ПСКОВА | Описание | |---|---| | `PSKOV_INDEX_URL` | Предоставляет генерируемое имя файла страницы с предпросмотрами: `.html` | | `PSKOV_PREVIEWS` | Предоставляет набор предпросмотров | | `PSKOV_PAGINATION` | Предоставляет секцию для перехода между страницами с предпросмотрами | ## 06. Изучите постраничные шаблоны Постраничные шаблоны являются секциями HTML для перехода между страницами с предпросмотрами. Существует три постраничных шаблона: | Постраничный шаблон | Описание | |---|---| | Предыдущий | Посетитель может перейти лишь назад | | Следующий | Посетитель может перейти лишь вперёд | | Оба | Посетитель может перейти либо вперёд, либо назад | Рассмотрим английские постраничные шаблоны: * Содержимое `en/blog/pagination.prev.template`: ```

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

« Newer Older »

``` Русские версии выглядят схожим образом. Например, содержимое `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 ``` ## 09. Сгенерируйте сайт Перейдите на страницу [Инструмент][tool] и нажмите кнопку `Генерировать` для генерации файлов HTML рядом с файлами Markdown. ## 10. Проверьте сайт Проверьте сгенерированный веб-сайт локально: откройте файл `ru/blog/index.html` или `en/blog/index.html` и осуществите переход между страницами предпросмотра. ## 11. Итог Вы успешно сгенерировали веб-сайт с "динамическими" страницами блога. [Проверьте результат][03-sample]. Представлены константы **ПСКОВА**: | Константа ПСКОВА | Описание | |---|---| | `PSKOV_ITEM_DATE` | Значение ключа `Date` файла Markdown | | `PSKOV_PREVIEW` | Предоставляет содержимое файла Markdown, ограниченное `previewSize` символами (приблизительно) | | `PSKOV_INDEX_URL` | Предоставляет генерируемое имя файла страницы с предпросмотрами: `.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][vk], [Twitter][tw] или [Facebook][fb]. А теперь используйте **ПСКОВ** для генерация своего собственного веб-сайта!
| < Назад | Начало | Далее > | |---|---|---| | [04. Язык][prev] | [Обучение][index] | Отсутствует | [index]: education.html [prev]: education.04.lang.html [03-files]: https://github.com/OGStudio/site-pskov-sample/tree/master/03.Blog [03-sample]: http://opengamestudio.org/pskov/sample/03.Blog/ru/blog/index.html [lfsa]: http://opengamestudio.org/lfsa/ru [tool]: http://opengamestudio.org/pskov/ru/pskov_1.0.0+ru.html [vk]: https://vk.com/opengamestudo [tw]: https://twitter.com/OpenGameStudio [fb]: https://www.facebook.com/groups/162611230470183