> For the complete documentation index, see [llms.txt](https://wplake.gitbook.io/advanced-views/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wplake.gitbook.io/advanced-views/display-content/meta-fields/content-fields/file.md).

# File

The File meta field (e.g. [ACF File field](https://wplake.org/blog/acf-file-field/)) allows a file to be uploaded and selected by using the native WP media popup.

## How to use it

**Select** the File field from your field group.

**Fill out** a label for the file in the **Label** field. This text will be prepended to the field.\
e.g. PDF Download: file-name.pdf

The **Link Label** is useful when you want to have more consistency in the output, fill out the Link Label to replace the link text of your file. By default the File name from the file attachment is used.

## 'Download' link

The default behavior for links to files is to open the file in the browser if the file type is supported (such as PDFs). However, in some cases, you might want to create a 'download' link that triggers an immediate download of the file instead of opening it in the browser.

To achieve this, you need to use the [download attribute](https://www.w3schools.com/tags/att_a_download.asp) for the link in the template:

```twig
{% if file.value %}
    <a target="{{ file.target }}"
       href="{{ file.value }}" download='{{ file.title }}'>
        {{ file.linkLabel|default(file.title) }}
    </a>
{% endif %}
```

{% hint style="info" %}
The download link attribute can either be empty, which simply enables the download functionality, or it can contain a string value that specifies the filename under which the file will be saved on the user's device. This is particularly useful when the default file names are technical or not very descriptive.
{% endhint %}

## 'Image' link

You can wrap any image into the file link. This well-known technique provides a visual representation of the attachment, allowing users to click on the image to view or download the file.

Make sure both image and file fields are added to the specific *Layout*, and amend the template to put the img tag inside the tag, as shown below:

{% code overflow="wrap" %}

```twig
{% if file.value and image.value %}
    <a target="{{ file.target }}"
       href="{{ file.value }}">
        <img src="{{ image.value }}" width="{{ image.width }}" height="{{ image.height }}" alt="{{ image.alt }}" decoding="{{ image.decoding }}" loading="{{ image.loading }}" srcset="{{ image.srcset }}" sizes="{{ image.sizes }}">
    </a>
{% endif %}
```

{% endcode %}

## Video attachments

To display the video attachments, employ the [video tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video), as shown below:

```twig
<video controls>
    <source src="{{ file.value }}" type="video/mp4">
</video>
```

## File attachment preview

If the File field contains a browser-supported file, such as a PDF, you can display the file directly on the page using the [\<iframe> element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe):

```twig
<iframe src="{{ file.value }}" width="100%" height="600px"></iframe>
```

## Displaying detailed info (Pro)

By default, the File field is displayed as a link, which suits most use cases. However, in some instances, you might want to display detailed information about the file. For example, if you've created a file field where a video has been selected, you may want to display it as a video player.

All WordPress media items, including images and files (videos, PDFs), belong to the 'attachment' post type. This means you can use any standard post fields.

Here’s how to do it:

1. **Create a Separate&#x20;*****Layout*****&#x20;for the File Display:** Create a new *Layout* specifically for the File display, selecting the appropriate fields (e.g., Post -> Attachment video), and Publish to save it.
2. **Choose the Field Layout for the File Field:** Select the *Layout* in the Field Layout of your File field settings, similar to how you would for any [object field](https://docs.advanced-views.com/display-content/object-fields).

That’s it! Your video will now be displayed with a video player. This approach can be used to display any post information, such as the author, updated date, etc.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://wplake.gitbook.io/advanced-views/display-content/meta-fields/content-fields/file.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.