Unterschiedliche Inhalte innerhalb eines Themas basierend auf der Gruppenzugehörigkeit des Benutzers anzeigen?

Entwickler
1

Ich arbeite im Hosting von discourse.org, daher sind Plugins in diesem Fall für mich nicht möglich. Stellen Sie sich vor, ich habe ein Thema gepostet, das jeder sehen kann.

Wenn jemand in der Gruppe „A“ ist, möchte ich, dass er diesen Inhalt sieht. Wenn NICHT, dann möchte ich, dass er diesen anderen Inhalt sieht. Und ein Teil des Themas sollte jeder sehen. Schematisch so …

Dies ist Inhalt, den jeder sieht.

{Wunschdenken: nur für Leute in Gruppe A}
Hallo, danke, dass Sie in der speziellen Gruppe sind!
{/Wunschdenken}

{Wunschdenken: nur für Leute NICHT in Gruppe A}
Hallo, wir haben eine spezielle Gruppe, der Sie beitreten können. [Mehr darüber lesen](…)
{/Wunschdenken}

Ich bin zuversichtlich (aber ich weiß nicht mehr genau, wie es geht), dass dies mit einer Theme-Komponente geschehen kann, um CSS-Klassen auf den Inhalt anzuwenden, den ich anzeigen/ausblenden möchte. Das werde ich tun, wenn dies das Beste ist, was ich herausfinden kann.

Aber CSS display: none ist schwach. Ich möchte vom DOM entfernen, was sie nicht sehen sollten. Wenn möglich serverseitig entfernt, aber ich würde mich auch mit einem browserseitigen Entfernen per JS zufrieden geben. (Das erfordert ein viel höheres Cleverness-Level, um es zu umgehen, als display: none in CSS.)

2 „Gefällt mir“
2

