Rangliste

Nachdem Du die deutsche Übersetzung in Deine Community hochgeladen hast, kannst Du diese natürlich entsprechend für DICH korrigieren und anpassen. Manchmal sind es Fehler, an manchen Stellen muss es aber für DEINE Community anders heißen. Dabei entsteht ein Problem: wenn es ein Update von uns gibt und Du dieses Update in Deiner Community hochlädst, verschwinden Deine Änderungen und Du musst von vorne beginnen. Keine schöne Situation. Was tun? Es gibt ein kleiner Trick, wie Du Deine Anpassungen behältst und trotzdem mit unseren Updates mitgehen kannst. Hier ist die Schritt für Schritt Anleitung: In Deinem AdminCP wechsele zu Anpassung -> Lokalisierung -> Sprachen Klicke auf Neu erstellen und füge eine neue Sprache für Gebietsschema Deutsch zu Deaktiviere die neu erstellte Sprache am Ende der Zeile in der Liste der Sprachen Deine Änderungen machst Du jetzt in dieser neu erstellten und deaktivierten Sprache. Du musst natürlich nicht alles wieder neu übersetzen, sondern nur die Änderungen machen, die dauerhaft von unserer offiziellen Übersetzung in Deiner Community abweichen sollen. Sobald Du mit den Änderungen fertig bist, kehrst Du wieder zu der Liste aller Sprachen zurück und klickst auf den Pfeil am Ende der Sprache mit Deinen Anpassungen. Wähle den Punkt Herunteladen und speichere die XML-Datei lokal auf Deinem Rechner. Jetzt kannst Du mit dieser Datei die offizielle deutsche Übersetzung überschreiben. Dafür wählst Du in der Liste der Sprachen den Pfeil am Ende der Zeile mit der offiziellen deutschen Version (Deutsch im Screenshot oben) und klickst den Punkt Neue Version hochladen. Wähle die gespeicherte XML-Datei mit Deiner Änderungen und klicke auf Speichern. Voilà, jetzt hast Du eine Mischung aus Deinen Änderungen und offiziellen Version. Jedes Mal, wenn Du etwas anpassen willst, machst Du es in der Sprachdatei mit Deinen Änderungen. Merke: alle Änderungen in Deutsch werden mit dem nächsten Update verschwinden! Wenn ein Update von uns für die Sprachdatei zur Verfügung steht, dann gehst Du wie folgt vor: Zuerst lädst Du die offizielle Sprachdatei für Deutsch hoch (Pfeil am Ende von Deutsch) Danach lädst Du die Sprachdatei mit Deinen Änderungen an der selben Stelle hoch. Damit hast Du immer eine Mischung aus der offiziellen Sprachdateien plus Deine Änderungen, bleibst aktuell und wirst Deine Änderungen nicht verlieren.

