Site logo

[Support request] Element and custom code to switch between to different sets of navigation

Home Forums Support [Support request] Element and custom code to switch between to different sets of navigation

Home Forums Support Element and custom code to switch between to different sets of navigation

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #1765260
    Carsten

    Hi there, I’m using a hook element and some custom code below to switch between to different sets of menu icons in the generate_menu_bar_items hook when the User svg icon is clicked.
    It’s working ok, but I get this notification:

    This element needs a location set within the Display Rules tab in order to display.

    View post on imgur.com

    View post on imgur.com

    View post on imgur.com

    If I add Entire Site as location, this is the result:

    View post on imgur.com

    This is the code I use to make the switch, so my question is, if my approach to the solution is wrong, or should I just ignore the location warning?

    Regards
    Carsten

    //GeneratePress element 45256, edit, avatar, cover image 
    
    add_filter( 'generate_hook_element_display', function( $display, $element_id ) {
        if ( 45256 === $element_id && bp_is_user_profile_edit() ) {
            $display = true;
        }
    
        return $display;
    }, 10, 2 );
    
    //GeneratePress element 43720, search, messages, visitors, edit profile 
    
    add_filter( 'generate_hook_element_display', function( $display, $element_id ) {
        if ( 43720 === $element_id && bp_is_user_profile_edit()) {
            $display = false;
        }
    
        return $display;
    }, 10, 2 );
    
    add_filter( 'generate_hook_element_display', function ( $display, $element_id ) {
    
    	if ( 45256 != $element_id ) {
    		return $display;
    	}
    
    	// If message component or setting set display to false.
    	if ( bp_is_messages_component() || bp_is_settings_component() ) {
    		$display = false;
    	}
    
    	return $display;
    }, 10, 2 );
    
    #1765305
    Carsten

    Just to clarify, then I have created two hook elements for each of these navigation layouts

    The element 43720 is set to exclude front page:
    https://imgur.com/mkw4aP3

     <div class="menu-bar-item">
    	 
     <a href="/search"><svg viewBox="0 0 512 512" aria-hidden="true" role="img" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1em" height="1em">
    <path fill-rule="evenodd" clip-rule="evenodd" d="M208 48c-88.366 0-160 71.634-160 160s71.634 160 160 160 160-71.634 160-160S296.366 48 208 48zM0 208C0 93.125 93.125 0 208 0s208 93.125 208 208c0 48.741-16.765 93.566-44.843 129.024l133.826 134.018c9.366 9.379 9.355 24.575-.025 33.941-9.379 9.366-24.575 9.355-33.941-.025L337.238 370.987C301.747 399.167 256.839 416 208 416 93.125 416 0 322.875 0 208z"/>
    </svg></a>
    
    <a href="/members/me/bp-messages/"><svg aria-hidden="true" data-prefix="far" data-icon="comment-dots" class="svg-inline--fa fa-comment-dots fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M144 208c-17.7 0-32 14.3-32 32s14.3 32 32 32 32-14.3 32-32-14.3-32-32-32zm112 0c-17.7 0-32 14.3-32 32s14.3 32 32 32 32-14.3 32-32-14.3-32-32-32zm112 0c-17.7 0-32 14.3-32 32s14.3 32 32 32 32-14.3 32-32-14.3-32-32-32zM256 32C114.6 32 0 125.1 0 240c0 47.6 19.9 91.2 52.9 126.3C38 405.7 7 439.1 6.5 439.5c-6.6 7-8.4 17.2-4.6 26S14.4 480 24 480c61.5 0 110-25.7 139.1-46.3C192 442.8 223.2 448 256 448c141.4 0 256-93.1 256-208S397.4 32 256 32zm0 368c-26.7 0-53.1-4.1-78.4-12.1l-22.7-7.2-19.5 13.8c-14.3 10.1-33.9 21.4-57.5 29 7.3-12.1 14.4-25.7 19.9-40.2l10.6-28.1-20.6-21.8C69.7 314.1 48 282.2 48 240c0-88.2 93.3-160 208-160s208 71.8 208 160-93.3 160-208 160z"/></svg>
    
     
    [bp_better_messages_unread_counter hide_when_no_messages="1" preserve_space="1"]
    
     </a>
     <a href="/members/me/profile/edit/group/1/"><svg aria-hidden="true" data-prefix="far" data-icon="user-circle" class="svg-inline--fa fa-user-circle fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="#1da1f2" d="M248 104c-53 0-96 43-96 96s43 96 96 96 96-43 96-96-43-96-96-96zm0 144c-26.5 0-48-21.5-48-48s21.5-48 48-48 48 21.5 48 48-21.5 48-48 48zm0-240C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 448c-49.7 0-95.1-18.3-130.1-48.4 14.9-23 40.4-38.6 69.6-39.5 20.8 6.4 40.6 9.6 60.5 9.6s39.7-3.1 60.5-9.6c29.2 1 54.7 16.5 69.6 39.5-35 30.1-80.4 48.4-130.1 48.4zm162.7-84.1c-24.4-31.4-62.1-51.9-105.1-51.9-10.2 0-26 9.6-57.6 9.6-31.5 0-47.4-9.6-57.6-9.6-42.9 0-80.6 20.5-105.1 51.9C61.9 339.2 48 299.2 48 256c0-110.3 89.7-200 200-200s200 89.7 200 200c0 43.2-13.9 83.2-37.3 115.9z"/></svg>
    </a>
    </div>
     

    The element 45256 is set to entire site exclude front page:
    https://imgur.com/Xbj7FCC

    <div class="menu-bar-item">
    	
        <a href="/members/me/profile/change-avatar/"><svg aria-hidden="true" data-prefix="fas" data-icon="camera-retro" class="svg-inline--fa fa-camera-retro fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M48 32C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48H48zm0 32h106c3.3 0 6 2.7 6 6v20c0 3.3-2.7 6-6 6H38c-3.3 0-6-2.7-6-6V80c0-8.8 7.2-16 16-16zm426 96H38c-3.3 0-6-2.7-6-6v-36c0-3.3 2.7-6 6-6h138l30.2-45.3c1.1-1.7 3-2.7 5-2.7H464c8.8 0 16 7.2 16 16v74c0 3.3-2.7 6-6 6zM256 424c-66.2 0-120-53.8-120-120s53.8-120 120-120 120 53.8 120 120-53.8 120-120 120zm0-208c-48.5 0-88 39.5-88 88s39.5 88 88 88 88-39.5 88-88-39.5-88-88-88zm-48 104c-8.8 0-16-7.2-16-16 0-35.3 28.7-64 64-64 8.8 0 16 7.2 16 16s-7.2 16-16 16c-17.6 0-32 14.4-32 32 0 8.8-7.2 16-16 16z"/></svg>
    	</a>
     
        <a href="/members/me/profile/change-cover-image/"><svg aria-hidden="true" data-prefix="far" data-icon="image" class="svg-inline--fa fa-image fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 64H48C21.49 64 0 85.49 0 112v288c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V112c0-26.51-21.49-48-48-48zm-6 336H54a6 6 0 01-6-6V118a6 6 0 016-6h404a6 6 0 016 6v276a6 6 0 01-6 6zM128 152c-22.091 0-40 17.909-40 40s17.909 40 40 40 40-17.909 40-40-17.909-40-40-40zM96 352h320v-80l-87.515-87.515c-4.686-4.686-12.284-4.686-16.971 0L192 304l-39.515-39.515c-4.686-4.686-12.284-4.686-16.971 0L96 304v48z"/></svg>
    
    	</a>
    
    	<a href="/members/me/profile/"><svg aria-hidden="true" data-prefix="fas" data-icon="user-circle" class="svg-inline--fa fa-user-circle fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512"><path fill="currentColor" d="M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm0 96c48.6 0 88 39.4 88 88s-39.4 88-88 88-88-39.4-88-88 39.4-88 88-88zm0 344c-58.7 0-111.3-26.6-146.5-68.2 18.8-35.4 55.6-59.8 98.5-59.8 2.4 0 4.8.4 7.1 1.1 13 4.2 26.6 6.9 40.9 6.9 14.3 0 28-2.7 40.9-6.9 2.3-.7 4.7-1.1 7.1-1.1 42.9 0 79.7 24.4 98.5 59.8C359.3 421.4 306.7 448 248 448z"/></svg>
     	</a>
    	 </div> 
    #1765341
    David
    Staff
    Customer Support

    Hi there,

    you can ignore the Location warning. The element will still get published and will display when your generate_hook_element_display filter conditions apply

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.