Оформление вики-проекта

В данной статьей я попробую рассказать, с чего и в какой последовательности лучше оформлять вики-проект, и расскажу о наиболее частых и полезных скриптах, инструментах и способах оформления. Не важно, создан вами или взят под руководство заброшенный/малоактивный другой проект. Dr.Bryan (обсуждение)

Скрипты и стили, импортируемые с Dev Wiki в дальнейшем именуются как "импорты"

## Основы

### Подключение JS

Итак, как только вы получаете права администратора на вики, сразу следует отправиться запрашивать **подключение пользовательского JS** для вики, если он ещё не был подключён. Делается это через служебную страницу Служебная:Contact/general на вашей вики. На это может потребоваться некоторое время. Поэтому дальше мы отправляемся в Служебная:AdminDashboard — Кабинет администатора.

## Кабинет администратора

### Расширения вики

В кабинете сразу же открываем **раздел "Расширения вики"** (Служебная:WikiFeatures) и настраиваем инструменты вики на своё усмотрение. **Блоги, "Комментарии к статьям"** — это два основных инструмента на любой вики, однако не всем могут быть нужны те же Блоги или вообще кому-то не нужны даже Комментарии к статьям (в основном это если на вики используется старая форма комментариев или из-за специфики вики нет необходимости в комментариях). **"Стена обсуждения"** — аналогично Комментариям. Интересным инструментом (относительно новым) является **"Тема для инфобоксов «Europa»"**, который внешне преобразует стандартные модульные инфобоксы под тему вики, выбранную в Конструкторе тем. По умолчанию лучше оставлять Включенным, если вы не разбираетесь в CSS и/или не планируете сами оформлять инфобоксы. В противоположном же случае, считаю, лучше инструмент сразу отключить, чтобы не возникало лишних проблем. Лично мне проще оформить стандартную тему. **"Обязательная регистрация участников"** говорит сама за себя. Однако, не стоит её сразу включать, опасаясь вандализма, ведь и анонимные участники могут внести существенный вклад..изредка. Хотя некоторые вики придерживаются мнения, что если участник захочет быть полезным и начать редактировать на вики, то ему не составит труда зарегистрироваться.

#### Удалённые/заменённые расширения

Ниже перечислены те расширения, которые были на старой платформе и более не доступны совсем или в том виде, в каком были.

* **Голосования/Опросы** более недоступны для подключения. Но есть импорт, позволяющий встроить опросы из Обсуждений - AjaxPoll.
* **Чат** также более недоступен. Заменой ему стал импорт Discord, который получил массовую популярность ещё когда Чат не был полностью удалён. Есть два вида импорта: Discord и DiscordIntegrator.

### Конструктор тем

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

**Выбор темы**

Тему выбирать не обязательно и можно пропустить этот шаг, оставив стандартную/первую тему, поскольку дальше все элементы темы можно настроить по отдельности. Тем не менее, можно сразу **выбрать тему**, чтобы уже было наглядно видна цветовая гамма. Кстати говоря, перед настраиванием цветовой схемы вики, следует определиться с ней заранее, каким цветам должна соответствовать тематика вашей вики. Также, возможно, сперва нужно поставить фон вики, если цвета будут подбираться в соответствии с фоном.

**Настройка темы**

Здесь **настраиваем** на своё усмотрение **цвета** для каждой части вики. Также в этом разделе **устанавливается фон и изображение меню** вики. Желательно, чтобы оба изображения были уже подобраны. С изображением для меню вики нет почти никаких проблем, кроме как определённый его размер. А вот фон хоть и можно поставить, но в ограниченном размере. Для загрузки "тяжёлого" фона уже нужно работать с CSS и загрузкой самого файла через Изображения. Также есть разные виды установки фона, о которых нужно говорить отдельно.

**Логотип и fav-ик**

Завершающим этапом является **установка логотипа, fav-иконки и подписи названия вики**. Стоит заметить, что это **не обязательно** должно быть название вики, если оно уже указано на логотипе. В таком случае это место можно использовать для написание какой-либо небольшой новости.

## JS-ы

Через некоторое время пользовательский JS уже должен быть подключён. Переходим на соответствующую служебную страницу MediaWiki:Common.js и записываем/подключаем необходимые нам скрипты или дополнения. Также некоторые из них можно вынести на другую страницу, MediaWiki:ImportJS, однако там скрипт не всегда подгружается сразу, из-за чего может показаться, что он не работает. Те скрипты, которые должны работать в первую очередь, лучше записывать на первой странице, остальные же рекомендуется вынести отдельно в Импорт.

PS: разные полезные скрипты можно просмотреть на странице Список ссылок.

### Стандартный набор