Eigentlich mehr ein Quicktipp als ein Tutorial. Das Thema kam vor kurzem im englischen Forum auf und vielleicht kann es hier ja auch jemand gebrauchen ... Die wichtigsten sozialen Netzwerke deckt Invision Community bereits von Haus aus ab, manche Exoten allerdings nicht, was bestimmt auch keine andere Software tut. Wie bereits im Thread geschrieben, es gibt mindestens 2 Applications im Marketplace mit denen das auch möglich ist, nur warum Geld für etwas ausgeben, was man mit ein paar Zeilen Code auch selber machen kann? Abgesehen davon bin ich der Meinung, man sollte nicht für alles und jedes 3rd Party Erweiterungen installieren. Im folgenden Beispiel legen wir Icons für Android und Apple an, dafür tauscht einfach den kompletten Inhalt des siteSocialProfiles Templates mit diesem hier aus. Den Originalcode kopiert allerdings vorher zum vergleichen in euren Editor, ich erkläre gleich noch kurz etwas dazu. {{if \IPS\Settings::i()->site_social_profiles AND $links = json_decode( \IPS\Settings::i()->site_social_profiles, TRUE ) AND \count( $links )}} <style> .cShareLink_android { background: #689F38; } .cShareLink_apple { background: #F76BC1; } </style> <li class='cUserNav_icon'> <a href='https://www.android.com' target='_blank' class='cShareLink cShareLink_android' rel='noopener noreferrer'><i class='fa fa-android'></i></a> </li> <li class='cUserNav_icon'> <a href='https://www.apple.com' target='_blank' class='cShareLink cShareLink_apple' rel='noopener noreferrer'><i class='fa fa-apple'></i></a> </li> {{foreach $links as $profile}} <li class='cUserNav_icon'> <a href='{$profile['key']}' target='_blank' class='cShareLink cShareLink_{$profile['value']}' rel='noopener noreferrer'><i class='fa fa-{$profile['value']}'></i></a> </li> {{endforeach}} {{endif}} Das Ergebnis sieht dann so aus und funktioniert sowohl im Header, als auch im Footer eurer Seite, je nach euren Einstellungen im jeweiligen Theme ... Im Original werden mit foreach $links alle Icons generiert, die ihr im AdminCP mit dem Dropdown erstellt habt. Mit style legt ihr die Hintergrundfarbe der neuen Icons fest, dazu wird jeweile eine neue Klasse benötigt. <li class='cUserNav_icon'> <a href='https://www.android.com' target='_blank' class='cShareLink cShareLink_android' rel='noopener noreferrer'><i class='fa fa-android'></i></a> </li> Das hier ist jetzt eins eurer neuen Icons. Es enthält den Link zu android.com, die CSS-Klasse für die Hintergrundfarbe die ihr oben erstellt habt und mit cShareLink die allgemeine Klasse für den Look aller Icons. Für die Symbole selber wird mal wieder Font Awesome verwendet. Scrollt in der Übersicht ganz runter zu Brand Icons, dort findet ihr jede Menge. Das wars im Grossen und Ganzen auch schon. Bei Fragen benutzt bitte das Supportforum, wir helfen euch gerne weiter.

Die mit IPS 4.5 eingeführten AuthorPane Badges unter den Avataren sind zwar eine schicke Sache, allerdings gibt es leider nur zwei verschiedene. Das eine zeigt an, ob der Benutzer Moderatorenrechte hat, das andere kennzeichnet neue Mitglieder. Dabei kann man soviel mehr damit anstellen, deshalb möchten wir hier erläutern wie diese Badges funktionieren und ihr neue hinzufügen könnt. Im ersten Beispiel weisen dafür wir bestimmten Benutzern anhand ihrer ID eigene Badges hinzu. Die ID eines Mitglieds bekommt ihr am einfachsten heraus, indem ihr das Profil aufruft. Der Link sieht dann so ungefähr aus deine-seite.de/profile/2-v0rt3x/ -> meine ist also die Nummer 2. Für die Icons auf den Badges wird Font Awesome verwendet, in diesem Tutorial könnt ihr mehr darüber erfahren. Als erstes öffnen wir das Template custom.css und erstellen eine neue Klasse für mein Icon, was folgendermassen aussieht... .cAuthorPane_badge--v0rt3x::before { content: "\f0a1"; } Jetzt weiss das Forum schonmal, wie das Icon unter meinem Avatar aussehen soll. Nun müssen wir ihm nur noch sagen, wann es eben dieses anzeigen soll und nicht das Moderatoren-Icon. Deshalb wechseln wir jetzt zum postContainer Template und suchen dort nach... {{if $comment->author()->modShowBadge()}} <span class="cAuthorPane_badge cAuthorPane_badge--moderator" data-ipsTooltip title="{lang="member_is_moderator" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->joinedRecently()}} <span class="cAuthorPane_badge cAuthorPane_badge--new" data-ipsTooltip title="{lang="member_is_new_badge" sprintf="$comment->author()->name"}"></span> {{endif}} Das sagt im grossen und ganzen soviel wie "Wenn Mod-Rechte, dann Mod-Icon usw". Mehr über die Template Logik könnt ihr HIER erfahren. Diesen Part erweitern wir jetzt um meine Benutzer-ID und das sieht so aus... {{if $comment->author()->member_id === 2}} <span class="cAuthorPane_badge cAuthorPane_badge--v0rt3x" data-ipsTooltip title="Hallo Leute"></span> {{elseif $comment->author()->modShowBadge()}} <span class="cAuthorPane_badge cAuthorPane_badge--moderator" data-ipsTooltip title="{lang="member_is_moderator" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->joinedRecently()}} <span class="cAuthorPane_badge cAuthorPane_badge--new" data-ipsTooltip title="{lang="member_is_new_badge" sprintf="$comment->author()->name"}"></span> {{endif}} Also wenn die Benutzer-ID 2 ist, dann soll die Klasse cAuthorPane_badge--v0rt3x benutzt werden, die wir oben angelegt haben. Genauso verfahrt ihr mit allen weiteren Benutzern, die ein eigenes Icon bekommen sollen. Beachtet dabei, dass dieser Code zweimal in dem Template vorhanden ist, einmal für die Desktop- und einmal für die Ansicht auf mobilen Geräten. Es geht allerdings noch viel mehr, im zweiten Teil dieses Tutorials verwandeln wir diese Badges deshalb in Online Indikatoren Dafür clonen wir zunächst die Klasse cAuthorPane_badge, benennen sie in cAuthorPane_badge_online um und ändern die Hintergrundfarbe in grün. Fügt dafür einfach das hier in euer custom.css ein... .cAuthorPane_badge_online { position: absolute; left: calc(50% - .5em); bottom: -12px; display: flex; justify-content: center; align-items: center; width: 1em; height: 1em; font-size: 26px; background: green; color: rgb( var(--theme-area_background_reset) ); border: rgb( var(--theme-area_background_reset) ) solid 2px; border-radius: 50%; } Damit der Online-Status auch bei jedem Benutzer angezeigt wird muss natürlich ein weiteres Icon her, sonst würde man den grünen Hintergrund nur bei Moderatoren und neuen Benutzern sehen. .cAuthorPane_badge--member::before { content: "\f007"; } Jetzt noch ein kleiner Schnippsel damit die neue Klasse richtig unter dem Avatar angezeigt wird und schon sind wir mit dem CSS-Teil fertig. .cAuthorPane_badge_online::before { font-family: 'FontAwesome'; font-size: .5em; } Im postContainer ist dafür ein bisschen mehr Code notwendig, nämlich einmal für den Fall das der Benutzer online ist und einmal für offline. {{if $comment->author()->isOnline() AND !$comment->author()->isOnlineAnonymously() OR $comment->author()->isOnlineAnonymously() AND \IPS\Member::loggedIn()->isAdmin() }} {{if $comment->author()->member_id === 2}} <span class="cAuthorPane_badge_online cAuthorPane_badge--v0rt3x" data-ipsTooltip title="The doctor is: IN"></span> {{elseif $comment->author()->modShowBadge()}} <span class="cAuthorPane_badge_online cAuthorPane_badge--moderator" data-ipsTooltip title="{lang="member_is_moderator" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->joinedRecently()}} <span class="cAuthorPane_badge_online cAuthorPane_badge--new" data-ipsTooltip title="{lang="member_is_new_badge" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->member_id}} <span class="cAuthorPane_badge cAuthorPane_badge--member" data-ipsTooltip title="{$comment->author()->name} ist online"></span> {{endif}} {{else}} {{if $comment->author()->member_id === 2}} <span class="cAuthorPane_badge cAuthorPane_badge--v0rt3x" data-ipsTooltip title="Bin grad nicht da..."></span> {{elseif $comment->author()->modShowBadge()}} <span class="cAuthorPane_badge cAuthorPane_badge--moderator" data-ipsTooltip title="{lang="member_is_moderator" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->joinedRecently()}} <span class="cAuthorPane_badge cAuthorPane_badge--new" data-ipsTooltip title="{lang="member_is_new_badge" sprintf="$comment->author()->name"}"></span> {{elseif $comment->author()->member_id}} <span class="cAuthorPane_badge cAuthorPane_badge--member" data-ipsTooltip title="{$comment->author()->name} ist offline"></span> {{endif}} {{endif}} Beachtet wenn ihr diesen Code erweitert die Reihenfolge. Das neue Icon ist aus dem Grund ganz unten, weil es nur bei den Mitgliedern angezeigt werden soll, die 1. nicht ich, 2. kein Mod und 3. nicht neu im Forum sind Wenn euch diese Spielereien gefallen haben, solltet ihr mal einen Blick auf DIESEN Artikel werfen, da ist durchaus noch mehr möglich Wir hoffen euch hat dieses Tutorial gefallen. Bei Fragen benutzt bitte das Supportforum, wir helfen euch gerne weiter.

