Как скопировать стиль меню темы WordPress в меню, автоматически созданное плагином?

#css #wordpress #plugins

#css #wordpress #Плагины

Вопрос:

Я использую плагин клиентского портала, который автоматически создает меню на страницах клиента. Стиль цвета и шрифта я смог подобрать с помощью CSS, но в меню есть небольшая анимация, которую я хотел бы также дублировать, чтобы меню были одинаковыми на каждой странице. Я предполагаю — надеюсь — что смогу скопировать этот эффект из темы и вставить его в файл, управляющий стилями меню плагина. Сначала мне нужно знать, где найти стиль меню в теме, а затем, где разместить его в плагине. Все предложения приветствуются и ценятся. Ниже приведены некоторые подозреваемые, но, честно говоря, я здесь просто предполагаю:

Из заголовка php-файла:

 <header id="masthead" class="site-header <?php echo astrid_has_header(); ?>" role="banner">
        <div class="container">
            <div class="site-branding col-md-4 col-sm-6 col-xs-12">
                <?php astrid_branding(); ?>
            </div>
            <div class="btn-menu col-md-8 col-sm-6 col-xs-12"><i class="fa fa-navicon"></i></div>
            <nav id="mainnav" class="main-navigation col-md-8 col-sm-6 col-xs-12" role="navigation">
                <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_id' => 'primary-menu' ) ); ?>
            </nav><!-- #site-navigation -->
        </div>
    </header><!-- #masthead -->
  

Из осмотра меню плагина:

 <ul id="primary-menu" class="menu"><li id="menu-item-2232" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2232"><a href="https://lukeobritt-new.staging.wpmudev.host/welcome-to-the-client-portal/">NOT A CLIENT?</a></li>
</ul>
  

Комментарии:

1. Сложно давать конкретные рекомендации, не запачкав руки на реальном сайте. Иногда, просто используя что-то вроде Chrome DevTools и редактора кода, вы можете взломать свой путь к простому решению — если вы правильно угадаете, какие важные селекторы используются в оригинальном CSS или CSS JS / jQuery. Лучше, но требующее больше работы и знаний и, возможно, расширенного набора инструментов, будет определить, как именно создается эффект, а затем эмулировать с нуля.

2. Спасибо за ответ, CK. Да, я делаю успехи и узнаю совсем немного о редактировании темы и плагина, о постановке таблиц стилей в очередь и о том, почему разработчикам так хорошо платят. Если бы кто-то ответил простым исправлением копирования и вставки, ничего из этого обучения не происходило бы.

Ответ №1:

Я бы предположил, что в плагине используется файл javascript (в дополнение к css, который вы нашли), который завершает анимацию меню. Проведя небольшую детективную работу, вы, возможно, сможете найти библиотеку javascript или код и использовать их в создаваемом вами новом меню.

Поройтесь в исходных файлах плагина или проверьте исходный код страницы и посмотрите, какие js-файлы загружены, чтобы определить, какие из них могут быть связаны с этим плагином.

После того, как вы найдете некоторые файлы js для проверки или тестирования. Ссылка на возможные файлы / библиотеки js на вашей новой странице, тестирующей меню, и посмотрите, что получится.