Александр Петров

Вероятно да, бутстрап может перекрывать background.
Попробуй в css написать: background-color: #3366CC !important;
Тогда у тебя этот стиль станет приоритетным.

Вообще стили применяются по порядку назначения. Самый последний объявленный будет итоговым. Это как раз можно нарушить за счет !important;

htmlbook.ru/css/%21important

Мое субъективное мнение вообще не учить WP.
Я очень долго фрилансил и в итоге пришел к тому, что лучше идти работать куда-то программистом в компанию. И заработаете больше денег и потратите меньше нервов.
Фриланс очень портит вас как программиста. Потому что вы работаете один, писать хороший код мотивации нет, в итоге говнокодите ради того, чтобы сдать проект. Лучше потратьте полгода на курсы по фронту, выучите React, почитайте про SOLID, паттерны проектирования и го в сбер работать.
Но решать Вам, у каждого свой путь.
Если по теме - YouTube. Мне кажется сейчас нет такой темы, в которой нельзя разораться не посмотрев видосики на youtube. Говорю уверенно, потому что недавно так подразобрался с Blender и Unity.

Проверить включен ли js в браузере. И если выключен, то просто не вставлять preloader. Погуглите как сделать проверку. Я как-то искал решение примерно такой же проблемы и есть статьи как проверку js сделать, только я не помню уже как сам делал.

Не надо картинкой. Картинки - ущерб))))))))
Да, лучше svg-шкой бахнуть.
Через css маской можно через clip-path (но это опять же в svg маску рисовать).
Можно через border-radius поиграться. Но не факт, что точно такой же результат будет.

<div>
  <ugol_1>
  <ugol_2>
  <ugol_3>
  <ugol_4>
  <img>
</div>

div{
  position: relative;
}
ugol_1{
  position: absolute;
  left: 0px;
  top: 0px;
  background: image;
}

описал схематично. Для каждого угла прописываете где она находится через top,left,right,bottom