santaspeen.ru-blog/blog/blog-setup/index.md

slug, title, description, image, tags, keywords, date

slug	title	description	image	tags	keywords	date
blog-setup	Установка этого блога к себе на сервер	Описание	./logo.png	blog javascript nginx	docker linux	2023-12-15

Сегодня с расскажу как установить этот блог к себе на сайт

Введение

[Зачем это вообще надо и кому нужен блог]

Настройка сайта

• Если сайт уже есть, то пеерходите сразу к установке блога

Покупка домена

[Идём на регистратор и покупаем]

Настройка DNS

[Находим бесплатный DNS сервер и писхаем туда ip]

Настройка WEB сервера

[Тут будет как настроить nginx на выдачу index.html + certbot]

Установка блога

Качаем

[тут гит клон]

Общая структура

Вот так сейчас выглядит структура файлов блога:

...
| -- blog
|   | -- _template
|   |   | -- index.md
|   |   | -- logo-template.psd
|   |   ` -- logo.png
|   ` -- blog-setup
|       | -- index.md
|       ` -- logo.png
| -- docs
|   | -- _template
|   |   | -- _category_.json
|   |   | -- doc1.md
|   |   ` -- doc2.md
|   ` -- intro.md
...

[Тут надо рассказать про основные файлы]

Cтруктура блогов

[Несколько слов про то, или инное, рассмотрим на примере blog._template]

[Стандартная структура 1 блога]

| -- blog
|   ` -- _template
|       | -- index.md
|       ` -- logo.png

Заголовок у блога

---
slug: template
title: title
description: Описание
image: ./logo.png
tags: [docker, linux, networks]
keywords: [docker, linux]
date: 2023-11-29
---

Описание для предварительного просмотра на главной странице

[![logo](./logo.png)](/blog/_template)
<!--truncate-->

slug - [Это..]
title - [Это..]
description - [Это..]
image - [Это..]
keywords - [Это..]
date - [Это...]

<!--truncate--> - [Это...]

Структура доков

[Несколько слов про то, или инное, рассмотрим на примере docs._template]

[Стандартная структура 1 дока]

| -- docs
|   | -- _template
|   |   | -- _category_.json
|   |   | -- doc1.md
|   |   ` -- doc2.md
|   ` -- intro.md

[category.json Обязателен, рассказать что в нём]

Содержимое <theme>/category.json

{
  "label": "Template",
  "position": 1,
  "link": {
    "type": "generated-index",
    "description": "Template description"
  }
}

label - [Это..]
position - [Это..]
link - [Это..]
link.type - [Это..]
link.description - []

Заголовок у доков

[У каждого файла должен быть заголовок... Зачем? Почему?]

Заголовок doc1.md

---
sidebar_position: 1
title: Template title 1
---

Template text

в doc2.md соответсвенно будет

---
sidebar_position: 2
title: Template title 2
---

Template text

sidebar_position - [Это..]
title - [Это...]

Настройка стилей

Стили лежать по пути /src/css/custom.css

Я преднастроил их, и выглядят они сейчас вот так:

/* src/css/custom.css */

:root {
  --footer-padding: 0.5em;
}
[data-theme='light'] {
  --ifm-color-primary: #7c538bfd;
  --ifm-color-primary-dark: #21af90;
  --ifm-color-primary-darker: #1fa588;
  --ifm-color-primary-darkest: #1a8870;
  --ifm-color-primary-light: #424242;
  --ifm-color-primary-lighter: #32d8b4;
  --ifm-color-primary-lightest: #4fddbf;
  --footer-background-color: #ececec;
  --footer-color: #000;
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
}
[data-theme='dark'] {
  --ifm-color-primary: #c4c0c5fd;
  --ifm-color-primary-dark: #21af90;
  --ifm-color-primary-darker: #1fa588;
  --ifm-color-primary-darkest: #1a8870;
  --ifm-color-primary-light: #29d5b0;
  --ifm-color-primary-lighter: #32d8b4;
  --ifm-color-primary-lightest: #4fddbf;
  --footer-background-color: #242526;
  --footer-color: #ebedf0;
  --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
}
.footer {
  --ifm-footer-background-color: var(--footer-background-color);
  --ifm-footer-color: var(--footer-color);
  padding: var(--footer-padding) 
}
.header-github-link:hover {
  opacity: 0.6;
}
.header-github-link::before {
  content: '';
  width: 24px;
  height: 24px;
  display: flex;
  background: url("/img/github.svg") 0 center / 25px 25px no-repeat;
}
h2 {
  --ifm-heading-vertical-rhythm-bottom: 0;
}
p a {
  text-decoration: underline dotted;
}