Фон для виджетов форума или любого плагина

Фон для виджетов форума или любого плагина 1.0.0

Нет прав для скачивания
Поэкспериментируем с фоном для виджетов форма или любого плагина.
Обзор История версий Обсуждение
baltun

baltun

Администратор
Сообщения
12.023
Реакции
2.963
Баллы
1.833
baltun разместил(а) новый ресурс:

Фон для виджетов форма или любого плагина - Поэкспериментируем с фоном для виджетов форма или любого плагина.

Я просто приведу пример кода для фона виджета, соответственно владельцы форумов могут менять классы и таким образом применять фон для любого виджета на свой вкус. Фон прикладываю, если будет интересно можно количество фонов увеличить.
CSS: 
.block[data-widget-key="xfrm_forum_overview_new_resources"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png)...
Нажмите, чтобы раскрыть...

Посмотреть страницу этого ресурса...
 
Данный код поменял фоны виджетов без проблем, всё отображается здорово, но есть одна проблема :cray2:
На созданном новом виджете HTML, картинка не отображается.
Если есть решение, подскажите пожалуйста, как исправить?
Спасибо!
 
Stiksar сказал(а):
Данный код поменял фоны виджетов без проблем, всё отображается здорово, но есть одна проблема :cray2:
На созданном новом виджете HTML, картинка не отображается.
Если есть решение, подскажите пожалуйста, как исправить?
Спасибо!
Нажмите, чтобы раскрыть...
CSS: 
.block[data-widget-key="ТУТ КЛЮЧ МЕНЯЛИ?"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}

ТУТ КЛЮЧ МЕНЯЛИ?
 
@hacker, да, конечно. У меня 5 виджетов отображается картинка норм, а вот новый созданный html не хочет отображать. Это первый и единственный виджет который я создал для главной, остальные все стандартные типа актуальные темы, статистика форума и т.д.
 
1739760894741.png

А где у меня главная? Ключ - это id виджета внимательней посмотрите:
1739761045621.png
 

@hacker,​

Всё проверено:​

Код: 
.block[data-widget-key="radio_for"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.6)
        ),
        url(/baner/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}

2025-02-17_08-09-23.png

Может ли внутренний код в виджете влиять на отображение картинки?

Мой код в виджете:​

