Improve user experience with custom icon packs

[FlorianWoelki]

Due to the new syncing mechanisms, all icon packs will have to be zipped into a file so that the syncing works smoothly. This behaviour works with the predefined icon packs but not with the custom created icon packs.

The improvement will include a better user experience to support icon additions to a custom icon pack through a zip file.

This issue was created based on #223

[binaryDiv]

Hey @FlorianWoelki, just a quick question about this for my understanding: Does this issue mean that currently the "sync via zip file" feature does not work at all with custom icon packs? Or can I already add a zip file to a custom icon pack?

I'm asking because I'm experiencing the syncing issues described in #52 and just updated to 2.2.1 and am confused about how to use the new sync feature. ^^

Also, the only reason I'm using a custom icon pack actually is that the version of Lucide Icons in the predefined icon packs is quite outdated and a lot of new icons are missing in it. Are there plans to update the icon packs soon? I'll also gladly do a pull request for that if wanted. :)

[FlorianWoelki]

Hey @FlorianWoelki, just a quick question about this for my understanding: Does this issue mean that currently the "sync via zip file" feature does not work at all with custom icon packs? Or can I already add a zip file to a custom icon pack?

I'm asking because I'm experiencing the syncing issues described in #52 and just updated to 2.2.1 and am confused about how to use the new sync feature. ^^

Also, the only reason I'm using a custom icon pack actually is that the version of Lucide Icons in the predefined icon packs is quite outdated and a lot of new icons are missing in it. Are there plans to update the icon packs soon? I'll also gladly do a pull request for that if wanted. :)

Yes you can already add a custom zip of your own custom icon pack and then use it. :)

I agree with the outdated icon packs, you can feel free to create a PR for that 🚀

[centifanto]

just to be clear, this is not yet implemented per the FlorianWoelki moved this to Todo in Iconize Board 3 days ago bullet above? If so, are we currently unable to use custom icon packs with Obsidian sync? I just tried a zipped package and it didn't show in the sync logs. Workaround right now is using Syncthing to sync the icon pack to my phone

[FlorianWoelki]

just to be clear, this is not yet implemented per the FlorianWoelki moved this to Todo in Iconize Board 3 days ago bullet above? If so, are we currently unable to use custom icon packs with Obsidian sync? I just tried a zipped package and it didn't show in the sync logs. Workaround right now is using Syncthing to sync the icon pack to my phone

It should be possible to sync custom zip files in Obsidian sync. Maybe the zip file was empty?

[centifanto]

Thanks for the reply @FlorianWoelki . No, I personally zipped the files myself, and confirmed it was not empty

[FlorianWoelki]

Thanks for the reply @FlorianWoelki . No, I personally zipped the files myself, and confirmed it was not empty

Do you have something so that I can reproduce the issue? Because atm, I cannot reproduce it locally.

[centifanto]

zipped_custom_icons_14.zip Attached is my zipped 14 icon custom pack. I drop this into /.obsidian/icons, and confirm it shows in the plugin settings as a custom pack. But it never shows syncing to my Vault, and subsequently never arrives on my phone. I've deleted and re-added multiple times, even deleting the vault from my phone.

[FlorianWoelki]

zipped_custom_icons_14.zip Attached is my zipped 14 icon custom pack. I drop this into /.obsidian/icons, and confirm it shows in the plugin settings as a custom pack. But it never shows syncing to my Vault, and subsequently never arrives on my phone. I've deleted and re-added multiple times, even deleting the vault from my phone.

Thank you! That's unfortunate. Do you use Obsidian Sync? Because obviously, normal syncing would mean it thinks when something gets added/updated :D You could also try using this approach.

[centifanto]

Yeah, I used to use Syncthing but now I have started paying for Obsidian Sync. And yes, I have already put my icons in .obsidian/icons but that does not solve the issue :/ Obsidian support doesn't have any answer to why this is happening, they seem to think it's something to do with the plugin. They said they've reached out to you but not response. Btw, I am just relaying the message here, not blaming you. I am just trying to get to the root of the problem :)

[FlorianWoelki]

Yeah, I used to use Syncthing but now I have started paying for Obsidian Sync. And yes, I have already put my icons in .obsidian/icons but that does not solve the issue :/ Obsidian support doesn't have any answer to why this is happening, they seem to think it's something to do with the plugin. They said they've reached out to you but not response. Btw, I am just relaying the message here, not blaming you. I am just trying to get to the root of the problem :)

Well, they've never reached out to me, honestly. Then I need to reach out to them...

[centifanto]

Ah gotcha. No worries :) Again, I am not upset, just trying to get to the bottom of the issue. If there's any testing you'd like me to do, I am completely willing.

Here is the response I got from support:

It looks like this is falling under the Sync issues the author has described in https://github.com/FlorianWoelki/obsidian-iconize#sync-issue. We've tried reaching out to them to make the .obsidian/icons/ the default behavior, but to no avail. https://github.com/FlorianWoelki/obsidian-iconize/issues/52 You will need to change this setting on all devices, and you might need to also redownload the icons again on all devices (its about 50/50 as to what users have reported back to me there).

[lishid]

For Obsidian Sync, any non-recognized folders in .obsidian are ignored. The setting for syncing 3rd party plugins will sync files in the folders .obsidian/plugins/plugin-name, so this is why

1. You should not be storing thousands of icons in that folder, to avoid clogging up the syncing process. I've suggested changing the default unpacked folder to .obsidian/icons/, but it seems like that hasn't happened yet.
2. If you do have a packed zip file, then you'll want to put it in the plugin folder so it gets synced.

[FlorianWoelki]

