Is it just me or is anyone else have a missing youtube icon too?
#fab-youtube does not work for me
AI-generated summary
The discussion revolves around the issue of the #fab-youtube icon not working in a Discourse footer. Papararchy01 initially reported the problem, and awesomerobot suggested checking the settings. However, Papararchy01 had already modified the footer markup to include a logo, which removed the input fields for the icon.
Stephen explained that the YouTube icon needs to be specified in the backend for it to be available, as Discourse doesn’t load all FontAwesome icons by default. Bcat provided the source code for the YouTube SVG icon, which can be used in place of the existing icon.
Papararchy01 expressed gratitude to Bcat for the solution, and awesomerobot confirmed that the Facebook and Twitter icons work because they are already used elsewhere in Discourse.
Where are you trying to use it? In a setting? a theme?
I had advice from Dax because I wanted to add a logo in first-box and she helped me but I need to do it accessibly via the markup and include alt text. So I took the html and css and have created a static version of the footer that includes a logo in the mark up rather than the css. So I no longer have those input fields available.
markup looks like this-
You’re still going to need it specified in the back end for the icon to be available for use within the page. Discourse doesn’t blindly load every FontAwesome Icon, that would be really resource-heavy.
thanks Stephen, the twitter and facebook icons work though? Can you advise how I do that? Or am I better off just uploading assets and pointing at those?
<svg class="fa d-icon d-icon-fab-youtube svg-icon svg-node" id="fab-youtube" viewBox="0 0 576 512">
<path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path>
</svg>
If remove: fa d-icon d-icon-fab-youtube svg-icon svg-node you need to specify width and color:
<svg id="fab-youtube" viewBox="0 0 576 512" style="width: 20px;fill: #fff;">
<path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path>
</svg>
The Facebook and Twitter icons are already used elsewhere in Discourse, which is why they’re available.
What @Bcat posted above is the source of the YouTube SVG icon, so you can paste that in place of what you have now and it’ll work in your HTML.
thanks Bcat you rock!!
and thanks for your help too Kris!