“Add files to list” disappears when using “My custom iconset”

Resolved thewebtailors
(@thewebtailors)

3 months, 3 weeks ago

I noticed when “My custom iconset” is selected, the “+ Add files to list” button in the toolbar disappears. It shows for the other default iconsets (Bootstrap, DashIcons FontAwesome). I tried it on two different websites (completely different setup) and I am running the newest plugin and WordPress version.

It would be great if this could get fixed as we currently have to temporary change the iconset whenever we want to add a file. Let me know if you have any questions.

Viewing 9 replies - 1 through 9 (of 9 total)

Plugin Author threadi
(@threadi)

3 months, 3 weeks ago

Hello,

thanks for your question. I cannot reproduce the problem in my case, but I can see a possible cause. The button for adding files is only displayed if icons are assigned to the selected icon set, which in turn are assigned to a file type.

You can edit the icons under “All Icons”. Have you selected a file type for each of your custom icons there? This is important to be able to assign the icon to a file at all.

Thread Starter thewebtailors
(@thewebtailors)

3 months, 3 weeks ago

Thank you for your reply! I see what you are saying. And indeed, I did not have any icons added to “My custom iconset” as I am using a custom icon font to display file icons.

I now added a pdf icon to “My custom iconset”. I did not add any other icons as pdf is the only icon used in this context. While it now shows in the Gutenberg editor, the “+ Add files to list” button is still missing:

Is there anything else I can try? Otherwise, I can just use the Bootstrap iconset and deque the styles in the frontend.

Appreciate your help!

Plugin Author threadi
(@threadi)

3 months, 3 weeks ago

I am using a custom icon font to display file icons

How did you add that? With individual CSS? I’m just asking to see if there is a way for me to add an exception in the plugin for such a case (which doesn’t help an individual case like you, but everyone).
Thread Starter thewebtailors
(@thewebtailors)

3 months, 3 weeks ago
Correct, I just added the following custom CSS to the frontend:
```
@font-face {
		font-family:'twt-icons';
		src:url('/wp-content/plugins/twt-customizations/assets/icons/twt-icons.woff2?1') format('woff2'),
		url('/wp-content/plugins/twt-customizations/assets/icons/twt-icons.woff?1') format('woff'),
		url('/wp-content/plugins/twt-customizations/assets/icons/twt-icons.ttf?1') format('truetype');
		font-weight:400;
		font-style:normal;
		font-display:swap;
	}
.wp-block-downloadlist-list.iconset-custom {
	margin-left:0;
}
.wp-block-downloadlist-list.iconset-custom li {
	position: relative;
	margin-bottom:1em;
}
.wp-block-downloadlist-list.iconset-custom li:before {
	content:'\e901';
	font-family:twt-icons;
}
.wp-block-downloadlist-list.iconset-custom li.file_vndopenxmlformats-officedocumentwordprocessingmldocument:before {
	content:'\e905';
	color:#3758B5;
}
.wp-block-downloadlist-list.iconset-custom li.file_pdf:before {
	content:'\e903';
	color:#8A0E04;
}
```
Thank you for your consideration!
Plugin Author threadi
(@threadi)

3 months, 3 weeks ago

I find it fascinating how the plugin is used and apparently also encourages people to create their own implementations. That’s why I’m always happy to receive suggestions for improvements that could help all users, even if you’re not immediately aware of them.

I have the following idea for your case:
I could add that you can store or select the font files on an icon set. Then you could store the Unicode for each icon to be used instead of a graphic. This way, the plugin would completely take care of generating the CSS code (with font etc.) that you have currently written there by hand. I think it would be feasible overall, it’s just a bit difficult in terms of usability so that every user understands it without much guidance (an aspect I pay a lot of attention to).
Would that be something? Then I’ll think about it for one of the next updates. I’ve added it directly to GitHub as an issue: https://github.com/threadi/downloadlist/issues/138

I have just dropped an update for your current problem. This should make the file selection work better for you.

Thread Starter thewebtailors
(@thewebtailors)

3 months, 3 weeks ago

Being able to add my own icon font and set the unicodes instead of uploading graphics would work well in my case. In the end, my goal was to use a lightweight approach with minimal css/font file size. While I appreciate being able to upload image files for icons, I do prefer using an icon font or svg for sharper rendering and smaller file size. However, I totally understand if this is too much effort for a limited use case.

In case you wonder, I use https://icomoon.io to generate my own icon fonts.

Thank you for releasing an update. I installed it but unfortunately it did not change the behavior. Whether “My custom iconset” contains the pdf icon or no icon at all, the “+Add files to list” button does not show.

Is there a way for you to allow to show the “+Add files to list” button in all cases?
Plugin Author threadi
(@threadi)

3 months, 3 weeks ago
That is strange. Just to compare again:
- I have a custom icon set.
- I have an icon that is assigned to this custom icon set.
- This icon is also assigned to any file type.
- If I then open the block editor and edit a download list block, I can select the custom icon set. I can then continue to add files using the button.
Tip:
Reload the Block Editor if you still have it open. This way the block requests the icon set data again.

This way must work, it does for me without any problems. There is currently no alternative way to do this. I would have to think about one first.
Thread Starter thewebtailors
(@thewebtailors)

3 months, 3 weeks ago

It is working now! I did all this yesterday and made sure to reload and clear all server side/browser side caches. Today, I tried it again and worked on giving you access to you can test it yourself and suddenly it worked. Go figure 😉 Maybe something was still cached after all.

So my current setup is the following: I assigned a standard plain file icon to the custom iconset and I assigned it to pdf. On the frontend, I am still using my custom code to overwrite the design. This works fine for me. No need to make any other changes unless you really want to.

I really appreciate all the work you put into this!

Plugin Author threadi
(@threadi)

3 months, 3 weeks ago

It’s great that it works. And interesting that the caching was probably to blame. I’ll have a look at that too in the further development.

Thanks also for marking the topic as solved. You are also welcome to leave a review: https://wordpress.org/plugins/download-list-block-with-icons/#reviews

Viewing 9 replies - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.