Skocz do zawartości
Forum komputerowe

[uPster] Kontakt z Administracją z ON / OFF. Poradnik MyBB.


Rekomendowane odpowiedzi

  • Ekspert

Kontakt z Administracją

Ze statusem Online/Offline

Screenshot_2019-09-07 deadly-bullet y0 pl.png

Style i Szablony -> Szablony -> Twój szablon -> Strona główna -> index i do sidebaru dodajemy:

Spoiler

<div id="tborder">
        <div class="bgcont">
        <h2 style="font-size: 20px; font-weight: 500; margin-left: 5px; color: #6d6d6d; margin-top: -10px;"><i class="fas fa-user-cog"></i> Administracja</h2>
            <!-- WLASCICIELE // -->

            <div id="c_t">
                <div class="rankstyle"><div class="rank-margin"><span class="wl">Właściciel</span></div>
                    <div class="c-avatar"><a href="#"><img src="https://i.imgur.com/Eabt0gg.png" class="c_img"></a></div>
                    <div class="user-style"><a href="#"><span class="wl"><i class="fab fa-black-tie"></i> uPster</span></a></div>
                    <div class="c-style">
                        <a href="#"><i class="fas fa-envelope fa-sz-st"></i></a> 
                        <a href="#"><i class="fab fa-steam fa-sz-st padd-cont"></i></a> 
                        <a href="#"><i class="fab fa-gg fa-sz-st"></i></a>
                    </div>
                    <div class="status" style="margin: 10px 0px;">
                        <span id="wlStatus"></span>
                    </div>
                </div>    
            </div>

            <div id="c_t">
                <div class="rankstyle"><div class="rank-margin"><span class="ha">Head Admin</span></div>
                    <span class="c-avatar"><a href="#"><img src="https://i.imgur.com/Eabt0gg.png" class="c_img"></a></span>
                    <div class="user-style"><a href="#"><span class="ha"><i class="fas fa-briefcase"></i> Roughster</span></a></div>
                    <div class="c-style">
                        <a href="#"><i class="fas fa-envelope fa-sz-st"></i></a> 
                        <a href="#"><i class="fab fa-steam fa-sz-st padd-cont"></i></a> 
                        <a href="#"><i class="fab fa-gg fa-sz-st"></i></a>
                    </div>    
                    <div class="status" style="margin: 10px 0px;">
                        <span id="haStatus"></span>
                    </div>
                </div>    
            </div>

            <div id="c_t">
                <div class="rankstyle"><div class="rank-margin"><span class="ja">Junior Administrator</span></div>
                    <span class="c-avatar"><a href="#"><img src="https://i.imgur.com/Eabt0gg.png" class="c_img"></a></span>
                    <div class="user-style"><a href="#"><span class="ja"><i class="fas fa-bullhorn"></i> Speed</span></a></div>
                    <div class="c-style">
                        <a href="#"><i class="fas fa-envelope fa-sz-st"></i></a> 
                        <a href="#"><i class="fab fa-steam fa-sz-st padd-cont"></i></a> 
                        <a href="#"><i class="fab fa-gg fa-sz-st"></i></a>
                    </div>
                    <div class="status" style="margin: 10px 0px;">
                        <span id="jaStatus"></span>
                    </div>
                </div>    
            </div>                
        </div>
    </div>

Teraz przejdź do Stopka footer i na końcu dodaj:

Spoiler

<script type="text/javascript">
    $(function() {
  const rankstyle = $(".statusoo"); // Rodzic: kto jest online

  const wlStatus = $("#wlStatus"); // Miejsce w sidebar w kontakcie, w którym wyswietli sie status właściciela
  const wlRank = $(".wl"); // Klasa rangi właściciela

  const haStatus = $("#haStatus"); // Miejsce w sidebar w kontakcie, w którym wyswietli sie status head administratora
  const haRank = $(".ha"); // Klasa rangi head administratora
        
  const jaStatus = $("#jaStatus"); // Miejsce w sidebar w kontakcie, w którym wyswietli sie status junior administratora
  const jaRank = $(".ja"); // Klasa rangi junior administratora
  
  const statusOnline = '<span class="statusOnline">Online</span>';
  const statusOffline = '<span class="statusOffline">Offline</span>';

  if (rankstyle.find(wlRank).text().includes('uPster')) {
    wlStatus.html(statusOnline);
  } else {
    wlStatus.html(statusOffline);
  }
        
  if (rankstyle.find(haRank).text().includes('Roughster')) {
    haStatus.html(statusOnline);
  } else {
    haStatus.html(statusOffline);
  }

  if (rankstyle.find(jaRank).text().includes('Speed')) {
    jaStatus.html(statusOnline);
  } else {
    jaStatus.html(statusOffline);
  }        
});
</script>

Teraz przejdź do Strona główna -> index_whosoline i w spanie lub divie gdzie jest wyświetlana zmienna {$onlinemembers} dodaj

statusoo

Cofamy się do Style i Szablony i wybieramy Style -> Twój styl -> global.css i na końcu dodaj:

Spoiler

.bgcont {
    background: #232324;
    padding: 25px 15px;
    border-radius: 3px;
}

#c_t {
    padding: 5px;
    font-size: 14px;
}

.rankstyle {
    text-align: center;
    font-size: 16px;
    padding: 10px;
    background: #202022;
    border-radius: 5px;
}

.rank-margin {
    margin-bottom: 15px;
}

.c-avatar {
    text-align: center;
    width: 100%;
    display: block;
    padding-bottom: 10px;
}

.c_img {
    height: 70px;
    width: 70px;
    border-radius: 50%;
    border: 1px solid #413d3d;
}

