如何在PHP / tpl中包含JS / CSS?

I downloaded the virtual keyboard, and can't include in my website, i read the tutorial, it says that you need to put:

<script type="text/javascript" src="keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="keyboard.css">

this code in the <head>, so i have to files,.php and .tpl, I tried to add it to both files, but nothing happened, has anyone encountered such a problem?

in .tpl

<script type="text/javascript" src="keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="keyboard.css">

<main class="main" style="padding:0; overflow-x:initial">
    <div class="container">
        {include file="engine/modules/products/eogpo.php"}
    </div>
</main>
<div id="isTerminal"></div>

<div id="modalError" class="modal info__modal" data-modal>
    <button data-izimodal-close="" class="modal__close">
        <svg class="icon icon-close"><use xlink:href="/images/sprite.svg#icon-close"></use></svg>
    </button>
    <div class="modalStyle">
        <h3 class="info__title" id="errorTitle"><?php echo _("Ошибка"); ?></h3>
        <div id="textError"></div>
    </div>
</div>

<div id="modalInfo" class="modal info__modal" data-modal>
    <button data-izimodal-close="" class="modal__close">
        <svg class="icon icon-close"><use xlink:href="/images/sprite.svg#icon-close"></use></svg>
    </button>
    <div class="modalStyle">
        <div id="textInfo"></div>
    </div>
</div>

<div id="overLoader" style="display: none"><img src="/templates/assets/images/loading.gif" alt="Loading..." /></div>

i'm added at the top

in .php

<script type="text/javascript" src="keyboard.js" charset="UTF-8"></script>
<link rel="stylesheet" type="text/css" href="keyboard.css">
<?php
//ini_set('error_reporting', E_ALL);
ini_set('display_errors', 0);
ini_set('display_startup_errors', 0);
session_start();
?>


<style>
.calculator__bloc:last-child {
    margin-bottom: 0;
}
.calculator__bloc {
    position: relative;
    padding: 30px 37px 34px;
    border-radius: 5px;
    margin-bottom: 20px;
}
.calculator__clos {
    position: absolute;
    right: 25px;
    top: 25px;
}
</style>

did the same

There is an option that you need to put special html tag in your .tpl file for keyboard.js. You can check it in documentation.

Also may be you lost init script for js to start - also you can check in the documentation.