I’m trying to code a custom toolbar panel, but I can’t get an SVG to display
on the toolbar button. I’ve tried everything I can think of, comparing with
add-ons where they do work, but I just can’t get my SVG to display. I did get
it to work briefly before SU5, but since then. no. It loads and displays fine
in every other editor/viewer I’ve tried, just not in the toolbar. Can anyone
tell me how to get this to work? I’ve attached my SVG file, if anyone can help
it would be appreciated.
Progress! I downloaded the navigraph ingamepanel and they had the icon in a
different folder structure. I tested the github template with an updated
layout.json and the icon now loads. I’m not sure if the icon needs to still be
in both locations but the navigraph panel has it in both. The folder structure
needs to be. 
Using the template from github I copied the atc svg but renamed it to match
the template svg. Sadly this still doesn’t work so there must be something
else at play here.
1. id="Titre" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
2. ICON_TOOLBAR_MAXIMUS_CUSTOM_PANEL
3. id="HIGHLIGHT">
4. id="Path_665-2" data-name="Path 665-2" d="M41.42,26.19a.64.64,0,0,0-.15-.31L39.4,23.51H36.75V20.77h-4V15.48a.81.81,0,0,0-.81-.81.82.82,0,0,0-.82.81v5.29H27.25v2.74H24.56l-1.88,2.37a.83.83,0,0,0-.16.36.82.82,0,0,0-.12.91l3.42,6.78.05.14a.81.81,0,0,0,.77.54h.6v2.2a.82.82,0,0,0,.82.81h.44V49.33h6.84V37.62h.6a.81.81,0,0,0,.81-.81h0v-2.2h.61a.81.81,0,0,0,.77-.54l3.47-6.92A.81.81,0,0,0,41.42,26.19ZM25.35,25.14h2.71a.81.81,0,0,0,.81-.81h0V22.4h6.26v1.92a.82.82,0,0,0,.81.82h2.67l.86,1.08h-15Zm.06,4.35-1.1-2.18h2.13l.69,2.18Zm1.72,3.43L26,30.58h1.52l.74,2.34Zm.45-5.61h4v2.18H28.27Zm7.54,6.76V36H28.87V34h6.26v.07Zm-6.51-3.49h2.94v2.34h-2.2Zm6.32,2.34H32.64V30.58h3Zm-2.29-3.43V27.31H36.7L36,29.49Zm4.22,3.43h-.79l.74-2.34H38Zm1.73-3.43H37.16l.69-2.18h1.84Z"/>
5.
6.
That by itself doesn’t seem to make a difference for me - it seem to be
something in the SVG file itself. My SVG doesn’t work while those created by
other developers do (when copied to my project). I just can’t work out what it
is that’s different!
I got mine working with the following…
1. width="70%" height="70%" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
2. ICON_TOOLBAR_FLIGHTCASE
3. transform="matrix(0.0761719,0,0,0.0761719,17.375,12.5)">
4. id="HIGHLIGHT">
5. d="M336,160L48,160C21.49,160 0,181.49 0,208L0,432C0,458.51 21.49,480 48,480L64,480L64,496C64,504.84 71.16,512 80,512L112,512C120.84,512 128,504.84 128,496L128,480L256,480L256,496C256,504.84 263.16,512 272,512L304,512C312.84,512 320,504.84 320,496L320,480L336,480C362.51,480 384,458.51 384,432L384,208C384,181.49 362.51,160 336,160ZM320,376C320,380.42 316.42,384 312,384L72,384C67.58,384 64,380.42 64,376L64,360C64,355.58 67.58,352 72,352L312,352C316.42,352 320,355.58 320,360L320,376ZM320,280C320,284.42 316.42,288 312,288L72,288C67.58,288 64,284.42 64,280L64,264C64,259.58 67.58,256 72,256L312,256C316.42,256 320,259.58 320,264L320,280ZM144,48L240,48L240,128L288,128L288,48C288,21.49 266.51,0 240,0L144,0C117.49,0 96,21.49 96,48L96,128L144,128L144,48Z" style="fill-rule:nonzero;"/>
6.
7.
8.
Thanks for that - your icon works fine, but when I substitute my paths leaving
everything else as-is, it doesn’t. So there must be an issue with my path
definitions, maybe it goes outside the boundaries or something? And what does
that matrix transform do? Investigation continuing.
I’m afraid that is the extent of my knowledge, I used a font awesome icon as
an SVG and tweaked it to match. Good luck!!
Hi, could you paste your layout.json too? I’m having the same issue as you
were and @RoscoHead is. Thanks Gnome
Never mind I sorted it! Thanks though 
Does anyone know why (if that is the case) there hase to be two versions of
the SVG? Or even better, what is the purpose of each location?
Hi jensbrak, since a while ago mine is working with the SVG in
html_ui/icons/toolbar only, hope this helps.
I have the same problem ands I am working on it since hours. The two different
paths exist, because SU 6 changed this path. Before it was Textures… after
it was icons… I Made my svg with Inkscape, Corel Draw, different online
editors. I fiddled around with x y size, viewport, scaling, changed names, id,
tried just to change the path and leave everything from a working svg…
making just a littkle simple svg… All the time it loosk in Edge, but in FS
IT NEVER SHOWS. Again and again loading FS for hours … nothing. Just taking
the example of ByMaximus or other panel addon suppliers, they work. Correct
path/filename and byte Size in Layout.json except the timestamp
HEEEEEEEEEEELP! I have no idea no longer!
@NaughtyGnome ist is fine that You solved Your
problem. But just saying so, does not help anyone. What was Your cause?
1. Here is my last try:
2. <svg
3. width="64.000000px"
4. height="64.000000px"
5. viewBox="0 0 16.933333 16.933333"
6. version="1.1"
7. id="svg29"
8. xmlns="http://www.w3.org/2000/svg"
9. xmlns:svg="http://www.w3.org/2000/svg">
10. ILS7title>
11.
12. <defs
13. id="defs26" />
14. <g
15. id="layer1">
16. <path
17. style="fill:#000000;stroke-width:0.0325243"
18. d="m 13.785929,16.17372 c -0.385716,-0.136568 -0.607538,-0.295616 -0.868727,-0.622883 -0.188794,-0.236557 -0.437325,-0.736418 -0.564168,-1.134688 -0.145146,-0.455742 -0.292221,-1.28108 -0.312297,-1.752527 l -0.0078,-0.182237 0.621502,-0.321069 c 0.341825,-0.176587 0.65015,-0.32608 0.685166,-0.332206 0.05834,-0.01021 0.06813,0.02212 0.117152,0.387141 0.09282,0.691194 0.241528,1.134586 0.455112,1.357004 0.180571,0.188038 0.463522,0.191548 0.61295,0.0076 0.238616,-0.293734 0.340973,-0.741697 0.319387,-1.397798 -0.02906,-0.884278 -0.154792,-1.201475 -1.105022,-2.7879198 -0.82137,-1.3713383 -1.146822,-2.0759835 -1.353391,-2.9302967 -0.242871,-1.0044473 -0.267898,-2.2713364 -0.06547,-3.3144383 0.225252,-1.1607506 0.75009,-1.985071 1.433726,-2.25184023 0.120283,-0.0469354 0.245327,-0.0622036 0.509951,-0.0622616 0.303806,-6.281e-5 0.380361,0.0118087 0.573692,0.0890004 0.539016,0.21521183 0.951349,0.74420653 1.208548,1.55048043 0.173789,0.5447954 0.240545,0.9194523 0.241123,1.3532456 l 5.02e-4,0.3749196 -0.278879,0.1834935 C 15.292891,4.8576085 15.123642,4.9589926 15.09791,4.9321959 15.08276,4.9164249 15.05735,4.778806 15.04143,4.6263776 14.968,3.9232852 14.813714,3.4475032 14.597778,3.2582909 c -0.140406,-0.1230283 -0.367788,-0.1230283 -0.508193,0 -0.21776,0.1908107 -0.353629,0.6393929 -0.354234,1.1695221 -8.52e-4,0.7473404 0.292614,1.4967738 1.073943,2.742565 0.793247,1.2647931 1.12073,1.9693933 1.3652,2.937308 l 0.113168,0.448063 9.7e-5,1.417185 c 9.5e-5,1.294247 -0.0056,1.447906 -0.06553,1.77134 -0.177746,0.959147 -0.56604,1.735473 -1.064084,2.127451 -0.201549,0.158624 -0.281735,0.199775 -0.593628,0.304639 -0.137432,0.04621 -0.645495,0.04448 -0.778598,-0.0026 z M 0.93164056,15.914633 C 0.87862546,15.863203 0.86208776,15.80944 0.86272166,15.690602 0.8631727,15.604602 1.2701336,13.211778 1.767061,10.37321 L 2.6705654,5.2121789 2.5739743,5.1126086 C 2.5208491,5.0578459 2.4330134,4.9159584 2.3787839,4.7973047 2.2866356,4.5956846 2.2802867,4.557684 2.2817445,4.2164811 2.2836266,3.7777787 2.3523423,3.5577632 2.553626,3.3460592 2.8507831,3.03352 3.2297051,3.1749514 3.4184396,3.6688475 c 0.056909,0.1489244 0.069757,0.2497847 0.069757,0.5476336 0,0.4332405 -0.067434,0.6554999 -0.2623159,0.8645783 L 3.103665,5.2121789 4.0048778,10.356615 c 0.4956671,2.82944 0.9041549,5.204179 0.9077504,5.277197 0.00863,0.175289 -0.024256,0.273855 -0.1067107,0.319808 -0.1157497,0.06451 -0.1946729,-0.07437 -0.259023,-0.455783 -0.062977,-0.37328 0.041504,-0.223576 -0.8316566,-1.191621 C 3.4847252,14.050653 3.2038521,13.739211 3.0910757,13.614121 L 2.8860278,13.386686 2.694658,13.600099 C 2.5894047,13.717476 2.3168376,14.019912 2.0889538,14.27218 1.86107,14.524447 1.5866995,14.828529 1.4792411,14.947918 l -0.1953783,0.21707 -0.054915,0.325559 c -0.034168,0.202564 -0.07863,0.356955 -0.1176857,0.40866 -0.075972,0.100576 -0.090563,0.101829 -0.17962125,0.01542 z M 2.2445764,13.41622 c 0.159821,-0.179172 0.2905834,-0.345151 0.2905834,-0.368841 0,-0.02368 -0.077182,-0.130998 -0.171517,-0.238461 -0.2871573,-0.327123 -0.5531343,-0.613638 -0.5601287,-0.603379 -0.00364,0.0053 -0.082018,0.450308 -0.1741672,0.988814 -0.09215,0.538507 -0.1741857,1.008974 -0.182302,1.045482 -0.01465,0.06591 0.2230009,-0.17952 0.7975315,-0.823615 z m 1.907656,-0.187216 -0.180948,-1.041343 -0.3752059,0.412073 c -0.2063634,0.226641 -0.3753111,0.42566 -0.3754397,0.442265 -1.272e-4,0.0166 0.075191,0.113683 0.1673758,0.215733 0.092185,0.10205 0.3387654,0.375588 0.5479561,0.60786 0.2091909,0.232274 0.3841409,0.418365 0.3887779,0.413535 0.00463,-0.0048 -0.072995,-0.477384 -0.1725162,-1.050123 z M 3.5979271,11.916715 C 3.9016814,11.578769 3.8832159,11.687294 3.75749,10.978926 L 3.6912191,10.60554 H 2.8821183 c -0.445005,0 -0.8091005,0.01263 -0.8091005,0.02806 0,0.01543 -0.03572,0.228266 -0.079376,0.472956 -0.043657,0.244689 -0.079513,0.461075 -0.079679,0.480856 -3.006e-4,0.03763 0.01448,0.05499 0.6045565,0.709484 l 0.365821,0.405756 0.2238084,-0.245017 c 0.1230942,-0.134753 0.3434946,-0.37817 0.4897784,-0.54092 z M 3.5687027,9.9500391 c -0.00127,-0.0502 -0.048139,-0.352643 -0.104173,-0.672096 L 3.3626501,8.6971196 2.8955432,8.687949 C 2.4713144,8.679619 2.4268551,8.684189 2.4112087,8.737734 2.3848157,8.828051 2.2005727,9.9173021 2.2005373,9.9832281 c -2.88e-5,0.053516 0.053835,0.058087 0.6852136,0.058087 h 0.6852447 l -0.0023,-0.091271 z M 3.2419503,8.0084289 C 3.2324692,7.9673562 3.1507664,7.5080909 3.0603869,6.987839 2.9154901,6.1537717 2.8698144,5.9284059 2.8698144,6.04755 c 0,0.039183 -0.3141684,1.8515276 -0.3399168,1.9608789 -0.017482,0.074236 -0.015377,0.074677 0.3558528,0.074677 0.3711274,0 0.3733303,-4.514e-4 0.3561999,-0.074677 z M 3.0046256,4.6324801 C 3.1236381,4.5349932 3.1659232,4.3958589 3.1509513,4.1510121 3.1398069,3.9687527 3.123565,3.9200731 3.0456393,3.8353729 2.9359966,3.7161974 2.8410278,3.7079642 2.7518657,3.8099097 2.6442103,3.9329931 2.6148396,4.020026 2.6148396,4.2159525 c 0,0.2040244 0.056383,0.3498372 0.166269,0.4299878 0.092464,0.067441 0.1273169,0.065344 0.223517,-0.013452 z M 5.6639149,15.8938 c -0.011686,-0.01217 -0.021247,-3.333481 -0.021247,-7.3806925 0,-6.2032466 0.00688,-7.3645122 0.043825,-7.3964422 0.030753,-0.026574 0.2660419,-0.035214 0.7888287,-0.028952 l 0.7450036,0.00889 0.00804,7.4096484 0.00804,7.4096483 H 6.4607817 c -0.4265906,0 -0.7851807,-0.01 -0.7968667,-0.02213 z M 8.447391,8.5352338 c 0,-6.2220207 0.00688,-7.3866385 0.043825,-7.4185685 0.030753,-0.026574 0.2660419,-0.035214 0.7888288,-0.028952 l 0.7450032,0.00889 0.0081,6.1810881 0.008,6.1810886 0.868425,0.0088 0.868425,0.0088 0.0083,1.219729 0.0083,1.21973 H 10.121057 8.4473918 Z M 1.2744894,7.0780557 C 1.1412166,6.9692848 0.84800252,6.2888331 0.71757332,5.7856389 0.58745676,5.2836517 0.53714848,4.861702 0.53444197,4.2496712 0.52999432,3.2449042 0.70116429,2.4294007 1.0762489,1.6682831 1.2485206,1.3187107 1.3187036,1.2633468 1.4255672,1.3927201 1.5375843,1.5283341 1.5205186,1.6632378 1.3467933,2.01543 0.86229498,2.9976512 0.73581398,4.2653163 1.0045633,5.4454633 1.093109,5.8342929 1.1648962,6.0343549 1.358216,6.4310581 1.5162356,6.755323 1.5342094,6.8995143 1.4332674,7.033148 1.3591247,7.1313029 1.3447224,7.1353764 1.2744894,7.0780557 Z M 4.3382335,7.033148 C 4.2350158,6.8965012 4.2553536,6.760837 4.4330107,6.4009366 4.603204,6.0561569 4.7426248,5.6278494 4.8361761,5.1623938 4.879559,4.9465471 4.8929216,4.7243553 4.8930639,4.2164811 4.8932549,3.4851714 4.8569527,3.2159051 4.6809355,2.6436925 4.5537466,2.2302147 4.5835249,2.0093517 4.7664615,2.0093517 c 0.090243,0 0.1514429,0.127432 0.2737686,0.5700489 0.140856,0.5096678 0.1966018,0.9666109 0.1976933,1.6204854 0.00133,0.7928794 -0.088828,1.3713008 -0.3166455,2.0316249 -0.1597325,0.4629813 -0.3962192,0.8890878 -0.4934386,0.8890878 -0.012952,0 -0.053275,-0.039353 -0.089606,-0.087451 z M 1.822858,5.9659931 C 1.7245402,5.8222083 1.5439738,5.3396331 1.478708,5.0462285 1.4321266,4.8368234 1.4201816,4.6544528 1.4221854,4.183291 1.4244607,3.6503333 1.433576,3.5518511 1.5067347,3.2705684 1.6063824,2.8874492 1.7548362,2.5368138 1.86673,2.4202929 l 0.083036,-0.086469 0.077562,0.075877 C 2.124124,2.5043929 2.1338492,2.738696 2.04722,2.8888835 1.8561311,3.2201628 1.7486216,3.6919915 1.7484996,4.199886 c -1.148e-4,0.4774431 0.067567,0.825683 0.2315023,1.1911334 0.1345562,0.2999574 0.1564936,0.4729875 0.075276,0.5937368 -0.06723,0.099954 -0.1561487,0.092775 -0.2324168,-0.018765 z m 1.8933683,0.018765 C 3.6365468,5.8662953 3.6560585,5.6858185 3.7753332,5.4380379 4.1188463,4.7244307 4.1197924,3.7094069 3.7776179,2.999382 3.6429592,2.71997 3.6325853,2.5521111 3.7418045,2.4198861 l 0.075181,-0.09102 0.086633,0.090218 C 4.0203372,2.5406289 4.166942,2.8867815 4.2640851,3.2701905 4.3824679,3.737428 4.4003256,4.4798159 4.3048106,4.9632571 4.193039,5.5289797 3.9621881,6.0585244 3.8273372,6.0585244 c -0.033816,0 -0.083811,-0.033194 -0.1110994,-0.073765 z M 16.261031,5.8261939 c 0,-0.045637 0.0072,-0.064305 0.01608,-0.041487 0.0088,0.02282 0.0088,0.060157 0,0.082975 -0.0088,0.02282 -0.01608,0.00416 -0.01608,-0.041488 z M 4.3687573,1.8508905 C 4.2623254,1.761146 4.2444407,1.5233062 4.3351256,1.4036369 4.417616,1.2947801 4.4433224,1.2914481 4.5271519,1.3787439 c 0.046045,0.04795 0.063608,0.1101527 0.063256,0.2240316 -5.112e-4,0.1636796 -0.012399,0.1956463 -0.098972,0.2660194 -0.042559,0.034595 -0.064157,0.031445 -0.1226784,-0.017906 z"
19. id="path44" />
20. g>
21. svg>
Hey @Abtzero Created the SVG I wanted and once
complete opened in XML viewer and copied everything in the G tag And
overwrote a copy of the original SVG that came with the example toolbar. It
seems all the header Information breaks the SVG in the game. Hope this helps
Thanks
Hey, @NaughtyGnome, thanks for Your reply! I think I tried this already…
need to check.
Hello, I just tried with your SVG and it works well, as you can see on this
screenshot
correct data in your layout.xml and the svg in this folder ?
1. PackageSources\html_ui\icons\toolbar
You can send me your package if you want and I will take a look 
Best
Regards, Boris
Hello, I tried with your svg in the zip file you provided and it’s working for
me on my test package like you can see on this screenshot
I will try to find what’s going on Best Regards, Boris
Hey @Abtzero So there are two SVG files in the
folder structure. One in \html_ui\icons\toolbar One in
\html_ui\Textures\Menu\toolbar Before the opening tag all I have is
1. id="Titre" xmlns="http://www.w3.org/2000/svg" width="64.000000px" height="64.000000px" viewBox="0 0 64.000000 64.000000">
2. ICON_TOOLBAR_MAXIMUS_CUSTOM_PANEL
3. type="text/css">
4. .st0{display:none;}
5. .st1{display:inline;fill:#E52613;stroke:#1D1D1B;stroke-miterlimit:10;}
6. .st2{display:inline;}
7. .st3{stroke:#FFFFFF;stroke-miterlimit:10;}
8. .st4{fill:#FFFFFF;stroke:#FFFFFF;stroke-miterlimit:10;}
9. .st5{display:none;fill:none;}
10. .st6{display:none;fill:none;stroke:#1D1D1B;stroke-miterlimit:10;}
11. .st7{display:none;fill:none;stroke:#FFFFFF;stroke-miterlimit:10;}
12. .st8{fill:none;}
13.
Thank Youn very much! I figured ist out…