Can't add Bootstrap icons as assets?

[LostInTranslation]

I was trying to have my Botostrap icons available as assets. But I run into problems:

If I drag&drop icons to the canvas in Designer, it keeps the filename as layer name, which is good.

But if I try to add one of those icons as an asset, I get "Assets can not contain embedded documents".

The other way around is to open an icon as a document. This way it can be added as an asset, but has no layer name but "Curves". Same happens if I doubleclick on the "embedded dodument" from above.
Renaming every single one of the currently 1800+ icons is not an option for me.

Is there any way, that I can get all Bootstrap icons into assets while retaining the names without too much effort?
OR did anybody make that already? I googled but did not find anything.

Cheers.

[firstdefence]

On Mac, you can drag the file/s directly onto the Assets Panel, but, if there are several elements to the SVG it will name it "Group" if the SVG has a single element it will retain the file name. 

You can add them en-masse so I have selected all of the icons and just dragged them directly from Finder to the Affinity Designer Assets panel, you will see that some of the icons have Group as a name and some have the file name as the name. 

 

Bootstrap Icons.afassets

[LostInTranslation]

29 minutes ago, firstdefence said:

On Mac, you can drag the file/s directly onto the Assets Panel, but, if there are several elements to the SVG it will name it "Group" if the SVG has a single element it will retain the file name. 

You can add them en-masse so I have selected all of the icons and just dragged them directly from Finder to the Affinity Designer Assets panel, you will see that some of the icons have Group as a name and some have the file name as the name. 

Bootstrap Icons.afassets 15.67 MB · 0 downloads

Thank you very much, that already helps.

[firstdefence]

There are batch flatten tools out there in the ether that can flatten an SVG, basically they are SVG optimisers, I tried Vecta.io as a test and it flattened 2 out of the 5 icons I uploaded. There may be better batch SVG flatteners out there I'll keep looking.

[David in Яuislip]

I took a different approach by writing a notepad++ macro which wraps the svg code in a group whose id is the filename
so
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-0-circle" viewBox="0 0 16 16">
<path d="M7.988 12.158c-1.851 0-2.941-1.57-2.941-3.99V7.84c0-2.408 1.101-3.996 2.965-3.996 1.857 0 2.935 1.57 2.935 3.996v.328c0 2.408-1.101 3.99-2.959 3.99ZM8 4.951c-1.008 0-1.629 1.09-1.629 2.895v.31c0 1.81.627 2.895 1.629 2.895s1.623-1.09 1.623-2.895v-.31c0-1.8-.621-2.895-1.623-2.895Z"/>
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0ZM1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8Z"/>
</svg>
becomes
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-0-circle" viewBox="0 0 16 16">
<g id="0-circle.svg">
<path d="M7.988 12.158c-1.851 0-2.941-1.57-2.941-3.99V7.84c0-2.408 1.101-3.996 2.965-3.996 1.857 0 2.935 1.57 2.935 3.996v.328c0 2.408-1.101 3.99-2.959 3.99ZM8 4.951c-1.008 0-1.629 1.09-1.629 2.895v.31c0 1.81.627 2.895 1.629 2.895s1.623-1.09 1.623-2.895v-.31c0-1.8-.621-2.895-1.623-2.895Z"/>
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0ZM1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8Z"/>
</g></svg>
and when imported as assets the filenames show up. Sadly they don't sort very well after drag dropping onto the Asset panel but you can't have everything.
Oh yeah, I also learnt that drag drop doesn't work if Notepad++ is run as admin as is my won't so double click on the exe rather than use the shortcut, then it took a few moments for the 1954 files to appear then a few more for the macro to run but it got there in the end. Macro is attached

bootstrap-new-icons.zip AssetsAddGroupID.txt

[v_kyr]

8 hours ago, LostInTranslation said:

Is there any way, that I can get all Bootstrap icons into assets while retaining the names without too much effort?
OR did anybody make that already? I googled but did not find anything.

For bootstrap icons AFAIK there are no ready assets files available yet, but instead for Font Awesome icons. - See therefor ...

• Font Awesome Affinity Assets

[LostInTranslation]

13 hours ago, David in Яuislip said:

I took a different approach by writing a notepad++ macro which wraps the svg code in a group whose id is the filename
so
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-0-circle" viewBox="0 0 16 16">
<path d="M7.988 12.158c-1.851 0-2.941-1.57-2.941-3.99V7.84c0-2.408 1.101-3.996 2.965-3.996 1.857 0 2.935 1.57 2.935 3.996v.328c0 2.408-1.101 3.99-2.959 3.99ZM8 4.951c-1.008 0-1.629 1.09-1.629 2.895v.31c0 1.81.627 2.895 1.629 2.895s1.623-1.09 1.623-2.895v-.31c0-1.8-.621-2.895-1.623-2.895Z"/>
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0ZM1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8Z"/>
</svg>
becomes
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-0-circle" viewBox="0 0 16 16">
<g id="0-circle.svg">
<path d="M7.988 12.158c-1.851 0-2.941-1.57-2.941-3.99V7.84c0-2.408 1.101-3.996 2.965-3.996 1.857 0 2.935 1.57 2.935 3.996v.328c0 2.408-1.101 3.99-2.959 3.99ZM8 4.951c-1.008 0-1.629 1.09-1.629 2.895v.31c0 1.81.627 2.895 1.629 2.895s1.623-1.09 1.623-2.895v-.31c0-1.8-.621-2.895-1.623-2.895Z"/>
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0ZM1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8Z"/>
</g></svg>
and when imported as assets the filenames show up. Sadly they don't sort very well after drag dropping onto the Asset panel but you can't have everything.
Oh yeah, I also learnt that drag drop doesn't work if Notepad++ is run as admin as is my won't so double click on the exe rather than use the shortcut, then it took a few moments for the 1954 files to appear then a few more for the macro to run but it got there in the end. Macro is attached

bootstrap-new-icons.zip 1.09 MB · 0 downloads AssetsAddGroupID.txt 1.78 kB · 0 downloads

Wow, that is everything I need, thank you.
I had no idea about the macros, but your approach works beautifully.

 

 

19 hours ago, firstdefence said:

On Mac, you can drag the file/s directly onto the Assets Panel, but, if there are several elements to the SVG it will name it "Group" if the SVG has a single element it will retain the file name. 

You can add them en-masse so I have selected all of the icons and just dragged them directly from Finder to the Affinity Designer Assets panel, you will see that some of the icons have Group as a name and some have the file name as the name. 

 

Dragging them directly to the Asets panel works in Windows too, I had no idea.
I only ever added assets via the canvas and never thought of dropping them directly.

 

 

Thanks to the both of you I have all the icons as named asets, how great is that?
The ready assets if you want it:
 

bootstrap_icons_19.zip