* **ReferencePopups** — показывает текст сноски при наведении на неё.
* **ProfileTags** — даёт возможность добавлять участникам особые плашки в профайле. Добавляются плашки на странице MediaWiki:ProfileTags.
* **DiscordIntegrator** — скрипт, интегрирующий Discord-виджет в содержимое страницы или в правую её часть. Предварительно нужно создать сервер (чат) и записать его id на странице MediaWiki:Custom-DiscordIntegrator-config-id.
* **SeeMoreActivityButton** — добавляет в модуле вики-деятельности кнопку со ссылкой на страницу недавней вики-деятельности и различия между версиями.
* **FontAwesome** — делает возможным добавить любую из имеющихся в источнике иконок к нужному элементу, взяв его в `div`. Пример с использованием пары иконок показан на странице Модульный инфобокс.
* **NavboxBuilder** — простой и мощный конструктор навибоксов.

Всё это будет выглядеть следующим образом:

```
importArticles({
 type: 'script',
 articles: [
 'u:dev:ReferencePopups/code.js',
 'u:dev:ProfileTags/code.js',
 'u:dev:DiscordIntegrator/code.js',
 'u:dev:SeeMoreActivityButton/code.2.js'
 ]
});

```

а для подключения **FontAwesome** нужно вставить код, указанный ниже, уже на странице MediaWiki:Wikia.css.

```
@import "http://dev.wikia.com/index.php?title=FontAwesome/code.css&action=raw&ctype=text/css";

```

## CSS-ы

Для начала можно оформить самые простые и первоначальные полу-визуальные (скрытые) элементы.

### Основные элементы

```
/\* ----- Замена цвета текста при его выделении и выделенной области ----- \*/
::selection {
 background: ;
 color: ;
}

```

```
/\* ----- Изменение оформления заголовков разных уровней ----- \*/
.WikiaPage h1,
.WikiaPage h2,
.WikiaPage h3,
.WikiaPage h4 {
 font-weight: bold
 font-family: 'Tahoma'; /\* При использовании шрифта его следует сначала подключить \*/
}

```

```
/\* -- Добавляет картинку для кнопки "Править" -- \*/
.mw-editsection:before {
 content: url('https://vignette.wikia.nocookie.net/marvel/images/4/44/Shield\_PNG1279.png/revision/latest?cb=20150914214039&path-prefix=ru');
 margin-right: 5px;
}
/\* ----- Скрывает кпопку "править" на заголовках (и карандашик), пока на неё не будет наведен курсор ----- \*/
.mw-editsection,
.mw-editsection .section-edit-pencil-icon {
 display: none;
}
.WikiaPage h1:hover .mw-editsection,
.WikiaPage h2:hover .mw-editsection,
.WikiaPage h3:hover .mw-editsection,
.WikiaPage h4:hover .mw-editsection,
.WikiaPage h5:hover .mw-editsection,
.WikiaPage h6:hover .mw-editsection {
 display: inline-block;
}

```

```
/\* ----- Изменение горизонтальной разделяющей черты hr или "----" ----- \*/
hr {
 color: ;
 border: none;
 border-bottom: 2px dotted red;
}

```

```
/\* ----- Цвет ссылок ----- \*/
a {
 color: #fec356;
 text-shadow: 0 -15px 5px transparent, 0 15px 5px transparent;
}

/\* ..при наведении \*/
a:hover {
 text-shadow: 0 0 5px yellow, 0 0 5px yellow;
 color: yellow;
 text-decoration: none;
 transition: all .5s;
}
/\* ..активной \*/
a:active {
 color: green;
 text-shadow: 0 0 5px green;
}
/\* ..при наведении на не созданную \*/
a.new:hover {
 color: ;
}
/\* ..только на вики-странице \*/
.article-with-rail a {
}

```

```
/\* ----- Изменение скроллбара ----- \*/
::-webkit-scrollbar {
 height: 12px;
 width: 12px;
}
::-webkit-scrollbar-thumb {
 background: #9cc3e6;
}
::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgb(156, 195, 232);
 border: 1px solid #9cc3e6;
}
::-webkit-scrollbar-thumb:hover {
 background: #447dbb;
}

```

```
/\* ----- Изменение/добавление рамки изображения ----- \*/
.WikiaArticle .thumb .image img {
 box-sizing: border-box;
 border: 1px solid gray;
}
.WikiaArticle .caption {
 text-align: center !important;
 color: inherit;
}
.WikiaArticle table .article-thumb {
 padding: 0px;
 margin: 0px;
}

```

### Остальные немаловажные элементы

Также можно оформить все видимые блоки, которые почти всегда на виду и сопровождают нас на всех вики-страницах:

* Блок Категорий и нижний блок интервики.
* Все блоки в "рельсе" (правой колонке), такие как "Недавняя вики-деятельность", "Популярные страницы" и т.д..

## Наполнение