In diesem Tutorial geht es darum die Darstellung der Benutzernamen anhand ihrer Gruppen zu stylen, so ähnlich wie hier auf dieser Seite auch und etwas komplexer. Von Haus aus werden alle Benutzergruppen schlicht schwarz dargestellt, was nicht nur sterbenslangweilig aussieht, man erkennt so auch nicht so schnell zu welcher Benutzergruppe ein Mitglied gehört, siehe hier... IPS macht es einem da von Haus aus schon ziemlich einfach das zu ändern, begebt euch dafür im AdminCP auf Benutzer -> Gruppen und wählt die Gruppe aus, die ihr bearbeiten wollt. Unter Gruppenformatierung könnt ihr entweder ganz simpel mit einem Colorpicker arbeiten, oder direkt HTML benutzen. So kann man ganz einfach nicht nur die Farbe ändern, sondern auch Fett- und/oder Kursivschrift benutzen usw. Das schafft schonmal ein bisschen mehr Übersicht zwischen den Gruppen und ihren Mitgliedern, sieht aber fast noch genauso langweilig aus. Deshalb kommt nun ein bisschen CSS mit ins Spiel. Fangen wir mal mit dem Code an, der hier gerade verwendet wird: Hier nochmal zum rauskopieren, nicht vergessen im zweiten Feld mit einem weiteren span zu schliessen. <span style='color:white; background:#185886; font-weight: bold; padding: 1.7px 6px; border-radius: 3px; text-shadow: #000 2px 2px 4px ; display: inline-block;'> Ich habe mich dabei ein bisschen an den Mentions orientiert, die IPS benutzt, wenn ihr User mit @ direkt anschreibt. Hier noch einmal die Werte im Detail, damit ihr seht wie das zusammengesetzt ist und wie ihr die Farben ändern könnt: color:white; background:#185886; font-weight: bold; padding: 1.7px 6px; border-radius: 3px; text-shadow: #000 2px 2px 4px ; display: inline-block; Da die Basics von CSS zu erklären den Rahmen dieses Tutorials sprengen würde, verweise ich an dieser Stelle auf Seiten wie SELFHTML, da wird eigentlich alles sehr Einsteigerfreundlich erklärt. Okay, weiter geht's. Das sieht ja soweit schonmal viel besser aus, zumindest auf einem hellen Hintergrund. Deshalb geht es jetzt etwas mehr ans Eingemachte und wir verpassen jedem Style seine eigene Formatierung. Anstelle euren Code direkt in den Gruppeneinstellungen zu hinterlegen, setzen wir dort nun eine Art "Platzhalter" ein, nämlich <span id='administrators'> für in diesem Fall die Admin-Gruppe (wieder nicht vergessen zu schliessen!). Nun begebt euch nach Anpassung -> Designs und klickt beim Style eurer Wahl auf den Buttom um HTML/CSS zu editieren (</>). Dort sollte nach einem Klick auf den Reiter CSS das Template custom.css leicht zu finden sein. Dies ist speziell für eure individuellen Anpassungen vorgesehen und wird bei Updates des Styles bzw. der Basissoftware nicht überschrieben. Per default enthält es nur eine kleine Anmerkung, die kann weg und gegen euren Code ersetzt werden... Hier noch einmal direkt zum kopieren. Wie ihr seht ist es eigentlich genau der gleiche Code wie oben, mit dem Unterschied, dass er via #administrators eurem "Platzhalter" zugeordnet ist. Nach diesem Prinzip könnt ihr nun für jede Benutzergruppe und jeden Style vorgehen. #administrators { color:white; background:#185886; font-weight: bold; padding: 1.7px 6px; border-radius: 3px; text-shadow: #000 2px 2px 4px ; display: inline-block; } Aber es geht auch noch besser, schaut mal hier... Das funktioniert im Grossen und Ganzen genauso wie oben, nur das ein paar komplexere Formatierungen verwendet werden und zusätzlich ein Font Awesome Icon mit eingebunden ist (-> before). Hier der Code zum Nachbasteln, ich wünsche viel Spass dabei... #administrators { font-family:'Verdana'; border: 1px solid transparent; border-radius: 2px; border-left: 1px solid rgba(0, 0, 0, 0.2); margin-top: 3px; text-align: center; font-weight: 400; font-style: normal; height: 20px; line-height: 15px; position: relative; max-width: 180px; padding: 2px 15px 2px 30px; user-select: none; color: #FFFFFF; font-size: 12px; font-weight: normal; text-shadow: 2px 2px 5px black; background: dodgerblue; border-color: dodgerblue; box-shadow: 0 0 3px dodgerblue, inset 0 0 3px black; } #administrators:before { content: "\f0e7"; font-family:FontAwesome; background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0; position: absolute; top: 0; bottom: 0; left: 0; padding: 2px 4px 0px 4px; min-width: 15px; font-size: 100%; text-align: center; } So lassen sich im übrigen auch Effekte wie Username Glow und Sparklings implementieren. Wie das funktioniert hatte ich früher schon einmal in einem Tutorial für XenForo erklärt, diese Codes könnt ihr so ziemlich 1 zu 1 übernehmen. Ich hoffe euch hat diese Anleitung gefallen, ich habe wie immer versucht, es so Einsteigerfreundlich wie möglich zu gestalten. Falls ihr Fragen habt, stellt diese bitte im Supportbereich, nicht in den Reviews.