HTML: 
<div id="radiobells_container"><a href="https://www.radiobells.com/" id="RP_link">Онлайн радио</a> #radiobells_script_hash</div><link href="https://www.radiobells.com/script/style.css" type="text/css" rel="stylesheet" /><script type="text/javascript">var rad_backcolor="#e6e6e6"; var rad_logo = "white"; var rad_autoplay = false; var rad_width = "responsive"; var rad_width_px = 330;var rad_stations =[['https://radiorecord.hostingradio.ru/rr_main96.aacp','Радио Рекорд','radiorecord'],['https://radiorecord.hostingradio.ru/rock96.aacp','Record Rock','recordrock'],['https://pub0201.101.ru/stream/trust/mp3/128/17?','Юмор FM Танцуют все!','umorfmtancuyutvse'],['https://cast2.my-control-panel.com/proxy/vladas/stream','Rock Radio','rockradio'],['https://radiopotok2.online/http://79.120.39.202:8000/darkelectro','Radio Caprice Dark Electro / Aggrotech','capricedarkelectroaggrotech'],['https://radiorecord.hostingradio.ru/deep96.aacp','Record Deep','recorddeep'],['https://radiopotok2.online/http://77.51.212.205:8005/live192','Synth Radio','synthradio'],['https://nashe1.hostingradio.ru/nashe-256','Наше радио','nashe'],['https://pub0101.101.ru/stream/air/aac/64/100','Авторадио','avtoradio'],['https://pub0302.101.ru:8000/stream/pro/aac/64/191','Радио Король и Шут','korolishutradio'],['https://retro.hostingradio.ru:8043/retro256.mp3','Ретро ФМ','retrofmrus'],['https://nashe1.hostingradio.ru:80/ultra-192.mp3','Радио ULTRA','ultra'],['https://radiorecord.hostingradio.ru/chil96.aacp','Record Chill-Out','recordchillout'],['https://listen2.myradio24.com/8226','Enigmatic Station 1','enigmaticstation1'],['https://rock.amgradio.ru/RusRock?r_bells','Русский Рок','makradiorusrock'],['https://strm112.1.fm/atr_mobile_mp3?aw_0_req.gdpr=true&listenerid=5bc24bed87bccbc49bff38187f4e0e8d&awparams=companionAds%3Atrue','1FM Amsterdam Trance Radio','1fmtrance'],['https://radiopotok2.online/http://online.kissfm.ua/KissFM_HD','Kiss FM','kissfm'],['https://myradio24.org/5129','BEST DEEP FM','bestdeepfm'],['https://maximum-punk.hostingradio.ru/maxpunk96.aacp','Радио Maximum Punk','maximumpunk'],['https://rusradio.hostingradio.ru/rusradio96.aacp','Русское радио','russradio'],['https://hr.amgradio.ru/Horoshee?r_bells','Хорошее радио','horoshee'],['https://stream.newradio.ru/novoe96.aacp','Новое радио','newradio'],['https://radiorecord.hostingradio.ru/tm96.aacp','Record Trancemission','trancemission'],['https://radiorecord.hostingradio.ru/ps96.aacp','Пиратская станция','pirate'],['https://dfm-prodigy.hostingradio.ru/prodigy96.aacp','DFM The Prodigy','dfmprodigy'],['https://listen.megahit.online/megamp128','Радио Мегахит','megahitonline'],['https://listen7.myradio24.com/tisradio','TRANCE IS STAR RADIO','tranceisstar'],['https://radiopotok2.online/http://radiozaplin.com:8000/stream/1/','Radio Zaplin','zaplin'],['https://radio.enigmatic.su:8005/radio','Enigmatic Station 3','enigmaticstation3'],['https://retro.amgradio.ru/Retro?r_bells','Ретро Хит','retrohit'],['https://stream.audiodiz.ru/listen/light/radio','Лёгкое Радио','slamfm'],['https://radiorecord.hostingradio.ru/sd9096.aacp','Супердискотека 90-х','super90'],['https://evcast.mediacp.eu:2075/stream','Радио Советская эстрада','sovetestrada'],['https://my.radioprocessor.com:8100/best_trance-320.mp3','Best Trance','besttranceradio'],['https://hitfm.hostingradio.ru/hitfm96.aacp','Хит FM','hitfm'],['https://listen7.myradio24.com/22602','Радио Калейдоскоп: Шансон','kaleydoskopshanson'],['https://live.radiospinner.com/90sprdsctk-96','Radio Spinner Супер Дискач 90-х','spinnersuperdiskach90'],['https://listen1.myradio24.com/5967','90s Eurodance','diskoteka90'],['https://pub0302.101.ru:8443/stream/air/aac/64/202','Comedy Radio','comediradio'],['https://abs.zaycev.fm/shanson256k','Зайцев FM Шансон','zaycevfmshanson'],['https://radiorecord.hostingradio.ru/rmx96.aacp','Record Remix','recordremix'],['https://radiopotok2.online/http://radio.rudeep.ru:8000/stream','Russian Deep Radio','rudeep'],['https://radiopotok2.online/http://fr1.1mix.co.uk:8060/320','1Mix Trance','1mixtrance'],['https://pub0302.101.ru:8443/stream/air/aac/64/102','Юмор FM','umor'],['https://shoutcast.aplus.fm/aplus_relax_128','Радио Аплюс Relax','aplusrelax'],['https://icecast-studio21.cdnvideo.ru/KalynaK_1a','Радио Калина Красная','kalina'],['https://live.radiospinner.com/sssrht-96','Radio Spinner СССР Хит','spinnersssr'],['https://abs.zaycev.fm/relax256k','Зайцев FM Релакс','zaycevrelax'],['https://my.radioprocessor.com:8100/hit80x-192.mp3','Радио Хиты 80х','hiti80radio'],['https://radiorecord.hostingradio.ru/mdl96.aacp','Медляк FM','medliakfm'],['https://murka.amgradio.ru/MurkaFM?r_bells','Мурка FM','murkafm'],['https://dfm-dancegold10.hostingradio.ru/dancegold1096.aacp','DFM Dance Gold 2010s','dfmdancegold2010'],['https://radiorecord.hostingradio.ru/chil96.aacp','Chill-out Radio','chilloutradio'],['https://pub0301.101.ru:8443/stream/pro/aac/64/1','Дискотека 80-х','disco80'],['https://radio3.pro-fhi.net/flux-vwfzupwj/stream','Радио Метал','radiometal'],['https://pub0102.101.ru:8443/stream/pro/aac/64/33','Россия 90-ых','russia90x'],['https://cast1.torontocast.com:4305/stream','RockMix Radio','rockmix'],['https://shoutcast.aplus.fm/aplus_rock_128','Радио Аплюс Рок','aplusrock'],['https://pub0201.101.ru/stream/pro/aac/64/74?','Авторадио Дискотека 90-х','avtoradiodisco90'],['https://online.rockarsenal.ru/rockwotalk','Рок Арсенал','rockarsenal'],['https://live.novoeradio.by:444/live/narodnoeradio_aac128/icecast.audio','Народное Радио Беларусь','narodnoeradioby'],['https://pub0201.101.ru/stream/trust/mp3/128/264','Relax FM Музыка для дома','relaxfmdlyadoma'],['https://radiorecord.hostingradio.ru/fut96.aacp','Record Future House','recordfuturehouse'],['https://radio.kamchatkalive.ru:8103/rock','Kamchatka LIVE - Rock','kamchatkaliverock'],['https://radiorecord.hostingradio.ru/gold96.aacp','Record Gold','recordgold'],['https://radiopotok2.online/http://spb.radioshock.ru/radioshock','Радио Шок','shok'],['https://pub0302.101.ru:8443/stream/pro/aac/64/74','Дискотека 90-ых','disco90'],['https://dfm-dancegold00.hostingradio.ru/dancegold0096.aacp','DFM Dance Gold 2000s','dfmdancegold2000'],['https://fresh.amgradio.ru/Fresh?r_bells','Radio Fresh','makradiofresh'],['https://jfm1.hostingradio.ru:14536/rock90.mp3','Rock FM: 90s','rockfm90'],['https://radiorecord.hostingradio.ru/tiesto96.aacp','Record Tiesto','recordtiesto'],['https://rockhits.hostingradio.ru/rockhits96.aacp','Радио Maximum Rock Hits','maximumrockhits'],['https://pub0201.101.ru/stream/pro/aac/64/42?','Авторадио Русский рок','avtoradiorusrock'],['https://pub0201.101.ru/stream/pro/aac/64/148','Музыка Юмор FM','umorfmmusic'],['https://jfm1.hostingradio.ru:14536/metal.mp3','Rock FM: Heavy','rockfmheavy'],['https://listen.myrh.ru/rocktimeradio','RockTime Radio','rocktimeradio'],['https://radio.enigmatic.su:8105/radio','Enigmatic Sunshine','enigmaticsunshine'],['https://dfm-popgold10.hostingradio.ru/popgold1096.aacp','DFM Pop Gold 2010s','dfmpopgold2010'],['https://radiopotok2.online/http://79.111.14.76:8000/eclecticprog','Radio Caprice Eclectic Progressive Rock','capriceeclecticprogressiverock']];</script><script type="text/javascript" src="https://www.radiobells.com/script/v2_1.js" charset="UTF-8"></script>
 