**Точка зрения новой вики**

Сразу хочу заметить, что вики-меню (верхнее меню с содержанием вики) и Заглавная страница совсем не обязательны к заполнению в первую очередь, поскольку на вики ещё совершенно нет контента. Тем не менее, если есть уже представления о дизайне Заглавной страницы, то можно начать её создание. В таком случае, по её завершении, первоначально нужно будет избавиться от красных ссылок, т.е. создать все страницы, указанные на Заглавной.

### Шаблоны

**Инфобоксы**

Проще всего начинать с навигации по вики и её ранней систематизации. Иначе в будущем может получиться бардак. Я обычно сразу начинаю с Инфобоксов. Конечно же, создаваемые Инфобоксы теперь уже будут с модульной разметкой. И первыми инфобоксами обычно всегда создаются для Персонажей и для Эпизодов/Глав. Примеры оформления, а также макеты, можно посмотреть на чуть раннее указанной странице по ссылке.

**Навибоксы**

Затем можно создать Навибоксы для наглядной навигации по основным типам статей: персонажи, способности, огранизации и т.д. и т.п. в соответствии с тематикой вашей вики. Не стоит замарачиваться над структурой навибоксов. Хватит обычной сворачивающейся таблицы. (Пример)

Конечно, есть и мудрённые варианты с отдельными встроенными шаблонами-частями в навибокс, а сам навибокс является шаблоном для всех частей. (Пример)

А есть более современные шаблоны, написанные на разметке "Lua", которые очень функциональны, но в то же время недоступные обычному участнику.

Тем не менее, на Dev Wiki было написано **дополнение**, которое уже включает в себя готовый модуль с навибоксом, и настроен он таким образом, что представляет из себя обычный конструктор, нужно лишь подключить само дополнение. И уже благодаря этому дополнению, создать свой Модуль Навибокса не составит никакого труда. В результате, я сам это опробовал и создал макет такого Модуля Навибокса.

### Статьи

И теперь можно приступать к созданию самих статей. Но не обязательно пытаться наполнить полностью одну статью. Достаточно создать заготовку статьи, при этом наполнив её необходимой для начала информацией. Возьмём для примера статьи Персонажей. Первым делом обычно наполняется инфобокс персонажа. Однако, достаточно будет лишь одной картинки персонажа с параметром thumb (для расположения изображения на месте инфобокса). Затем добавляется начальное описание персонажа и создаются необходимые разделы для него, в соответствии с тематикой проекта (Внешность, Биография и разделы на подобие Силы и способности, и т.п.). Из разделов можно написать (или перевести с англ. вики) следующие: раздел Внешности и при необходимости сопроводить его галереей, в разделе Биографии можно описать биографию/историю "до" основных событий (если такова имеется). Этого уже будет достаточно для начала.

**Точка зрения "подобранной" вики**

Многие вики могут быть уже созданы, но быть "мёртвыми". Поэтому опытные участники не пытаются создать новую вики, а пробуют связаться с администраторами этих вики, чтобы получить права администратора на них, или же оставить запрос на получение прав в спец. теме на Центральной Вики. Тем не менее, если вики почти полностью пустая, то проще создать свою, а потом запросить слияние вики-дубликата и смену адреса вики. В таком случае, не придётся запрашивать права администратора, поскольку все нужные привилегии уже будут иметься и как "Создатель" вики ещё будут и права бюрократа.

### Чистка

Придя на "подобранную вики", сразу можно столкнуться с бардаком в статьях, категориях и изображениях. В таком случае вам, как новому администратору, предстоит не лёгкая работа - чистка. Перед началом, нужно просмотреть все имеющиеся статьи на их содержание. Если они по вашему мнению не соответствуют должному виду и наполненности, то нужно привести их в порядок и наполнить. Лишние или слишком короткие статьи лучше будет для начала удалить. В ходе проверки статей, нужно также проверить и наличие шаблонов и их работоспособность, а также при необходимости оформить их, так как зачастую шаблоны могут быть бездумно скопированы с англ. вики без css или просто являться простыми шаблонами.

Затем нужно систематизировать древо категорий и категоризировать все имеющиеся статьи.

На этом можно заканчивать данное руководство. Его вполне достаточно для простого оформления нового вики-проекта обычным участником. Руководство, возможно, будет дополняться. Также вы можете оставлять комментарии к нему, с предложениями чего ещё бы можно было добавить в данное руководство. Dr.Bryan (обсуждение)

## См. также

* Список ссылок — Полезные импорты и не только.
* Инфобоксы — подробная справка по модульным инфобоксам, с примерами.
* Как правильно начать вики — блог участника Kuzura о том, как правильно начать создание вики-проекта.
* Советы, советы, советы — советы участника Kuzura касательно уже администрирования вики-проекта.