bump! Niemand? :~(

Warum können wir @team nicht markieren :wink:

3

Ich habe im Moment nicht viel Zeit, um mich damit zu befassen, aber diese Theme-Komponente könnte Ihnen helfen, da sie alle Gruppen des aktuellen Benutzers auflistet, ich glaube, im body-Tag. Dann könnten Sie wahrscheinlich CSS-Selektoren verwenden, um basierend darauf, ob bestimmte Gruppenklassen im body-Tag vorhanden sind, ein- oder auszublenden.

Und kombinieren Sie das mit einigen Informationen aus diesem Beitrag darüber, welche HTML-Elemente Sie im Composer verwenden können und wie Sie Composer-Text in Klassen einwickeln können, und es könnte funktionieren:

Ja, ich habe es hier gerade getestet und es sollte funktionieren, wenn Sie diese Komponente mit etwas wie diesem kombinieren:

<span data-group-a>Nur Text für Gruppe A</span>
<span data-group-b>Nur Text für Gruppe B</span>

Und dann haben Sie CSS-Selektoren, die etwas wie das tun:

span[data-group-a] {display: none;}
body.group-a span[data-group-a] {display: block;}

Oder so ähnlich…

Entschuldigung für die vielen Bearbeitungen. Habe es gerade auf einer meiner Instanzen getestet und es funktioniert.

Aber wie Sie erwähnt haben, ist das vielleicht nicht das, was Sie wollten :slight_smile: …

Das könnte mit einem Theme-JavaScript möglich sein, das etwas im head-Bereich hinzufügt, um die Elemente auszuwählen und zu entfernen. Es könnte immer noch die Spanne und das Umwickeln wie oben erfordern, aber es durch dieses entfernen.

3 „Gefällt mir“
4

Ok, ich habe gemerkt, dass ich das vielleicht auch noch brauche, also habe ich mich tiefer damit beschäftigt :slight_smile:

Dieser Code funktioniert noch nicht und ist nicht sehr schön, aber ich denke, er ist fast gut genug, um in den < /head >-Teil des Themes zu kommen, er muss nur die richtige Methode haben, um die Elemente mit JS auszuwählen:

<script type="text/discourse-plugin" version="0.8.42">

  api.decorateCookedElement(
    element => {
      var hasGroupA = document.body.classList.contains('group-a');

      const group_a_spans = element.querySelectorAll("span[data-group-a]");

      if (!group_a_spans.length) {
        return;
      }

      if (!hasGroupA) {
        group_a_spans.forEach(function (el) {
           el.innerHTML = "";
        });
      }

      },
      { id: "THEME-ID", onlyStream: true }
   );
</script>

HINWEIS: Ich glaube, es könnte schwierig sein, alle Informationen vor der Suche und ähnlichem zu verbergen. Obwohl dies besser sein mag als sie nur per CSS zu verstecken, glaube ich nicht, dass es Leute davon abhalten wird, die Informationen vollständig zu sehen.

EDIT: Habe es korrigiert, sodass die CSS-Selektoren funktionieren sollten. Wiederhole den Code für so viele Gruppen, wie du verwenden möchtest. Ändere THEME-ID in einen eindeutigen Namen. Ich denke, das sollte funktionieren :slight_smile:

Ups, diesen Teil habe ich noch nicht:

3 „Gefällt mir“
5

Ich weiß deine Bemühungen hier wirklich zu schätzen… Ich denke immer noch darüber nach und ich glaube, du hast mich auf einen gangbaren Weg gebracht. Ich habe eine Vorlagenkomponente, die ich geschrieben habe, was mich denken lässt, dass ich so etwas zum Laufen bringen könnte…

Angenommen, ich stelle mir eine Komponente „foobar“ vor. Ich könnte ein Thema schreiben und einige DIVs hinzufügen, wie zum Beispiel…

<div data-custom="foobar" data-foobar="<groupname>">
</div>

<div data-custom="foobar" data-foobar="!<groupname>">
</div>

Die Komponente löscht dann basierend auf der Gruppe des betrachtenden Benutzers das eine oder andere DIV aus dem DOM.

Das erscheint mir stärker als ein CSS display: none;, das über die DOM-Inspektionsfunktionen eines jeden Webbrowsers trivial wieder eingeschaltet werden kann. Um dies zu umgehen, müsste jemand das JavaScript ändern, das beim Laden der Seite ausgeführt wird – möglich, aber viel schwieriger.

Warum will ich das?

Damit ich Inhalte für Personen, die NICHT in der Gruppe sind, teilweise enthüllen kann. (Da die Aufnahme in die Gruppe ein kostenpflichtiges Abonnement erfordert.)

Dies ist ein wirklich cooles Thema. Dieser erste
Absatz ist wirklich interessant.

<div data-custom="foobar" data-foobar="<groupname>">
Hier ist der Rest des Inhalts.
</div>

<div data-custom="foobar" data-foobar="!<groupname>">
Hallo, entschuldige die Unterbrechung!
Hier gibt es weitere Inhalte für unsere zahlenden Mitglieder…
Möchtest du mehr darüber erfahren, wie du einer werden kannst?
</div>

Personen in der Gruppe sehen einfach das gesamte Thema. Es gibt kein Anzeichen für eine Paywall.

Personen außerhalb der Gruppe sehen den anfänglichen Teil, der nicht in einem der obigen DIVs enthalten ist, und eine Paywall.

So kann ich dies in einem völlig öffentlichen Bereich verwenden, damit die Leute sehen können, was sie erhalten, wenn sie sich anmelden, einloggen und zahlendes Mitglied werden.

6

Endlich habe ich das hier zusammengebaut, als \u003chttps://github.com/Umbrella-CAST/discourse-umbrella-groupswitchdisplay\u003e Super einfach, entfernt nur das gezielte DIV aus dem DOM, basierend darauf, ob der aktuelle Benutzer in einer Gruppe namens „foobar“ ist oder nicht über „!foobar“ in der Gruppe ist. Das erlaubt mir eine einfache Umschaltung der Anzeige von Inhalten, wie im Bild unten gezeigt.\n\nNatürlich, wenn die Komponente deaktiviert ist, dann werden alle Inhalte angezeigt (da ohne Komponente das DOM nicht beschnitten wird.) Aber das ist gut genug für das, was ich tun möchte.\n\n

Screen Shot 2022-10-21 at 14.45.00
Screen Shot 2022-10-21 at 14.45.001920×1351 224 KB

4 „Gefällt mir“
7

Sie haben mir eine sehr ähnliche Kopfschmerzursache behoben.

1 „Gefällt mir“
8

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.