Пробуйте такой вариант:

Код: 
.block[data-widget-key="radio_for"] {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}

Stiksar сказал(а):
Может ли внутренний код в виджете влиять на отображение картинки?
Нажмите, чтобы раскрыть...
Скорее всего да! Так как в коде есть текст _container
 
@hacker, проверил, к сожалению не работает. Если других вариантов нет, то ладно, для меня это не критично, данный виджет сильно в глаза не бросается.
 
Попробуйте тогда так прописать:
CSS: 
.block[data-widget-id="тут id виджета"] .block-container
 
@Stiksar, Дай те Сане доступ в ЛС он сам сделает и посмотрит вашу кайфушку. и еще найдет ошибки в консоле.
 
Вы пишите так для виджета:
CSS: 
.block[data-widget-key="xfrm_forum_overview_new_resources"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}
.block[data-widget-id="13"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}
Получает один код для одного виджета второй для второго можно еще меньше код сделать при желании, если виджеты по картинке отличаются, если не отличаются можно так вообще прописать:
CSS: 
.block[data-widget-key="xfrm_forum_overview_new_resources"] .block-container,
.block[data-widget-id="13"] .block-container {
    background-image:         linear-gradient(
          rgba(255, 255, 255, 0.3),
          rgba(255, 255, 255, 0.8)
        ),
        url(styles/hal/pngwing.com.png);
    background-size: cover;
    background-repeat: no-repeat;
}
13 это id виджета как пример.
 
Для ответа нужно войти/зарегистрироваться
Назад
Верх Низ