.user-style {
    text-align: center;
    font-size: 14px;
}

.c-style {
    text-align: center;
    font-size: 15px;
    padding-top: 5px;
}

.fa-sz-st {
    font-size: 1.3em;
    color: #c2c2c2;
}

.padd-cont {
    padding-left: 10px;
    padding-right: 10px;
}

.statusOnline {
    background: #339433;
    color: white;
    padding: 2px 3px;
    border-radius: 3px;
    font-size: 12px;
}

.statusOffline {
    background: #c75050;
    color: white;
    padding: 2px 3px;
    border-radius: 3px;
    font-size: 12px;
}

Odnośnik do odpowiedzi
Udostępnij na innych stronach

Problem wciąż nierozwiązany? Dodaj swoją odpowiedź

Jeśli chcesz dodać odpowiedź, zaloguj się lub zarejestruj nowe konto. Jedynie zarejestrowani użytkownicy mogą komentować zawartość tej strony.

Zarejestruj nowe konto

Załóż nowe konto. To bardzo proste!

Zarejestruj się

Zaloguj się

Posiadasz już konto? Zaloguj się poniżej.

Zaloguj się
  • Podobna zawartość

    • Przez ups
      [uPster] Przydatne linki. Poradnik MyBB. Tak sobie wrzucę :v
      HTML
      CSS
    • Przez ups
      Profil ala IPS do MyBB
      Przerobiony z poradnika od SimLay'a https://www.pecetowicz.pl/topic/profil-ala-ipb-w-mybb-88268/
      Przed zrobieniem tego zróbcie sobie kopie zapasowe tych szablonów
      Przejdź do ACP  Style i Szablony  Szablony  Twój szablon  Podgląd profilu i podmień ten szablony:
      member_profile
      member_profile_adminoptions
      member_profile_avatar
      member_profile_contact_details
      member_profile_customfields
      member_profile_customfields_field
      member_profile_email
      member_profile_findposts
      member_profile_modoptions
      member_profile_modoptions_banuser
      member_profile_modoptions_editprofile
      member_profile_modoptions_manageuser
      member_profile_modoptions_purgespammer
      member_profile_offline
      member_profile_online
      member_profile_pm
      member_profile_warninglevel
      Przejdź teraz do Style i Szablony > Style > Twój styl > global.css lub stwórz nowy arkusz > wklej całą zawartość tego kodu:
      Żeby zmienić tło w profilu przejdź do katalogu images i podmień grafikę o nazwie bg.jpg (może być to również inne rozszerzenie)
      Aby wyświetlała się taka reputacja jak na zdjęciu poniżej pobierz plik z załącznika
      Pobierz plik addtemplatefunctions.php i wgraj go do /inc/plugins, aby wszystko dobrze funkcjonowało
      Reputation levels.zip
      addtemplatefunction.php
      To już wszystko. No chyba, że o czymś zapomniałem...
    • Przez ups
      Ogłoszenia na forum
      Ogłoszenia na forum w których można zmieniać zdjęcie w tle
      Dzisiaj przedstawiam wam ogłoszenia na forum.
      Przechodzimy do Style i Szablony Szablony Twój szablon Strona główna index i wklejamy ten kod:
      Cofamy się do Style i Szablony i wybieramy Style Twój styl global.css lub utwórz nowy arkusz CSS i wklej ten kod:
      Teraz pobieramy plik z załącznika i wrzucamy do naszego serwera FTP
      oglimg.rar
      Jeśli chcemy mieć różne zdjęcia w tle, możemy podmienić link do zdjęć z kodu CSS powyżej na te, które są w folderze images/ogl lub wgrać własne.
      Natomiast, jeśli nie chcemy mieć żadnych zdjęć w tle, zostawiamy te linki jak są powyżej.
    • Przez ups
      DVZ Shoutbox
      Przeróbka DVZ Shoutbox by Devilshakerz
      Pierwsze co robimy to oczywiście pobieramy plik z załącznika wgrywamy do FTP (najlepiej przeciągnąć plik inc oraz jscripts do głównego katalogu, wtedy jest szybciej i wszystko zostanie wrzucone do odpowiednich folderów).
      Po wgranego do naszego FTP wchodzimy na nasze forum do panelu ACP i aktywujemy plugin.
      Po aktywowaniu pluginu tworzymy nowy arkusz [Style i Szablony > Style > Twój styl > Nowy arkusz], kopiujemy i wklejamy zawartość dvzshoutbox.css która znajduje się w pliku rar.
      Po tej akcji przechodzimy do [Style i Szablony > Szablony > Globalne szablony > dvz_shoutbox] i wklejamy:
      <div id="shoutbox" class="front{$classes}"> <div class="head"> <div class="thead-icon"><i class="fa ti-shoutbox" aria-hidden="true"></i></div> Chatbox <p class="right"> <a href="https://p4f-samp.eu/showthread.php?tid=356&pid=2079#pid2079" class="regsb"><i class="far fa-newspaper"></i> <span>Regulamin Chatbox'a</span></a> <a href="{$mybb->settings['bburl']}/index.php?action=shoutbox_archive" class="archivesb"><i class="far fa-trash-alt"></i> <span>Archwium</span></a> </p> </div> <div class="body"> <div class="warn"><i class="fa fa-exclamation-triangle"></i> Chatbox dostępny od 5 postów!</div> <div class="window" style="height: 307px;"> <div class="data"> {$html} </div> </div> {$panel} </div> <script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/dvz_shoutbox.js"></script> {$javascript} </div> DVZ_Shoutbox edit by uPster.rar
×
×
  • Dodaj nową pozycję...