Genesis Framework - Как переключить главный крючок и порядок привязки боковой панели

Question

Недавно я начал использовать Genesis Framework и до сих пор привык к крючкам, используемым для создания макета.

Страница, которую я проектирую, использует левую боковую панель в качестве основной навигации. Он отлично работает, пока он не рухнет на более мелкие экраны; боковая панель идет вниз, ниже основного содержимого.

Я попытался найти решение, так как кажется, что это может быть что-то общее, но без успеха.

Процесс, который, я думаю, разрешит его, заключается в использовании remove_action для удаления боковой панели и основного содержимого, чтобы затем вернуть их с помощью add_action в другом порядке. Для этого мне нужно знать точное имя крючков и номер заказа (если указано).

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

Answer 1

На всякий случай вам нужно, вот ответ на ваш вопрос.

Вот как вы удаляете содержимое страницы.

remove_action('genesis_loop', 'genesis_do_loop'); 

Как удалить боковую панель на странице.

remove_action('genesis_sidebar', 'genesis_do_sidebar'); 

И это крючки перед контентом и боковой панелью.

genesis_before_content 

В вашем случае давайте использовать эти коды в functions.php

remove_action('genesis_sidebar', 'genesis_do_sidebar'); 
add_action('genesis_before_content', function(){ 
    echo '<aside class="sidebar sidebar-primary widget-area" role="complementary" itemscope="itemscope" itemtype="http://schema.org/WPSideBar">'; 
    echo genesis_do_sidebar(); 
    echo '</aside>'; 
}, 2); 

Надеется, что это может помочь вам в будущем.

Answer 2

ОК. Решение, которое я нашел, - это исправление с помощью CSS, используя Flexbox.

Это довольно просто, но мне хотелось бы исправить проблему у источника, а не найти что-то, чтобы скрыть ее.

Выполняется с медиа-запросами вместе с размером экрана, когда он обрушивается. Исправление CSS:

1. Apply {display: flex; flex-direction: column;} к содержащему элементу, и
2. примените {order: 2;} к элементу, который появляется первым, но мне нужен второй.

Дайте мне знать, что вы думаете и/или что бы поступили иначе.