Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Как сделать собственную иконку после ника и как сделать фото проекта а не надпись

Dm1try

Dm1try

Янв
27
0
Пользователь
Здравствуйте, кто сможет помочь?
Я хочу сделать подобную иконку, но как? И как вместо надписи сделать фото проекта а не надпись
1000033409.jpg1000033433.jpg
 
Решение
Bloadnak
Dm1try написал(а):
Здравствуйте, кто сможет помочь?
Я хочу сделать подобную иконку, но как? И как вместо надписи сделать фото проекта а не надпись
Посмотреть вложение 21557Посмотреть вложение 21558
Нажмите для раскрытия...
&:after {
content: '';
display: inline-block;
width: 32px;
height: 32px;
background-image: url('ссылку на то что хочешь вставить ');
background-size: contain;
background-repeat: no-repeat;
margin-left: 2px;
vertical-align: middle
}

Думаю сам разберёшься с after и before и где вставить ссылку,если помог ставь решение
Сортировка по дате Сортировка по голосам
D

Djssisjw

Фев
78
7
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Могу дать код именно как у крмп онлайн и могу помоч
 
Позитивный голос 0 Негативный голос
D

Djssisjw

Фев
78
7
Заблокированный
2.6. Весь код необходимо брать под тег "Код".
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Less: 
/* User-circle */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f2bd";
        font-weight: 600;
        padding-right: 2px;
        display: inline-block
}
/* Fire */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f06d";
        font-weight: 600;
        padding-right: 2px;
        display: inline-block
}
/* Star-half-alt */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f5c0";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Medrt */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\e3c8";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Registered */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f25d";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Khanda */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f66d";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Dragon */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f6d5";
        font-weight: 600;
        padding-right: 2px;
        display: inline-block
}
/* Wind */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f72e";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Chess-king */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f43f";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Guestion-circle */
.username--style3::before {
        font-family: "Font Awesome 5 Pro";
        content: "\f059";
        font-weight: 600;
        display: inline-block;
        margin-right: 1px
}
/* Hands-helping */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f4c4";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Code */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f121";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Shield-alt */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f3ed";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Democrat */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f747";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Fighter-jet */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f0fb";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Joint */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f595";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Info */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f129";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Layer-group */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f5fd";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Gamepad */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f11b";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Star-and-crescent */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f699";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* User-astronaut */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f4fb";
        font-weight: 600;
        padding-right: 5px;
        display: inline-block
}
/* Music */
.username--style3:before {
        font-family: "Font Awesome 5 Pro";
        content: "\f001";
        font-weight: 600;
        padding-right: 3px;
        display: inline-block
}
/* Shield */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f132";
    font-weight: 600;
    padding-right: 5px;
    display: inline-block
}
/* Comment-dollar */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f651";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Rocket */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f135";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Robot*/
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f544";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Tree-palm */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f82b";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Plane */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f072";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Crown */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f521";
    font-weight: 600;
    padding-right: 5px;
    display: inline-block
}
/* Swords */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f71d";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Do-not-enter */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f5ec";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Helmet-battle */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f6eb";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Address-card */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f2bb";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Snowflake */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f2dc";
    font-weight: 600;
    padding-right: 5px;
    display: inline-block
}
/* Bookmark */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f02e";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Sparkles */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f890";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Angle-double-up */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f102";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Camera */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f030";
    font-weight: 600;
    display: inline-block;
    margin-right: 5px
}
/* Broom */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f51a";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Cross */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f654";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Globe */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f0ac";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Comment-alt */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f27a";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Badge-dollar */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f645";
    font-weight: 600;
    padding-right: 3px;
    display: inline-block
}
/* Cat */
.username--style3:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f6be";
    font-weight: 600;
    padding-right: 2px;
    display: inline-block
}
/* Alien-monster */
.username--style3:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f8f6";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Badge-check */
.username--style3:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f336";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Badge-dollar */
.username--style3:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f645";
    font-weight: 600;
    padding-right: 1px;
    display: inline-block
}
/* Logo CRMP */
.username--style3:after {
    content: '';
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url('[URL='https://i.postimg.cc/15hXHRLp/Picsart-25-05-17-15-14-02-182.png%27);']https://i.postimg.cc/15hXHRLp/Picsart-25-05-17-15-14-02-182.png');[/URL]
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 2px;
    vertical-align: middle
}
/* Father Christmas */
.username--style3:after {
    content: '';
    display: inline-block;
    width: 32px;
    height: 32px;
    background-image: url('[URL='https://i.postimg.cc/d3JqQZMJ/IMG-20251202-070715-561.png%27);']https://i.postimg.cc/d3JqQZMJ/IMG-20251202-070715-561.png');[/URL]
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 2px;
    vertical-align: middle
}
 
Последнее редактирование модератором:
Позитивный голос 0 Негативный голос
D

Djssisjw

Фев
78
7
Заблокированный
2.6. Весь код необходимо брать под тег "Код".
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Это не в extra less
CSS баннера там поймеш где уже идёт начало :after или другое слова там должно
Пример:

Less: 
&:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f2bd";
    font-weight: 600;
    padding-right: 2px;
    display: inline-block
}
 
Последнее редактирование модератором:
Позитивный голос 0 Негативный голос
heartless

heartless

never stress
Дек
501
280
Активный
Djssisjw написал(а):
Это не в extra less
CSS баннера там поймеш где уже идёт начало :after или другое слова там должно
Пример:

&:before {
font-family: "Font Awesome 5 Pro";
content: "\f2bd";
font-weight: 600;
padding-right: 2px;
display: inline-block
}
Нажмите для раскрытия...
OFFTOP

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

 
Позитивный голос 0 Негативный голос
D

Djssisjw

Фев
78
7
Заблокированный
Обратите внимание, пользователь заблокирован на форуме. Не рекомендуется проводить сделки. Мы не несем ответственности за действия пользователя вне форума.
Да я понел уже мне тока помоч с командой проекта
 
Позитивный голос 0 Негативный голос
Bloadnak

Bloadnak

Дек
188
18
Пользователь
Dm1try написал(а):
Здравствуйте, кто сможет помочь?
Я хочу сделать подобную иконку, но как? И как вместо надписи сделать фото проекта а не надпись
Посмотреть вложение 21557Посмотреть вложение 21558
Нажмите для раскрытия...
&:after {
content: '';
display: inline-block;
width: 32px;
height: 32px;
background-image: url('ссылку на то что хочешь вставить ');
background-size: contain;
background-repeat: no-repeat;
margin-left: 2px;
vertical-align: middle
}

Думаю сам разберёшься с after и before и где вставить ссылку,если помог ставь решение
 
Позитивный голос 0 Негативный голос
Решение
Bloadnak

Bloadnak

Дек
188
18
Пользователь
Dm1try написал(а):
Здравствуйте, кто сможет помочь?
Я хочу сделать подобную иконку, но как? И как вместо надписи сделать фото проекта а не надпись
Посмотреть вложение 21557Посмотреть вложение 21558
Нажмите для раскрытия...
Если хочеш вместо надписи вверху фотографию то делай так,

1.Идеш в postigames и загружаеш фотку
2.Жмеш на получить ссылку для миниатюр форум удаляеш ненужное а оставляешь с png jpg
3.Идеш в панел управления на форуме и идеш в Шаблоны и в пойск введи PAGE_CONTAINER
3.заэодиш в шаблон и ищешь надпись
<img src="https://i.postimg.cc/R62DmkgW/IMG-20260311-185930-715.jpg"{$xf.options.boardTitle}"

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

Если помог то ставь решение ❤️
 

Вложения

  • Screenshot_2026-03-12-22-06-58-623_com.android.chrome-edit.jpg
    Screenshot_2026-03-12-22-06-58-623_com.android.chrome-edit.jpg
    104.9 KB · Просмотры: 3
Позитивный голос 0 Негативный голос
Войдите или зарегистрируйтесь для ответа.
Сверху