CODEWITHSUNDEEP
octobercmsoctobercms-backend
creg
creg

Reputation: 164

List files from the media in the frontend (OctoberCMS)

I am still relatively new to OctoberCMS and wonder if I could dynamically list files from the media area (backend) on my website (frontend). The classic, dedicated access via {{ 'banner.jpg'|media }} (docs: https://octobercms.com/docs/markup/filter-media) has already worked for me.

I would also like to output certain file attributes like file size and timestamp. Is such a thing possible? Is there perhaps an example? Thank you.

Upvotes: 0

Views: 992

Answers (1)

Hardik Satasiya
Hardik Satasiya

Reputation: 9693

To get files from media area you can use MediaLibrary's Api

Demo, in you page code section use this code it will show you files under / root directory of media area

enter image description here

function onStart() {            
    $folder = '/';
    $mediaLib = \System\Classes\MediaLibrary::instance();
    // it will return us MediaLibraryItem instance     
    $files = $mediaLib->listFolderContents($folder);
    $this['mediaFiles'] = $files;
}

Now, in markup section

<div>
    <h1> files </h1>
    <ul>
    {% for item in mediaFiles %}
        <li>
        {% if item.fileType == 'image' %}
            <img src="{{ item.publicUrl }}" height="100" width="100"/>
            <br/> {{ item.path }}
            <br/> {{ item.sizeToString() }} 
            <br/> {{ item.lastModifiedAsString() }}
        {% else %}
            {{ item.path }} 
            <br/> {{ item.sizeToString() }} 
            <br/> {{ item.lastModifiedAsString() }}
        {% endif %}
        </li>
    {% endfor %}
    </ul>
</div>

Now you can have all the information you needed. you can also use this code in your component for better control.

Output :

enter image description here

if you have any doubts please comment.

Upvotes: 5

Related Questions