Как применить другую меню, стайлинг на переднюю страницу?

StackOverflow https://stackoverflow.com//questions/22054929

Вопрос

Я пытаюсь выяснить, как получить секунду Menustyling на сайте WordPress, который я использую Fullpage.js .

У меня есть пользовательский ходунок, а меню работает от onrorlinks для слайдов.Я пытаюсь выяснить, как изменить стайлинг в меню для слайдов, поэтому передняя страница имеет свою собственную.

сайт: http://www.svenssonsbild.se/svenssonsbild2

петля: 

<?php

if (($locations = get_nav_menu_locations()) && $locations['slides'] ) {

    $menu = wp_get_nav_menu_object( $locations['slides'] );
    $menu_items = wp_get_nav_menu_items($menu->term_id);
    $pageID = array();

    foreach($menu_items as $item) {
        if($item->object == 'page')
        $pageID[] = $item->object_id;

    }
    query_posts( array( 'post_type' => 'page','post__in' => $pageID, 'posts_per_page' =>      
    count($pageID), 'orderby' => 'post__in' ) );

}


while(have_posts() ) : the_post();

?> 


<!--     <div id="<?php echo $post->post_name;?>" class="section"> -->

<div id="pageSlide-<?php echo $post->post_name;?>" class="section" data-anchor="<?php echo $post->post_name;?>">
.

Уокер: 

<?php 
class description_walker extends Walker_Nav_Menu {

    function start_el(&$output, $item, $depth, $args) {
        global $wp_query;
        $indent      = ($depth)?str_repeat("\t", $depth):'';
        $class_names = $value = '';
        $classes     = empty($item->classes)?array():(array) $item->classes;
        $class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item));
        $class_names = ' class="'.esc_attr($class_names).'"';
        $output     .= $indent.'<li id="menu-item-'.$item->ID.'"'.$value.$class_names.'>';
        $attributes  = !empty($item->attr_title)?' title="'.esc_attr($item->attr_title).'"':'';
        $attributes .= !empty($item->target)?' target="'.esc_attr($item->target).'"':'';
        $attributes .= !empty($item->xfn)?' rel="'.esc_attr($item->xfn).'"':'';
        if($item->object == 'page') {
            $varpost = get_post($item->object_id);
            if(is_home()) {
                $attributes .= ' href="#'.$varpost->post_name.'"';
            }
            else {
                $attributes .= ' href="'.home_url().'/#'.$varpost->post_name.'"';
            }
        }
        else 
            $attributes .= !empty($item->url)?' href="'.esc_attr($item->url).'"':'';
        $item_output     = $args->before;
        $item_output    .= '<a'.$attributes.'>';
        $item_output    .= $args->link_before.apply_filters('the_title', $item->title, $item->ID);
        $item_output    .= $args->link_after;
        $item_output    .= '</a>';
        $item_output    .= $args->after;
        $output         .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
    }
}
?>
.

Это было полезно?

Решение

Если вы просто хотите применить другой стиль для первого раздела (не скольжения, слайды горизонтальные), вы, вероятно, хотите сделать это, используя обратные вызовы плагинов, такие как afterLoad или onLeave.

что-то вроде: 

$.fn.fullpage({
    slidesColor: ['red', 'blue'],
    afterLoad: function (anchorLink, index) {
        //if it is not in the 1st section, we apply sectionMenu class
        if (index !=1 ) {
            $('.demo').addClass('sectionMenu');
        }

        //otherwise, we remove it
        else{
            $('.demo').removeClass('sectionMenu');
        }
    }
});
.

Живой пример

Другие советы

Используйте класс кузова WordPress

На главной странице тег для тела будет иметь класс дома, как <body class="home">

Так что на домашней странице нацелена на меню, как так: 

.home .your-menu-selector
.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top