More obvious voting and solution marking for question threads

More obvious voting and solution marking for question threads 2022-02-26

Vous n'avez pas l'autorisation de télécharger
Compatibilité XF
  1. 2.2.x
Description courte
Enhance your question thread posts with simple template edits for better visibility. Add "vote" and "mark as solution" prompts, adjust opacity for thumbs up/down icons, and customize styling using extra.less for a seamless user experience.

Why do this?​


Users often don't realise that question thread posts can by voted on, or that OP can mark as solution.

These simple template edits make it more obvious.
Instead of:
Screenshot 2022-02-23 at 12.52.00.webp

It will be this:
Screenshot 2022-02-23 at 12.51.12.webp


Two simple template edits:​


In the template app_content_vote.less:​


  • Search for @xf-fontSizeLargest and replace with @xf-fontSizeLarge
  • Search for .m-faBefore(@fa-var-angle-up); and replace with .m-faBefore(@fa-var-thumbs-up);
  • Search for .m-faBefore(@fa-var-angle-down); and replace with .m-faBefore(@fa-var-thumbs-down);
You should now have thumbs up and down. But they are a bit faint so

  • Search for opacity: 0.2; and change to something like opacity: 0.7;

Text prompts: in the template post_question_macros:​



(1) Search for <div class="message-column"> and replace with
Code:
<div class="message-column">
                <xf:comment>add the word "vote"</xf:comment><span style="color:gray;text-align:center;font-size:11px">Vote:</span>
(style to suit)

(2) Search for <span class="u-srOnly">{{ $post.is_question_solution ? $isSolutionText : $makeSolutionText }}</span>and replace with
Code:
Code:
<span class="u-srOnly">{{ $post.is_question_solution ? $isSolutionText : $makeSolutionText }}</span>
                            <xf:comment>add the phrase mark as solution </xf:comment>
                           <span style="color:gray;text-align:center;font-size:11px">({{ $post.is_question_solution ? $isSolutionText : $makeSolutionText}})</span>

NB: if you unmark as solution, the text does not actually change until you refresh the page.

For more dynamic control of styling use a class and define in extra.less

NB:be careful not to erase the closing </a> or you will be sorry.
Auteur
axtona
Vues
633
Première publication
Dernière mise à jour
Évaluations 0.00 étoile(s) 0 évaluations
Lien cassé ? Envoyer un message à l’équipe NP et nous vous aiderons rapidement !
Soutenez le développeur Si vous êtes satisfait du test ou que votre projet vous a rapporté de l’argent, cliquez sur le bouton « Plus d’informations » pour soutenir le développeur en achetant.

Plus de ressources de axtona

Sorcier Pro A
Sorcier Pro 13.1.1
Insérer du code PHP et tout type de code HTML, CSS et JavaScript dans votre contenu !
Nettoyeur de Cache PRO A
Nettoyage Critique peut également nettoyer automatiquement le cache de Joomla! lorsque vous sauvegardez un article ou d'autres éléments.
Auto Fermeture + Notice de Filée A
Notice de Fermeture Automatique du Fil aide à garder les discussions plus anciennes organisées sans surprendre vos membres.
Retour
Haut