In diesem kleinen Tutorial zeigen wir euch in Schritt 1, wie man die Einträge in der Navigationsleiste mit Font Awesome Icons verzieren und in Schritt 2 die Statusicons der einzelnen Foren austauschen kann. Das ist eigentlich ganz einfach, Invision Community unterstützt FA von Haus aus und eine Auflistung der zum jetzigen Zeitpunkt unterstützten Icons findet ihr HIER. Wenn ihr etwas gefunden gefunden habt das ihr benutzen wollt, klickt darauf und notiert euch in der Detailansicht den Unicode ... Als nächstes begebt ihr euch im AdminCP zur Liste der installierten Themes und klickt auf das </> Symbol bei dem Theme, in dem ihr die Icons verwenden wollt. Danach klickt auf den Reiter CSS und sucht das Template custom.css, in dem bei einem unbearbeiteten Theme für gewöhnlich nur ein Platzhalter zu sehen sein sollte. Um FA in der Navigation zu nutzen, muss es für diese Position erst einmal getriggert werden. Dafür ist dieser Codeschnippsel zuständig, den ihr in das leere Template kopiert ... .ipsNavBar_primary li > a:before { font-family: "FontAwesome"; line-height: 1; font-weight: normal; } OK, nun wissen wir woher wir die Icons bekommen und wo wir sie einfügen müssen. Jetzt müssen wir dem Theme nur noch mitteilen, an welcher Stelle es was für ein Icon anzeigen soll. Begebt euch dafür zurück ins Frontend, macht einen Rechtsklick auf das Element, dem ihr ein Icon zuweisen wollt und wählt im Kontextmenü den Punkt Untersuchen aus, worauf euer Browser euch etwas in dieser Art präsentieren wird ... Das was uns interessiert ist in diesem Fall die ID 21. Kopiert jetzt einmal folgendes in euer Template, speichert es ab und aktualisiert eure Seite ... .ipsNavBar_primary li[id="elNavSecondary_21"] > a:before{content:"\f198"} /* Slack */ Nun sollte das Element mit der ID 21 das FA-Icon mit dem Unicode f198 assoziieren, in diesem Fall also "Slack". Genauso verfahrt ihr für alle anderen Elemente in der oberen Navigationsleiste. Bei der Subnavigation geht das genauso, nur der Code ist ein klein bisschen anders ... .ipsNavBar_secondary li[id="elNavSecondary_10"] > a:before{content:"\f086"} /* Comments */ Kommen wir nun zu Schritt 2, in dem wir uns den Statusicons der Foren widmen. Deren IDs könnt ihr genauso mit einem Rechtsklick herausfinden, wie die der Elemente in der Navigation. Der Code um ein Forenicon auszutauschen ist bloss ein bisschen länger und sieht folgendermassen aus ... .ipsDataItem[data-forumid='2'] .ipsItemStatus.ipsItemStatus_large .fa-comments::before, .ipsItemStatus:not( .ipsItemStatus_large ) .fa-comments::before { content: "\f198"; } Dem Forum mit der ID Nummer 2 wird das Icon mit dem Unicode f198 zugeordnet, das wars eigentlich auch schon. Wenn ihr fertig seid, könnte das so in der Art aussehen ... Wir hoffen euch hat diese kleine Anleitung gefallen. Bei Fragen benutzt bitte das Supportforum, wir helfen euch gerne weiter

