Displaying file icons in repeater

Daniel Reed asked on July 4, 2014 01:21

Hi all,

I'm a bit new to Kentico (but I am a solid developer) and have been trying to find out how to use a repeater and show file icons for a document library.

I have successfully added a repeater and shown some basic stuff in the transformation, but everything I have read and tried has failed to show the icon. It just comes back blank. What I want is if its a PDF, show a PDF icon, a DOC icon for a word doc etc.

It seems like I need to use the stuff under URLS and document links here

One additional question: is it possible to use a usercontrol in an ASCX template and have the template know what the current repeater data item is? In other words, can the user control know 'I am looking at document 1'?

Thanks for any help you can provide

Recent Answers

Vilém Jeniš answered on July 4, 2014 02:24

Hi Daniel,

"GetFileIcon()" is a transformation method that returns correct markup (not only url) for the icon. The merkup should look like this: <i class="icon-file-default icon-file-EXTENSION" aria-hidden="true"></i> you then have to give this markup styling you want it to have. For example:

.icon-file-EXTENSION:before { background-image: url("http://www.privacymark.org/images/icon_pdffile.jpg"); background-size: 100% auto; content: " "; display: inline-block; height: 20px; width: 20px; }

Let me know if the markup you get is different. It is possible without it being a bug. I'll investigate further if you need. However for the 'i' tags you need to provide your own styling or you can link our bootstrap.css along with bootstrap-additional.css, which is not recommended since these are style-sheets for the administration UI and might break your site.

0 votesVote for this answer Mark as a Correct answer

Daniel Reed answered on July 6, 2014 20:51

No, that works. I just assumed it would give an icon. The approach that Kentico applies is actually really smart as it lets the designer have full control over the resulting icon.

Just one more question though. The function requires the file extension to be passed into it. So how do I do that? At the moment I am just manually testing with this:

<%# GetFileIcon("pdf") %>

0 votesVote for this answer Mark as a Correct answer

Daniel Reed answered on January 13, 2015 02:43

I recently came back to this problem and worked out the code I needed

<%# GetFileIcon(Eval("DocumentType")) %>

0 votesVote for this answer Mark as a Correct answer