Есть хорошая новость и плохая. Хорошая: таки удалось подключить и хедер, и футер отдельными файлами. Плохая: на это было потрачено 3 дня, а не 3 часа. А всё почему? Баг-то был не из разряда обычных, а из разряда "вообще не ясно почему", а это как бы не гуд. Сегодня вообще дичь была: при удалении закоменченной svg-картинки ломался и не отображался целый блок, который даже к этой картинке не относится...
Кароче, проблема оказалась не в кривых ручках и вообще не в сайте! А в баге лайв-сервера, да, того самого, официального, который установлен у 63 млн человек в VS Code. Причём, багу уже 4 года и его до сих ор не исправили!! Баг заключается в том, что при вставке внешнего html-файла на страницу с помощью фетча, если в этом файле есть svg-каринки, то при показе страницы в браузере через лайв-сервер, вместо картинок внутрь тега вставлялся js-код лайв-сервера и это, ежу понятно, ломало разметку. Адово.
Проблема решилась установкой другого, неофициального лайв сервера, называется Five Server. Или можно установить Live Preview, который создали, разрабы лайвсервера уже после обнаружения этого бага и там его нету. Кароче, лол. А время-то потеряно....