Ihr kennt das ja, von Zeit zu Zeit braucht man zusätzliche Seiten, sei es für rechtliches Blabla oder andere Sachen, die in einem Thread einfach nicht so gut passen würden. Sollte die Anschaffung der Pages-Application keine Option sein, dann könnt ihr auch mit geringen HTML-Kenntnissen optisch ansprechende Seiten kreieren. Als erstes legt ihr dafür via FTP in dem Verzeichnis in dem sich eure Invision Community befindet eine neue Datei namens meineseite.php an. Dort kopiert ihr folgenden Inhalt hinein... <?php require_once('init.php'); \IPS\Dispatcher\External::i(); $html = 'Lorem ipsum ...'; \IPS\Output::i()->sendOutput( \IPS\Theme::i()->getTemplate('global', 'core')->globalTemplate('Supertolle Seite', $html)); Im grossen und ganzen wars das jetzt auch eigentlich schon. Das Lorem ipsum ersetzt ihr durch euren Inhalt im puren Text- oder HTML-Format und Supertolle Seite mit dem, was nachher auf dem Tab des Browsers stehen soll. Um die Seite in der Navigation zu verlinken, benutzt einfach den systemeigenen Menu Manager. Was die Formatierung der Inhalte angeht können wir euch an dieser Stelle leider nicht weiterhelfen, das würde den Rahmen dieses kleinen Tutorials sprengen. Schaut stattdessen einfach bei SELFHTML vorbei, dort werdet ihr alles finden, was ihr wissen müsst. Solltet ihr trotzdem noch Fragen haben, benutzt bitte das Supportforum, nicht die Reviewfunktion.

