Thème Fakebook

[Don]

Bonjour Jordan,

Des erreurs surviennent lorsqu’un nouvel utilisateur s’inscrit. La barre latérale droite n’affiche aucune information, à part le texte de bienvenue et le sous-titre, mais sans le nom. Je sais qu’elle affiche les « likes » s’il y en a, ainsi que les badges. Est-il possible de corriger cette barre latérale pour qu’elle affiche les « likes » et les badges ? Je veux dire : 0 admis, 0 donnés et aucun badge. Vous n’avez pas encore de badges… Découvrez comment en obtenir… ou quelque chose de similaire. Donc, un texte ou un lien si aucun badge n’est encore disponible.

Merci !

Le code d’erreur concerne les badges :

[haffax7]

Je souhaiterais le modifier comme ci-dessous.
Cependant, cela ne fonctionne pas sur l’écran mobile.
Pourriez-vous m’aider à savoir quoi faire ?

Je souhaite rendre le lien fonctionnel pour l’extrait du sujet et l’image.

{{~raw-plugin-outlet name="topic-list-after-title"}}
{{#unless topic.image_url}}
  {{#if topic.hasExcerpt}}
    <a href="{{topic.lastUnreadUrl}}" class="topic-excerpt-link">
      <div class="topic-excerpt-box">
        {{raw "list/topic-excerpt" topic=topic}}
      </div>
    </a>
  {{/if}}
{{/unless}}
{{#if topic.image_url}}
<a href="{{topic.lastUnreadUrl}}" class="topic-excerpt-link">
<div class="topic-image">
  <img src="{{topic.image_url}}" />
</div>
</a>
{{/if}}

Voici le site que je teste.
https://today16.com/

[Don]

Utilisez ceci dans l’en-tête mobile
<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'> . . . </script>

[Eduardo_Braga (Eduardo)]

iPhone 6S

[jordan.vidrine]

Je teste cela sur le simulateur Xcode avec un iPhone 6S et je ne rencontre pas ce problème.

J’ai quelques questions :

Cette capture d’écran provient-elle de votre utilisation de meta.discourse.org ?
Quelle version d’iOS utilisez-vous ?
Quel navigateur web ?

Merci

[chratec (VT)]

Quelqu’un a-t-il essayé de lire une courte vidéo téléchargée directement sur Discourse avec le thème Facebook sur un iPhone ?

Ai-je manqué quelque chose dans la configuration, mais je ne peux pas lire les vidéos téléchargées sur le téléphone. Cela fonctionne bien sur ordinateur.

Toute vidéo intégrée provenant de YouTube fonctionne.

C’est pourquoi je ne sais pas ce qui se passe, aucune erreur, aucun avertissement.

Alors, s’il vous plaît, donnez-moi des conseils.

[Don]

Oui, cela fonctionne parfaitement pour moi sur n’importe quel appareil. Je pense qu’un thème est peu susceptible de causer ce problème.
Avez-vous essayé de jouer en mode sans échec ?
Pourriez-vous poster le sujet où se trouve la vidéo afin que nous puissions le vérifier ?

[chratec (VT)]

Bonjour @Don,
Oui, vous devriez essayer via le lien ci-dessous :
Making sure you're not a bot!

Je l’ai testé et je confirme qu’il ne fonctionne pas sur mon iOS 11.

[Don]

iOS 11 est assez obsolète, ce qui cause le problème. Je peux lire la vidéo sans aucun souci sur iOS 14, et cela fonctionne très bien.

[chratec (VT)]

@Don Pris en note,

Merci

[SrhKnpp (Sarah L Knapp)]

C’est fantastique !

D’ailleurs… est-il possible d’ajouter un lien dans la zone d’introduction de la barre latérale ?

[Eduardo_Braga (Eduardo)]

Où se trouve le lien pour ajouter le thème ?

[JacobDK]

GitHub - discourse/fakebook-modern

[hyd504]

Salut ! Je suis en train d’apprendre le développement de thèmes et de plugins pour Discourse. J’apprécie vraiment le thème Fakebook et je l’utilise pour consolider mes connaissances, mais j’ai quelques questions.

Le fichier “javascripts/discourse/templates/mobile/list/topic-list-item.hbr” contient un code en double à 100 % par rapport au fichier “common/header.html”.

Mes questions :

1. N’existe-t-il pas un moyen d’inclure un fichier hbr dans un fichier HTML, afin de pouvoir simplement inclure topic-list-item.hbr dans common/header.html au lieu de dupliquer le code à deux endroits ?
2. Pourquoi avons-nous besoin de topic-list-item.hbr dès le départ ? Les fichiers du dossier common ne devraient-ils pas s’appliquer à la fois aux versions bureau et mobile ?

[awesomerobot (Kris)]

@hyd504

N’existe-t-il pas un moyen d’inclure un fichier hbr dans un fichier HTML afin que nous puissions simplement inclure topic-list-item.hbr dans common/header.html au lieu de dupliquer le code à deux endroits ?

Je ne le pense pas… Normalement, je pourrais créer un composant qui utilise un seul modèle, puis l’inclure pour le composant dans les deux surcharges… mais nos éléments de liste de sujets sont un type spécial de modèle conçu pour la performance (hbr = modèle raw Handlebars), et les modèles raw ne peuvent pas utiliser de composants. (Certaines discussions précédentes sur Mounting widget in raw template? - #7 by angus)

@hyd504

Pourquoi avons-nous besoin de topic-list-item.hbr dès le départ ? Les fichiers du dossier common ne devraient-ils pas s’appliquer à la fois au bureau et au mobile ?

C’est ainsi que le CSS de Discourse est structuré (ainsi que certains fichiers HTML spéciaux pour les thèmes comme en-tête/pied de page, etc.), mais dans le répertoire javascripts/discourse/templates, ces modèles sont des surcharges directes des modèles par défaut de Discourse (lorsqu’il n’y a pas de surcharge, les modèles par défaut sont utilisés).

Dans Discourse, il existe deux modèles : /templates/list/topic-list-item.hbr et /templates/mobile/list/topic-list-item.hbr. Donc, comme il y a deux modèles, nous avons besoin de deux surcharges.

Peut-être existe-t-il un moyen simple de pointer le mobile vers le modèle non mobile en JS… mais s’il existe, je n’en ai pas connaissance !

[awesomerobot (Kris)]

J’ai parlé trop vite ! J’ai jeté un coup d’œil et j’ai en fait résolu ce problème peu de temps après avoir publié ma réponse ci-dessus. Parfois, écrire les choses peut produire cet effet.

J’ai apporté une mise à jour pour n’avoir qu’un seul modèle… par défaut, dans topic-list-item.js, nous avons un code qui ressemble à ceci :

  renderTopicListItem() {
    const template = findRawTemplate("list/topic-list-item");
    if (template) {
      this.set("topicListItemContents", template(this).htmlSafe());
    }
  },

Donc, si je surcharge const template dans le thème…

  renderTopicListItem() {
    const template = findRawTemplate("list/custom-topic-list-item");
    if (template) {
      this.set("topicListItemContents", template(this).htmlSafe());
    }
  },

Cela pointe maintenant vers un modèle distinct et, comme il n’existe pas de contrepartie mobile portant le même nom… il est également utilisé pour mobile. Merci d’avoir inspiré ce changement avec votre question @hyd504 !

[Don]

C’est vraiment gentil ! Je viens de changer le thème sur mon site pour Fakebook Modern Merci beaucoup !

[Mohit_Jindal]

@awesomerobot @Don

Pourriez-vous partager des liens vers quelques forums exemples où je pourrais voir ce thème en action ?

[Don]

Bonjour,

Bien sûr, vous pouvez voir le thème Fakebook dans le créateur de thèmes :

@awesomerobot

Prévisualisez-le sur le créateur de thèmes

Le mien contient relativement beaucoup de modifications, mais vous pouvez le voir ici :

Vaperina

[Mohit_Jindal]

Merci @Don.

Juste pour vérifier que l’aperçu pointe bien vers le thème GitHub - discourse/fakebook-modern · GitHub ?