# Как выбрать иконки для ссылок в пользовательском разделе

**URL:** https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219
**Category:** UX
**Tags:** sidebar
**Created:** [05.Февраль.2024 17:55:11 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219 "2024-02-05T17:55:11Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [05.Февраль.2024 17:55:11 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/1 "2024-02-05T17:55:11Z")

</div>

Продолжаем обсуждение из темы [Настройка пользовательских разделов боковой панели тестируется на meta](https://meta.discourse.org/t/custom-sidebar-sections-being-tested-on-meta/255303/34):

Я добавил персональный раздел с пользовательскими ссылками на один из форумов, которыми часто пользуюсь. Мне удобнее использовать разные иконки, а не только стандартную иконку ссылки, так как я лучше их узнаю.

Есть ли какие-то советы по выбору подходящей иконки? Я не могу прокрутить весь список, так как он где-то обрывается. Я знаю, что там можно искать, но как понять, что именно искать? — особенно если форум не на английском. Но даже на английском форуме я могу поискать «monitor» и ничего не найти, потому что нужно искать «desktop», чтобы найти нужную иконку.  
Конечно, я могу посмотреть все бесплатные иконки Font Awesome 5, но тогда мне всегда приходится проверять, доступна ли эта иконка на том форуме, и у меня сложилось впечатление, что большинство из них недоступны. Поэтому я упускаю все дополнительные иконки, которые предоставляет Discourse.

Так как же вы ожидаете, что пользователи найдут подходящую иконку? Может быть, лучше сделать что-то вроде селектора эмодзи? Там поиск тоже работает только при знании правильного английского названия, но можно найти иконку и без этого, просто прокручивая список.

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [05.Февраль.2024 20:40:12 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/2 "2024-02-05T20:40:12Z")

</div>

Я согласен; это не лучший опыт!

На мой взгляд, сейчас вы можете перейти по ссылке [Find the Perfect Icon for Your Project in Font Awesome 5 | Font Awesome](https://fontawesome.com/v5/search?o=r&m=free), а затем добавить иконку в настройку «Подмножество SVG-икон»:

 ![image](https://global.discourse-cdn.com/meta/original/4X/8/9/c/89cd09c608f46e2a0489ec5888feb069b563749d.png)

 ![image](https://global.discourse-cdn.com/meta/original/4X/3/9/c/39ce82f6a3f716336c0c81589b4ecaa2e1d2f2a4.png)

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [05.Февраль.2024 20:49:13 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/3 "2024-02-05T20:49:13Z")

</div>

> [@Arkshine](#):
>
> затем добавьте иконку в настройку «подмножество иконок svg»:

Это работает для «обычных» пользователей?

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [05.Февраль.2024 20:51:04 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/4 "2024-02-05T20:51:04Z")

</div>

К сожалению, я так не думаю. Хорошая мысль.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [05.Февраль.2024 20:56:16 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/5 "2024-02-05T20:56:16Z")

</div>

Я надеялся, что появится «выбор иконки» для этого (и для страницы значков), но пока это не нашло отклика. ☹

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [05.Февраль.2024 22:04:23 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/6 "2024-02-05T22:04:23Z")

</div>

В этом и заключается моя проблема. Я не могу просто найти лучший значок и добавить его. Мне нужно найти лучший **доступный** значок, а это зависит от того, какие значки уже добавлены на сайт.

Для администраторов имеет смысл искать среди всех значков, так как они могут выбрать лучший и добавить его. Но я не ожидаю, что обычные пользователи будут делать то же самое.

Это уже достаточно запутанно, что в Discourse есть поле поиска с надписью «поиск» на вашем языке интерфейса, но поиск не работает на этом языке, так как поле ожидает ввода названия значка на английском.

Поэтому я считаю, что #member-experience хуже, чем #staff-experience.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [06.Февраль.2024 14:54:31 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/7 "2024-02-06T14:54:31Z")

</div>

Это просто к сведению 🙂 Но я думаю, что это список всех «предзагруженных» иконок, которые можно выбрать по умолчанию:

> **Основные иконки**
>
> ```plaintext
> "address-book",
> "adjust",
> "align-left",
> "ambulance",
> "anchor",
> "angle-double-down",
> "angle-double-left",
> "angle-double-right",
> "angle-double-up",
> "angle-down",
> "angle-right",
> "angle-up",
> "archive",
> "arrow-circle-o-right",
> "arrow-down",
> "arrow-left",
> "arrow-right",
> "arrow-up",
> "arrows-alt-h",
> "arrows-alt-v",
> "asterisk",
> "at",
> "award",
> "backward",
> "ban",
> "bars",
> "bed",
> "bell",
> "bell-slash",
> "birthday-cake",
> "bold",
> "book",
> "book-reader",
> "bookmark",
> "bookmark-delete",
> "briefcase",
> "bullseye",
> "calendar-alt",
> "calendar-day",
> "caret-down",
> "caret-left",
> "caret-right",
> "caret-up",
> "certificate",
> "chart-bar",
> "chart-pie",
> "check",
> "check-circle",
> "check-square",
> "chevron-circle-down",
> "chevron-down",
> "chevron-left",
> "chevron-right",
> "chevron-up",
> "circle",
> "clipboard",
> "clock",
> "cloud-upload-alt",
> "code",
> "cog",
> "coins",
> "columns",
> "comment",
> "comment-slash",
> "comments",
> "compress",
> "copy",
> "credit-card",
> "crosshairs",
> "crown",
> "cube",
> "desktop",
> "discourse-amazon",
> "discourse-bell-exclamation",
> "discourse-bell-one",
> "discourse-bell-slash",
> "discourse-bookmark-clock",
> "discourse-compress",
> "discourse-dnd",
> "discourse-emojis",
> "discourse-expand",
> "discourse-other-tab",
> "discourse-sparkles",
> "discourse-threads",
> "download",
> "ellipsis-h",
> "ellipsis-v",
> "envelope",
> "envelope-square",
> "exchange-alt",
> "exclamation-circle",
> "exclamation-triangle",
> "external-link-alt",
> "eye",
> "fab-amazon",
> "fab-android",
> "fab-apple",
> "fab-chrome",
> "fab-discord",
> "fab-discourse",
> "fab-facebook",
> "fab-facebook-square",
> "fab-github",
> "fab-instagram",
> "fab-linkedin",
> "fab-linux",
> "fab-microsoft",
> "fab-patreon",
> "fab-twitter",
> "fab-twitter-square",
> "fab-wikipedia-w",
> "fab-windows",
> "far-bell",
> "far-bell-slash",
> "far-calendar-plus",
> "far-chart-bar",
> "far-check-square",
> "far-circle",
> "far-clipboard",
> "far-clock",
> "far-comment",
> "far-comments",
> "far-copyright",
> "far-credit-card",
> "far-dot-circle",
> "far-edit",
> "far-envelope",
> "far-eye",
> "far-eye-slash",
> "far-file-alt",
> "far-frown",
> "far-heart",
> "far-image",
> "far-list-alt",
> "far-meh",
> "far-moon",
> "far-smile",
> "far-square",
> "far-star",
> "far-sun",
> "far-thumbs-down",
> "far-thumbs-up",
> "far-trash-alt",
> "fast-backward",
> "fast-forward",
> "file",
> "file-alt",
> "file-audio",
> "file-csv",
> "file-image",
> "file-invoice",
> "file-signature",
> "file-upload",
> "file-video",
> "filter",
> "flag",
> "folder",
> "folder-open",
> "forward",
> "gavel",
> "gift",
> "globe",
> "globe-americas",
> "grip-lines",
> "group-plus",
> "group-times",
> "hand-point-right",
> "hands-helping",
> "heart",
> "history",
> "home",
> "hourglass-start",
> "id-card",
> "image",
> "images",
> "inbox",
> "info",
> "info-circle",
> "italic",
> "key",
> "keyboard",
> "language",
> "layer-group",
> "link",
> "list",
> "list-ol",
> "list-ul",
> "lock",
> "magic",
> "map-marker-alt",
> "microphone-slash",
> "minus",
> "minus-circle",
> "mobile-alt",
> "moon",
> "paint-brush",
> "palette",
> "paper-plane",
> "pause",
> "pen-fancy",
> "pencil-alt",
> "play",
> "plug",
> "plus",
> "plus-circle",
> "plus-square",
> "power-off",
> "puzzle-piece",
> "question",
> "question-circle",
> "quote-left",
> "quote-right",
> "random",
> "redo",
> "reply",
> "robot",
> "rocket",
> "save",
> "search",
> "search-minus",
> "search-plus",
> "share",
> "shield-alt",
> "sign-in-alt",
> "sign-out-alt",
> "signal",
> "sliders-h",
> "sort",
> "sort-alpha-down",
> "sort-alpha-up",
> "sort-numeric-down",
> "sort-numeric-up",
> "spell-check",
> "spinner",
> "square-full",
> "stamp",
> "star",
> "step-backward",
> "step-forward",
> "sticky-note",
> "stream",
> "sync",
> "sync-alt",
> "table",
> "tag",
> "tags",
> "tasks",
> "th",
> "thermometer-three-quarters",
> "thumbs-down",
> "thumbs-up",
> "thumbtack",
> "ticket-alt",
> "times",
> "times-circle",
> "tippy-rounded-arrow",
> "toggle-off",
> "toggle-on",
> "trash-alt",
> "undo",
> "unlink",
> "unlock",
> "unlock-alt",
> "upload",
> "user",
> "user-check",
> "user-cog",
> "user-edit",
> "user-friends",
> "user-plus",
> "user-secret",
> "user-shield",
> "user-times",
> "users",
> "wrench"
> 
> ```

Ну, теоретически по крайней мере… Я только что попытался найти одну из них, но не нашёл, так что, возможно, это не 100%. Я не скажу, какую именно, чтобы не испортить игру. 🙂

---

<div class="post-metadata">

### Author: ![Arkshine](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/arkshine/32/298682_2.png) [@Arkshine](https://meta.discourse.org/u/Arkshine)
#### Post date: [06.Февраль.2024 15:06:35 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/8 "2024-02-06T15:06:35Z")

</div>

Я думаю, что вы можете увидеть основные иконки здесь:

> <https://github.com/discourse/discourse/blob/main/lib/svg_sprite.rb#L4>

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [06.Февраль.2024 15:18:28 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/9 "2024-02-06T15:18:28Z")

</div>

Честно говоря, я думал, что копирую именно это. 🙂 Кажется, я взял не то…

---

<div class="post-metadata">

### Author: ![singi2016cn](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/singi2016cn/32/532755_2.png) [@singi2016cn](https://meta.discourse.org/u/singi2016cn)
#### Post date: [05.Март.2026 09:15:06 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/10 "2026-03-05T09:15:06Z")

</div>

Я тоже ищу лучшие иконки и уже намучился с доступными в Discourse. Очень нужен центр, где можно единообразно управлять иконками.

1. Найти все доступные в Discourse иконки.
2. Найти иконки от всех поставщиков и поддерживать их импорт в Discourse в один клик.

Мне очень нужна такая страница.

---

<div class="post-metadata">

### Author: ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)
#### Post date: [14.Август.2026 18:40:33 UTC](https://meta.discourse.org/t/how-to-choose-icons-for-links-in-custom-section/294219/11 "2026-08-14T18:40:33Z")

</div>

Благодаря изменениям в [UX: Let icon pickers search the full icon set - Pull Request #42554 - discourse/discourse - GitHub](https://github.com/discourse/discourse/pull/42554) я теперь могу прокручивать список от до \[1\]. Так что я могу видеть все доступные на форуме значки и выбрать лучший для своей боковой панели. Новый, более компактный сеточный выборщик также помогает, поскольку позволяет видеть больше значков одновременно, а выбор значка становится менее зависимым от языка, так как меньше нужно искать.

* * *

1. zoom-join-audio
