Размещение ссылки на файл - Joomla 3.x: Установка, обновление и настройка

Для своего сайта https://refanekb.ru нашел на просторах кодик для размещения ссылки на скачивание файла:

<div><strong> Скачать каталог</strong><b>:</b></div>
<div><strong>Файл</strong><b>:</b><a title="Скачать файл в формате .pdf" href="#" download="images/shortcode/parfumename.pdf"> Скачать</a></div>
<p><a href="#" download="images/shortcode/parfumename.pdf"><button class="btn">Скачать файл </button></a></p>

Разместил обе, чтоб посмотреть какая будет лучше. В панели управления ссылки выглядят как ссылки и при наведении мышкой реагируют правильно, а на самом сайте мёртвые напрочь. Посмотреть можно тут https://refanekb.ru/index.php/shopping/shop-categories/refan-eau-de-parfum/parfyumirovannaya-voda-refan-parfum-dlya-zhenshchin-v-assortimente - что не так сделано, и как можно добавить иконку от fa?

учит азбуку HTML, атрибут href у ссылки должен ссылаться (в вашем случае) на скачиваемый файл
некоторые браузеры скачиваемые файлы не скачивают, а открывают внутри браузера, чтобы этого избежать, для ссылки необходимо добавить атрибут download

подробнее webref.ru

=====

для добавление иконки fa необходимо подключить шрифт fontawesome, это уже сложнее, нежели приведение ссылки в порядок, но вам вполне по силам, учите азбуку )

атрибут href у ссылки должен ссылаться (в вашем случае) на скачиваемый файл

простите - а у меня он в куда ссылается?
К настоящему моменту ситуация такая - кнопка на файл работает, но надо еще разместить ссылку на страницу сайта - и вот теперь уже она не работает. Кстати - кнопка на файл - заработала в какой-то момент, не понял после чего, но в коде я ничего не поменял, лишь добавил ссылку на страницу.

Вот код целиком:
<div><b>Вы можете ознакомиться с каталогом у нас на сайте, или скачав файл каталога - изучить его, когда Вам удобно</b></div>
<div> </div>
<div><strong> Смотреть на сайте</strong><b>:</b></div>
<p><a title="Смотреть на сайте" href="index.php/shopping/product-details"><button class="btn">Смотреть </button></a></p>
<p> </p>
<div><strong> Скачать каталог</strong><b>:</b></div>
<p><a title="Скачать файл в формате .pdf" href="#" download="images/shortcode/parfumename.pdf"><button class="btn">Скачать файл </button></a></p>

Ещё одно открытие на данный момент - если я перед ссылками добавляю текста, и еще пару новых строк - то ниже некоего уровня на странице ссылки начинают работать, если "поднять" их выше - перестают работать. Заметил такое - случайно установилась такая высота, что верхняя кнопка работала "наполовину", т.е. буквально - мышкой провожу по кнопке сверху в низ - где-то на середине кнопки она становится активной, и ссылка работает. Поднимая мышку на пиксель выше - перестает работать. Т.о. получается - ссылки в описании к товару работают ниже определённой высоты на странице, а если поставить её выше - перестают работать...
Ничего не понимаю, кто-то может пояснить?
Страница https://refanekb.ru/index.php/shopping/shop-categories/refan-eau-de-parfum/parfyumirovannaya-voda-refan-parfum-dlya-zhenshchin-v-assortimente

Вас же послали по правильному адресу -- там всё написано. Ежели тяжело на указанном сайте набрать в поиске "download", то дарю первый результат поиска. Почитайте и посмотрите на приведённый там пример. Всё проще, чем тыкать пальцем в небо.

Какие ценные советы...
Ещё раз, внимательно - КОД РАБОТАЕТ! Только вот работает он ниже некой позиции на странице. Как-будто присутствует некий скрытый объект, накладывающийся поверх кнопок. Просмотр кода страницы не показал ничего подобного ни на странице целиком, ни на вкладке, где размещены данные кнопки. Поэтому вопрос еще интересен, но не важен - я просто кнопки приопустил ниже того таинственного объекта, и всё работает.
В любом случае - спасибо за внимание.

У Вас там с табами проблема. В ксс повозиться и норм будет. Содержимое последнего перекрывает предыдущие, попробуйте z-index или overflow.