Делаем фон темы \ Как красиво оформить свою тему? - Гайд

[K.Devyan]

Тут некоторые спрашивали, как же сделать фон у темы. Так вот, в этом гайде я расскажу про фон и немного других фишек

Важно, чтобы вы всё делали поэтапно. Если что-то не получается, я отвечу вам в этой теме или в Discord K.Devyan#4520
Так же извиняюсь за ужасное текстовое оформление, приму любую критику и улучшу по вашим пожеланиям

На самом деле тут всё банально просто, нам нужно заглянуть в css свойства нашей темы, вот так:

Советую кликать по уже написанному тексту, дабы избежать попадания на свойства самого сайта, а не редактора

Попадаем вот в такое окно, тут нам понадобится только 1 пункт, а это .element.style {... Именно его мы и будем редактировать для кастомизации темы



Для начала начнем с фона, для этого нажимаем на пустое место после скобочки и вводим такое:  background: url(прямая ссылка на вашу картинку, оканчивающаяся на .png, .jpeg и так далее);
Как пример можем взять: https://i.imgur.com/Ikd4cu3.jpeg , это подготовленная мною очень длинная картинка по тематике майнкрафт, ее ват точно хватит на всю длину темы, кстати, тут мы и используем эту картинку. Фулл соответственно можно посмотреть по ссылке.
Получаем вот такой результат:


Далее, чтоб текст смотрелся красиво на нашем фоне, его нужно чуть-чуть отодвинуть от каёв, воспользуемся свойством отступа padding. Советую указывать значение 10, самое подходящее для этого форума: padding:10px


До: 
После: 

Далее, можно добавить окантовку для нашей темы, воспользуемся border. Его можно поставить как вокруг темы, так и с определенных сторон, цвет тоже изменяемый, пиоступаем.

Указываем цвет с помощью border-color: #346ddb; подойдет любоё HEX значение.
Далее указываем стиль, border-style: solid; о стилях можно найти в интернете, тут же я советую использовать стандартный - solid. 
Далее самое главное, размер с каждый стороны темы
border-width: 0px 0px 5px 5px;
1 значение - верх
2 значение - право
3 значение - низ
4 значение - лево
Указываем так, как нам по душе. Советую использовать 5px, но тут уже от ваших требований

Далее можно изменить размер. Прописываем в свойствах: font-size: 25px; экспериментируйте с размером сами, я выбрал 15.

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

[Shomen]

Работаит с гиф








 

[K.Devyan]

2 часа назад, Renault Logan I Рестайлинг сказал:

Я всё делаю так как нужно но возвращается к прежнему состоянию. Помоги....

Как сохранить?

Просто нажимаешь отправить

[awae]

йе щас горедизайнеры окончательно свои темы запоганят спс

[Shomen]

1 час назад, stfu сказал:

йе щас горедизайнеры окончательно свои темы запоганят спс

хыхы

[DINNKA]

В 20.08.2022 в 22:18, stfu сказал:

йе щас горедизайнеры окончательно свои темы запоганят спс

так это же хорошо :)

[anti_s1mple]

Вроде картинка встаёт на место, а сохранить не получается.

[K.Devyan]

up

[K.Devyan]

1

[Shomen]

2

[K.Devyan]

3

[Wh1skas]

up

[Wh1skas]

up

[karibskiy]

Спасибо, весьма занимательный гайд! 🖤

[Wh1skas]

up

[Shomen]

В 20.08.2022 в 23:18, истерия сказал:

йе щас горедизайнеры окончательно свои темы запоганят спс

А гди "дизанеры"?

[K.Devyan]

up

[SunSett_]

круто!

[j2xxn]

прикольная штука

111

[nightysleepy]

Работай!

[nightysleepy]

Вы тоже это видите?
это офигенно, спасибо автору!







туц туц




туцтуц

[Keryesh4ka]

Возьмем на заметку

[kaitai]

Как сохранить? При отправке темы фон становится обычным.

[MinerFox34]

Интересненько, нужно опробовать