Invision Community geht in vielerlei Hinsicht seinen eigenen Weg... und das ist auch gut so. Nur kann das Umsteiger von anderen Forensystemen manchmal schon ein bisschen verwirren. Beispielsweise dieser Punkt, ihr werdet es wahrscheinlich gewohnt sein automatisch einen Button in der Navigation zu haben, der euch alle registrierten Benutzer auf einer eigenen Seite anzeigt. Dazu sei erstmal einmal gesagt, Invision ist viel mehr als "nur ein Forum". Ihr könnt es auch als CMS oder für Ecommerce nutzen, ohne das eigentliche Forum-Modul überhaupt kaufen zu müssen und wenn ihr so eine Seite betreibt ist eine Mitgliederliste in der Regel eher überflüssig. Existieren tut sie allerdings schon, ihr müsst den Menüpunkt nur selbst anlegen und das funktioniert folgendermassen... Schritt 1: Liste erstellen Klick dazu im Header einmal auf das Icon mit der Lupe um die erweiterte Suche zu öffnen. Dort findet ihr zwei Reiter mit denen ihr auswählen könnt, was genau ihr durchsuchen wollt, nämlich die Inhalte oder die Benutzer. Nachdem ihr Benutzersuche angeklickt habt, stehen euch erst einmal ein paar Filter zur Verfügung... Jetzt stellen wir uns unsere ganz eigene Mitgliederliste zusammen, es ist eigentlich ganz einfach: Wenn ihr wirklich alle registrierten Benutzer auf einen Blick haben wollt, könnt ihr diese Einstellungen so beibehalten. Ihr könnt allerdings auch via Benutzer seit nur die neuesten User anzeigen, oder nur angehörige einer bzw. mehrerer Benutzergruppe/n. Hierbei ist allerdings auch der Punkt "Filtern nach dieser Gruppe erlauben?" im AdminCP zu beachten... Nun klickt ihr einfach auf den Button Benutzer Suchen und schon habt ihr eure Mitgliederliste 😉 Schritt 2: Button erstellen Kommen wir nun zum zweiten Schritt, ihr wollt natürlich auch einen Eintrag in der Navigationsleiste haben um direkt dorthin zu kommen. Dazu begebt ihr euch im AdminCP unter System in den Menü-Manager und klickt auf Menüpunkt hinzufügen. Dort wählt ihr nun Externer Link, gebt eurem Button einen Namen und bei URL kopiert ihr aus dem Browser genau den Link der Seite die ihr in Schritt 1 erstellt habt hinein. Jetzt könnt ihr noch ein einstellen wer den Navigationseintrag (nicht die Seite!) sehen darf, klickt auf speichern und das wars auch fast schon. Den neuen Eintrag könnt ihr jetzt noch noch per Drag & Drop dorthin schieben, wo er später angezeigt werden soll, ihr dürft nur nicht vergessen auf Dieses Menü veröffentlichen zu klicken, sonst werden eure Einstellungen nicht gespeichert. Abschliessend bleibt nur noch zu erwähnen, dass es im Marketplace mindestens zwei Applications für Mitgliederlisten gibt, die euch die Arbeit abnehmen und ein paar zusätzliche Features bieten. Mit denen könnt ihr beispielsweise das Layout ändern, oder ein paar weitere Informationen zu den Benutzern in der Liste anzeigen. Diese bewegen sich dafür aber auch preislich im Bereich 10-15 USD, wenn ich mich recht entsinne 😉 Wenn ihr Fragen zu diesem Tutorial haben solltet, benutzt bitte das Supportforum und nicht die Reviewfunktion, ich suche euch dort auf Wunsch auch gerne die Links zu diesen Applications raus. Ansonsten wünsche ich viel Spass beim nachbasteln.

