An easy way to attach files and documents to the product (multi-languages, multi-shops).
- Add files to the product in the admin. Multi-shops and multi-languages compatible.
- Display files on the frontend with a widget.
- Prestashop >= 1.7.6.0
- PHP >= 7.4.0
Download the pixel_product_files.zip file from the last release assets.
Go to the admin module catalog section and click Upload a module. Select the downloaded zip file.
Move the downloaded file in the Prestashop modules directory and unzip the archive. Go to the admin module catalog section and search for "File".
On the product page in admin, select "Modules", then "Configure" for the "Product Files" module.
Click "Add a file" to attach a file to the product.
When the shop is multi-shops or multi-languages, the file will be assigned to the current shop in the current language, except if the "Available in all shops/languages" option is checked.
The title and description fields are localizable.
In the product page template, add the following Widget:
{widget name='pixel_product_files'}Widget options:
- id_product: Force the display for the given product id
- id_shop: Force the display for the given shop id
- id_lang: Force the display for the given language id
- template: Custom template path
- icons_path: Custom icon images base URL
Example:
{widget name='pixel_product_files' id_product='1' id_lang='1' id_shop='1' template='module:pixel_product_files/product-files.tpl' icons_path="`$urls.base_url`img/file-icons/"}With product-files.tpl in themes/{themeName}/modules/pixel_product_files/product-files.tpl directory.
In a custom template, browse the files as follows:
{foreach from=$files item=file}
{assign var="extension" value=$file->getFile()|pathinfo:$smarty.const.PATHINFO_EXTENSION}
File URL: {$path.docs}{$file->getFile()}
Icon: {$path.icons}{$icons[$extension]}
Title: {$file->getTitle()}
Description: {$file->getDescription()}
{/foreach}Frontend file icons are divided into several categories:
| Category | Icon | File extensions |
|---|---|---|
| Document | document.png | pdf, odt, doc, opt, docx, rtf |
| Table | table.png | csv, ods, xls, xlsx |
| Presentation | presentation.png | pptx, pptm, ppt, odp |
| Image | image.png | png, gif, svg, webp, jpeg, jpg, bmp, avif, apng, ico, tiff |
| Video | video.png | avi, mp4, m4v |
| Audio | audio.png | mp3, ogg, flac, wav, m4a, wma, aac |
| Archive | archive.png | zip, rar, gz, tar, bz2, xz, 7z |
Other files extension are not allowed.
Set you own icon files with the icons_path option:
{widget name='pixel_product_files' icons_path="`$urls.base_url`img/file-icons/"}Then add icons in the img/file-icons directory:
- /img/file-icons/document.png
- /img/file-icons/table.png
- /img/file-icons/presentation.png
- ...
In the template, display the icon as follows:
{foreach from=$files item=file}
{assign var="extension" value=$file->getFile()|pathinfo:$smarty.const.PATHINFO_EXTENSION}
{if isset($icons[$extension])}
<img src="{$path.icons}{$icons[$extension]}" alt="{$file->getTitle()}" />
{/if}
{/foreach}