[Урок] Как да си направим ББ код за пхпББ

Уроци и въпроси касаещи програмирането в различните му аспекти
Аватар
Nixe
Активен
Активен
Мнения: 274
Регистриран на: 09 Ное 2017, 14:25
Ник в играта: Psych0_91
Скайп профил: live:nixe21
Вашият пол е: Мъж
Местоположение: Antwerpen, Belgium
Обратна връзка:

[Урок] Как да си направим ББ код за пхпББ

Мнение от Nixe »

Това е елементарен урок в който ще демонстрирам как се прави ББ код/ове за пхпББ
Така влизаме си в Админ панела на Форума и натискаме на секцията ПУБЛИКУВАНЕ и после на BB Codes
Ще ни се появят два бокса 'TEXTAREA' първия бокс е 'BBCode използване' а втория е 'HTML заместване'
Какво пишим в BBCode използване ? Там пишем Пример:[demo]{TEXT}[/demo]
задължително синтаксиса трябва да е [#]{TEXT}[/#]
Така няма нещо сложно текста в [] ни е името на бб кода този код ще ни се показва при писане на тема/мнение.
Преминаваме към 'HTML заместване' тука вече пишем хтмл/цсс кода като следваме следния алгоритъм <span style="">{TEXT}</span>
Не е задължително да е span, div, и др когато прочетете малко за css ще знаете къде и кога да ги използвате.
{TEXT} е наща дефиниция с която свързваме BBCode използване+HTML заместване
Между style="#" съм написал:

Код за потвърждение: Избери целия код

<span style="width: auto; padding: 3px; background-color: #AA0000; border: 1px solid #333; font-size: 10px; font-family: Tahoma; text-shadow: 0px 0px 1px #333; color: #eee; font-weight: normal; text-transform: uppercase; border-radius: 5px; box-shadow: 0px 0px 4px #000 ">{TEXT}</span>

Код за потвърждение: Избери целия код

width: auto - това ни позволява дължината ни да се определя от съдържанието;
padding: 3px - това значи че бокса ни ще се дръпне с 3 пиксела от left/right/top/bottom;
background-color: #AA0000 - Фона ще е червен;
border: 1px solid #333 - Целия ни бокс ще има 1px border;
font-size: 10px - Текста ще е 10пиксела;
font-family: Tahoma - Фона на текста ще е [url=https://en.wikipedia.org/wiki/Tahoma_(typeface)]Tahoma[/url]
text-shadow: 0px 0px 1px #333 - Текста ще има сянка;
color: #eee - Цвят на текста, тъмно бяло ;
font-weight: normal - Текста няма да е одебелен;
text-transform: uppercase - Независимо дали сме го написали с малки или големи букви то ще ни се визуализира с големи букви;
border-radius: 5px - Ще имаме [url=https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_border-radius]радиус[/url] от left/right/top/bottom; 
box-shadow: 0px 0px 4px #000  - Бокса ще има 4пиксела сянка;
А ето и какво ще получим от това: Демо
Публикувай отговор

Обратно към “Web Програмиране”

Кой е на линия

Потребители разглеждащи този форум: 0 регистрирани и 1 гост