Ein sehr cooles Feature in Pages ist ja, dass man seinen Seiten ein bestimmtes Theme zuweisen kann, ähnlich wie bei Foren/Unterforen auch. Bei Anwendungen geht das ja nicht immer von Haus aus, deshalb zeigen wir euch hier wie ihr das ganz einfach selber machen könnt ... Das geht einmal über die Application.php der jeweiligen Anwendung. Öffnet die Datei auf eurem Server und sucht nach ... public function init() { Darunter fügt ihr ganz einfach diese Zeile ein, wobei das x für die ID des Themes steht ... \IPS\Theme::switchTheme(x); Solltet ihr aus irgendeinem Grund keinen Zugriff auf das File haben, oder die Datei verschlüsselt sein (Hallo ipsProArcade!), dann könnt ihr den Code auch direkt in das globalTemplate eurer Themes einfügen und zwar direkt unter ... <html lang="{expression="\IPS\Member::loggedIn()->language()->bcp47()"}" dir="{{if member.language()->isrtl}}rtl{{else}}ltr{{endif}}"> Das sieht dann folgendermassen aus ... {{if \IPS\Request::i()->app == "appname"}} {expression="\IPS\Theme::switchTheme(x)"} {{endif}} Anstelle von "appname" nehmt ihr natürlich "arcade", "movies", "links" oder was auch immer. Das wars auch schon, vielleicht könnt ihr's ja gebrauchen. Bei Fragen benutzt bitte das Supportforum, wir helfen euch gerne weiter.

Wenn man der Übersicht halber mit sehr vielen Kategorien arbeitet ist der Nachteil dabei, dass der Categoryblock dementsprechend gewaltig ausfallen kann. Mit ein bisschen CSS und JS sieht das zum Beispiel so aus... Tauscht dafür einfach das komplette Template arcade -> front -> category -> categoryBlock hiermit aus, das wars: <table style="width:100%; border:0px; border-spacing:2px; padding:0px;"> <tr> <td style="text-align:center; width:100%;"> <div class='ipsButton ipsButton_normal ipsButton_small ipsResponsive_inlineBlock'> <ipsButton_normal id="categoryButton">{lang="arcade_categories"}</ipsButton_normal> </div> </td> </tr> </table> <div id="modalCategories" class="modal"> <div class="modal-content"> <div style='text-align:center;'><h4 class='ipsAreaBackground_dark ipsType_sectionTitle ipsType_reset cForumTitle'><strong>{lang="arcade_categories"} <div class="ipsPos_left"><span class="close">&times;</span></div> {{if $refresh}}<div class="ipsPos_right"><a href="{url="ipsproarcade"}" data-ipsTooltip title="{lang="reset_category_selection"}"><i class="fa fa-refresh"></i></a></div> {{endif}} </strong></h4> </div> <div class='ipsAreaBackground'><table style='border-spacing:1px; width:100%;'> <tr> {{if \count($categories)}} {{$cnt = 0;}} {{foreach $categories as $cat}} {{if ( $catsPerRow ) && ( $cnt % $catsPerRow == 0 ) && ( $cnt != 0 )}} </tr><tr> {{$cnt = 0;}} {{endif}} <td style="text-align:center; width:10%; border:1px solid;"> <a data-ipshover="" data-ipshover-target="{url="app=arcade&module=arcade&controller=category&cat={$cat->c_id}" base="front" seoTemplate="arcade_category"}" data-ipsHover-width='800' href="{$url}{$cat->c_id}"}" data-ipsTooltip title="{$cat->cat_bare_name}"> {{if $cat->cat_img != ''}} <img src="{url="applications/arcade/interface/cat_imgs/{$cat->cat_img}" base="none"}" class="arcadePhoto arcadePhoto_small" alt="{$cat->cat_bare_name}"><br/> {{endif}} {{if $currentCat == $cat->c_id}}<strong>{{endif}}{$cat->cat_name|raw} <br />({number='$cat->num_of_games'}){{if $currentCat == $cat->c_id}}</strong>{{endif}}<br /></a> </td> {{$cnt++;}} {{endforeach}} {{if $cnt < $catsPerRow}} {{for $x = $cnt; $x < $catsPerRow; $x++}} <td style="text-align:center; width:10%; border:1px solid;"></td> {{endfor}} {{endif}} {{else}} {lang="arcade_no_categories_for_you"} {{endif}} </tr> </table> </div> </div> </div> <style> .modal { display: none; position: fixed; z-index: 999; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.4); } .modal-content { position: relative; background-color: #2E2E2E; color: #a6a6a6; margin: auto; padding: 0; border: 1px solid #424242; width: 50%; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name: animatetop; -webkit-animation-duration: 0.4s; animation-name: animatetop; animation-duration: 0.4s } @media screen and (max-width:979px){ .modal-content { width: 80%; } } @-webkit-keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1} } @keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1} } .close { color: #a6a6a6; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; } .modal-body {padding: 2px 16px;} </style> <script> var modal = document.getElementById("modalCategories"); var btn = document.getElementById("categoryButton"); var span = document.getElementsByClassName("close")[0]; btn.onclick = function() { modal.style.display = "block"; } span.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script>

