sidebarMod
Voici mon script pour modifier la barre latérale (mentionné pour la première fois dans le sujet des sections personnalisées de la barre latérale).
Il utilise des promesses et MutationObserver pour surveiller les changements dans la barre latérale (par exemple, lors de l’expansion ou de la réduction) et ajouter/supprimer des éléments de manière performante.
Je pense l’avoir rendu suffisamment flexible pour la plupart des cas d’utilisation. Vous pouvez ajouter des liens (positionnés en ajoutant, en préfixant ou en insérant avant/après des liens existants), supprimer des sections, supprimer des liens et même supprimer ⋮Plus.
Il est même possible de changer le comportement si le spectateur est un invité ou un utilisateur enregistré. Par exemple, je l’utilise pour supprimer une section personnalisée qui est non pertinente pour les invités.
C’est un bon complément à la nouvelle fonctionnalité de sections personnalisées de la barre latérale (activée via SiteSetting.enable_custom_sidebar_sections), donc je n’ai pas pris la peine d’ajouter une fonctionnalité pour créer des sections.
Faites-moi savoir si vous trouvez des bugs ou si vous avez besoin de fonctionnalités supplémentaires.
Installation
Créez un nouveau composant de thème et collez-le dans Head. N’oubliez pas de l’activer pour votre thème.
Configuration
Vous n’avez qu’à modifier injections et removals près du début.
Je suggère de le laisser tel quel au début pour que vous puissiez voir ce qu’il fait. J’ai essayé de rendre la configuration d’exemple illustrative.
Je l’utilise personnellement comme ceci :
/**
* Positionneurs de liens :
* (bool) prepend, append : ajoute un lien au début/à la fin de la section
* (str) addBeforeKebab, addAfterKebab : ajoute un lien avant/après un lien existant
* Visibilité des liens :
* (str) injectFor : injecte le lien uniquement pour les utilisateurs 'anon', uniquement pour les utilisateurs 'registered', ou pour les 'deux' (par défaut : 'deux')
*/
injections: [
{ sectionSelector: '.sidebar-section[data-section-name="community"]',
links: [
{ text: 'Guidelines', kebab: 'guidelines', title: 'Guidelines for using this site', href: '/guidelines', icon: 'gavel', addBeforeKebab: 'faq', injectFor: 'registered' }
]
},
{ sectionSelector: '.sidebar-section[data-section-name="categories"]',
links: [
{ text: 'Site Map', kebab: 'site-map', title: 'Site Map', href: '/t/32', icon: 'map-marker-alt', prepend: true }
]
}
],
/**
* Options de section :
* (str) removeFor : supprime la section uniquement pour les utilisateurs 'anon', uniquement pour les utilisateurs 'registered', ou pour les 'deux' (par défaut : 'none')
* (str) removeMore : supprime '⋮Plus' uniquement pour les utilisateurs 'anon', uniquement pour les utilisateurs 'registered', ou pour les 'deux' (par défaut : 'none')
* utile si vous savez qu'elle est vide en raison de la suppression de liens
* Options de suppression de liens :
* (str) removeFor : supprime le lien uniquement pour les utilisateurs 'anon', uniquement pour les utilisateurs 'registered', ou pour les 'deux' (par défaut : 'deux')
*/
removals: [
{ sectionSelector: '.sidebar-section[data-section-name="community"]',
links: [{ kebab: 'badges', removeFor: 'anon' }]
},
{ sectionSelector: '.sidebar-custom-sections .sidebar-section[data-section-name="my-topics"]',
removeFor: 'anon'
}
],
Questions de ma part
J’ai étudié la possibilité de faire cela avec l’API, mais je ne pense pas que suffisamment de choses soient implémentées.
Si je voulais faire cela “de la bonne manière” au lieu de pirater le DOM, comment le ferais-je ? Aurais-je besoin de créer un plugin avec Ruby ? Toute aide serait appréciée.