невозможно объединить мобильное меню в текущее меню

Question

Я работаю над своим онлайн-портфолио и хотел бы добавить модное мобильное меню.Мое текущее меню (помещено в нижний колонтитул) адаптивно для мобильных устройств и компьютеров и работает хорошо.Я нашел хороший скрипт меню и хотел бы добавить его в свое меню.Я пытался объединить меню в свое правильное меню, но я не могу понять, как.Сценарий меню легко, но сложно слить.Кто-нибудь может мне помочь?

Это мое точное меню:

<footer class="lg-sticky row main-menu">
<div class="container">
    <nav class="navbar navbar-expand-md fixed-bottom">
        <button type="button" class="navbar-toggler ml-auto hidden-sm-up float-xs-right m-3" data-toggle="collapse" 
                data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                aria-expanded="false" aria-label="Toggle navigation">
            <i class="fas fa-bars hamburger_bars dropup"></i>
        </button>
        <div class="collapse navbar-collapse mr-auto w-100 justify-content-end" id="navbarSupportedContent">
        <?php /* Primary navigation */
             wp_nav_menu([
                            'menu'            => 'primary',
                            'theme_location'  => 'bottom',
                            'container'       => false,
                            'container_id'    => 'navbarSupportedContent',
                            'container_class' => 'collapse navbar-collapse',
                            'menu_id'         => false,
                            'menu_class'      => 'navbar-nav main-nav',
                            'depth'           => 2,
                            'fallback_cb'     => 'bs4navwalker::fallback',
                            'walker'          => new bs4navwalker(),
                        ]);
            ?>
        </div>
    </nav>
</div>

Это новое меню, которое я хотел бы объединить из этого стиля источника6 :

  <div class="iphone style-6">
<div class="iphone__item">#6</div>
<div class="iphone__power-btn"></div>
<div class="iphone__left-btn"></div>
<div class="iphone__details"></div>
<div class="iphone__screen">
  <a href="#" class="nav__trigger"><span class="nav__icon"></span></a>
  <nav class="nav">
    <ul class="nav__list">
      <li class="nav__item"><a class="nav__link" href="#">Home</a></li>
      <li class="nav__item"><a class="nav__link" href="#">About Us</a></li>
      <li class="nav__item"><a class="nav__link" href="#">Portfolio</a></li>
      <li class="nav__item"><a class="nav__link" href="#">Blog</a></li>
      <li class="nav__item"><a class="nav__link" href="#">Contact Us</a></li>
    </ul>
  </nav>
  <div class="iphone__content"></div>  
</div>
<div class="iphone__home-btn"></div>

Я не могу добавить css и javascript к этому сообщению, веб-сайт работает некорректно.Вы можете найти css en js на введите описание ссылки здесь