Wie in der Einleitung bereits erwähnt, könnt ihr dieses sehr nützliche Plugin leider nur über oder unter der Übersicht der Foren anzeigen lassen. Wenn ihr Pages euer eigen nennt, könnt ihr daraus allerdings einen Block erstellen, den ihr via Drag & Drop positionieren könnt, wo ihr möchtet. Dafür begebt ihr euch ins AdminCP -> Seiten -> Blöcke -> Neuen Block erstellen. Der Typ ist Benutzerdefiniert und bei Editor nehmt ihr Manuelles HTML. Das sieht dann ungefähr so aus ... Als Name habe ich Neue Beiträge genommen und als Schlüssel recent_topics, was ihr da eintragt ist aber eigentlich völlig egal. Wichtiger ist der andere Reiter, wo ihr als Inhalt folgenden Code verwendet (nicht in den Cache übernehmen) ... {{$table = \IPS\forums\Topic::plugin_getRecentTopics();}} {{$spacer = \IPS\Settings::i()->recentTopicsPosition == 'above' ? 'ipsSpacer_bottom' : 'ipsSpacer_top';}} <div class="ipsBox {$spacer} {{if settings.recentTopicsHidePhone}}ipsResponsive_hidePhone{{endif}} {{if settings.recentTopicsHideTablet}}ipsResponsive_hideTablet{{endif}}" data-controller="plugins.recentTopics" data-recenttopics-interval="{setting="recentTopicsInterval"}" data-recenttopics-showloading="{setting="recentTopicsShowLoading"}"> {$table|raw} </div> Das ist übrigens nichts anderes als das Haupt-Template des Plugins Euer neuer Block steht euch nun im Block-Manager zur Verfügung, die Einstellungen werden wie gewohnt global im AdminCP unter Plugins vorgenommen.