For Obsidian Sync, any non-recognized folders in .obsidian are ignored. The setting for syncing 3rd party plugins will sync files in the folders .obsidian/plugins/plugin-name, so this is why

1. You should not be storing thousands of icons in that folder, to avoid clogging up the syncing process. I've suggested changing the default unpacked folder to .obsidian/icons/, but it seems like that hasn't happened yet.
2. If you do have a packed zip file, then you'll want to put it in the plugin folder so it gets synced.

Got it! I will set the default path to .obsidian/icons/. Thanks!

[lishid]

If you're interested, I suggest possibly a way to pack and unpack through zips using this zip library. It will unfortunately bloat up your plugin's minified size by a few hundred kilobytes, but it may be worth considering.

See how we use it here: https://github.com/obsidianmd/obsidian-importer/blob/master/src/zip.ts#L1

[FlorianWoelki]

https://github.com/obsidianmd/obsidian-importer/blob/master/src/zip.ts#L1

Thank you for the suggestion. Zipping of the individual icon packs is already done, so that one icon pack is in one zip file. I think the safe approach would be to just set the default icon pack path to .obsidian/path

[centifanto]

I apologize, but I am not following the solution. Do I need to zip up my icons and place them in .obsidian/icons? Or will it work without zipping them up?

[FlorianWoelki]

I apologize, but I am not following the solution. Do I need to zip up my icons and place them in .obsidian/icons? Or will it work without zipping them up?

Please follow up with the question in the other issue. This issue wasn't intended to be about the syncing issue.

[centifanto]

Thanks for the reply @FlorianWoelki . However:

1. @lishid closed the other issue
2. And you specifically mention syncing in the original post of this issue

   Due to the new syncing mechanisms, all icon packs will have to be zipped into a file so that the syncing works smoothly.

[FlorianWoelki]

Thanks for the reply @FlorianWoelki . However:

1. @lishid closed the other issue
2. And you specifically mention syncing in the original post of this issue

Due to the new syncing mechanisms, all icon packs will have to be zipped into a file so that the syncing works smoothly.

Yes, but it still can be discussed there. Maybe you can also ask the question in #52.

[centifanto]

Ok I will not discuss the syncing here. However, the issue of whether we need to zip up our custom icons would seem appropriate to discuss here.

I just deleted all custom icons from both computer and phone. I then zipped up my icons and put them in .obsidian/plugins/iconize/icons. I then told Iconize to look in in tis dir but it wouldn't recognize the pack. Am I doing something wrong?

[FlorianWoelki]

Ok I will not discuss the syncing here. However, the issue of whether we need to zip up our custom icons would seem appropriate to discuss here.

I just deleted all custom icons from both computer and phone. I then zipped up my icons and put them in .obsidian/plugins/iconize/icons. I then told Iconize to look in in tis dir but it wouldn't recognize the pack. Am I doing something wrong?

You only need to zip your custom icon packs. That's how I would do it:

1. Add a custom icon pack and add all the icons to this pack
2. Zip your custom icon pack where it has been created
3. Enjoy the custom icon pack

[centifanto]

My apologies again, but I don't understand. I think there might be a language barrier in our communication. I have tried the instructions above but it does not work. I don't understand why I would create a custom folder, then zip them up inside of that folder. I am confused

I have the following questions:

1. Where am I supposed to tell Iconize to look for my icons?
2. When I zip up my icons, is the zip file supposed to be in the folder that previously contained them? For example .obsidian/plugins/iconize/icons/custom_icon_pack/zipped_icon_pack.zip

[centifanto]

Here is a screenshot, showing I have the zipped file with my 14 icons. Then I open Obsidian, but the plugin doesn't recognize any pack is there

[FlorianWoelki]

My apologies again, but I don't understand. I think there might be a language barrier in our communication. I have tried the instructions above but it does not work. I don't understand why I would create a custom folder, then zip them up inside of that folder. I am confused

I have the following questions:

1. Where am I supposed to tell Iconize to look for my icons?

2. When I zip up my icons, is the zip file supposed to be in the folder that previously contained them? For example

.obsidian/plugins/iconize/icons/custom_icon_pack/zipped_icon_pack.zip

No, you only need to zip the icon pack itself. At the moment, the plugin works through checking the icons in the zip file.

[centifanto]

In my screenshot above, I made sure to show you that the icon pack is zipped, but the plugin won't recognize it.

[FlorianWoelki]

In my screenshot above, I made sure to show you that the icon pack is zipped, but the plugin won't recognize it.

I am going to take a closer look at this issue.

[YannMiro]

A follow-up on #272. I don't know if the Icomoon solution has been mentioned before, but you can generate custom SVGs using the Font Awesome font library and they seem to be working seamlessly. The only issue I have in the past 9-10 days of usage is probably that the whole vault will take some seconds more to load, but it was a large one already, so...

[simonfossom]

@FlorianWoelki can you give us update on this?

I sync icons folder normally, don't add icons in settings but just add zip and all works fine. 👍 getting icons from settings or adding individual icons still makes problems.

[NomarCub]

In my opinion, not zipping the icons, and just using folders with plain SVG files would make a lot of this easier. No need for zipping manually, nor automatically. I'll copy this from my issue, as it was closed, and kinda duplicates this one: (https://github.com/FlorianWoelki/obsidian-iconize/issues/453)

I would like to have icons stored as individual plain text files, instead of opaque zip archive blobs, to version and sync them more easily. I version my vault with git, and this would make that easier too.

(I already use a plugin (this one, but it's unmaintained: https://github.com/aidenlx/obsidian-icon-shortcodes), which stores each icon as a file.)

[NickAnderegg]

I second @NomarCub's point. The zip solution is great for bundling icon packs with the plugin, but there's much less advantage to bundling up a user's icon pack locally!