Different header on different page

the most comfortable and the most flexible way might be to have two sites :lol
if you like to have only one enfold installation you can reach that via multi-site installation – but this is more or less something for techy-guys.
see here a customer of mine ( it would be possible to have on the one page a left navigation on the other a top one, different logos , different menus etc. pp) Espacially the backup of those pages is a bit more complicated than normal situtation. ( https://naturleben-rheinland.de )
You will have on that case with one Enfold installation two pages with different Enfold Options to setup!

So starting from a normal WordPress / Enfold installation there are different approaches to solve your problem.
if you see this test-environment of mine : https://webers-testseite.de/ click on contact or impressum to see that you can have all kind of headers in one installation by this code if you only want some pages to be different:

to functions.php of your child-theme

add_filter('avf_header_setting_filter','av_change_header_style');
function av_change_header_style($header)
{
    if( is_page('332') ){
        $header['header_position'] = "header_right header_sidebar";
    }
    return $header; 
}

if you like to decide it for each page/post

add_filter('avf_builder_boxes', 'register_meta_boxes', 10, 1);
function register_meta_boxes($boxes){
    $boxes[] = array( 'title' =>__('Layout','avia_framework' ), 'id'=>'layout', 'page'=>array('page' , 'post' , 'portfolio' ), 'context'=>'side', 'priority'=>'low');
return $boxes;
}
add_filter('avf_builder_elements', 'register_meta_elements', 10, 1);
function register_meta_elements($avf_builder_elements){
  $avf_builder_elements[] = array(
    "slug"  => "layout",
    "name"  => __("Menu and Logo Position", 'avia_framework'),
    "desc"  => __("You can choose various different logo and main menu positions here", 'avia_framework'),
    "id"  => "header_layout",
    "type"  => "select",
    "std"   => "",
    "subtype" => array( __('Logo left, Menu right', 'avia_framework')   =>'logo_left main_nav_header menu_right',
              __('Logo right, Menu Left', 'avia_framework')   =>'logo_right main_nav_header menu_left',
              __('Logo left, Menu below', 'avia_framework')   =>'logo_left bottom_nav_header menu_left',
              __('Logo right, Menu below', 'avia_framework')  =>'logo_right bottom_nav_header menu_center',
              __('Logo center, Menu below', 'avia_framework')   =>'logo_center bottom_nav_header menu_right',
              __('Logo center, Menu above', 'avia_framework')   =>'logo_center bottom_nav_header top_nav_header menu_center',
              ));

return $avf_builder_elements;
}

( comment: nav on top – logo under it – had to be corrected a bit with more css – the others will work immediately with given settings)

you will than have on editor of page post on the left the choice to set up header style

different colors are done via quick css
differnet menu maybe Mikes Plugin will help you than

I know this post is a bit dated – it might be appropriate for what I need… with a little more direction.
(Let me know if you want me to start a new post)
I am using Logo center, menu below and Header size = Large via the Admin settings.
I want to keep this for the homepage.
For all the inner pages, I want the Logo left, menu right – with the logo reduced in size so the menu is the main element in the header.
May I get some help with this?
Would creating a template for the inner pages be the wise move? (If so, can you direct me to get me started?)

@Donkies11

… The better solution:
ok – but style the header options for all the other pages – with custom height f.e. 80px !
then put this to your child-theme functions.php

function avf_header_setting_filter_mod($header) {
  if ( is_front_page() ) {
    $header['bottom_menu'] 	= 'header_bottom_menu_active';
    $header['header_layout']      = 'logo_center bottom_nav_header menu_right';
    $header['header_sticky']      = 'header_sticky';
    $header['header_shrinking']   = 'header_shrinking';
    $header['header_stretch']     = 'header_stretch';
    $header['header_size']        = 'custom'; 
    $header['header_custom_size'] 	= '150' ; // if custom size : integer value in px
      // here we do not add classes by .=  but build up all the new needed one
    $header['header_class'] 		=  " av_logo_center av_bottom_nav_header av_menu_right av_header_sticky av_header_shrinking av_header_stretch";  // when adding, it would be important that the first class added has a space in front of it
  }
  return $header;
}
add_filter('avf_header_setting_filter', 'avf_header_setting_filter_mod', 10, 1);

Important to notice : if you like to have a shrinking header – it has to be there on general – and then remove it for those extra pages.
if you set the header custom size to lower than 65 – shrinking is disabled

___________________________________ just for info
these are other options ( no added class is needed on #header )

$header['header_topbar'] 		= 	'header_topbar_active'; 
$header['header_social']   		=   'icon_active_left extra_header_active';  	// or : 'icon_active_right extra_header_active'
$header['header_secondary_menu']   	= 	'secondary_left extra_header_active';		// or : 'secondary_right extra_header_active'
$header['header_phone_active']		= 	'phone_active_left extra_header_active';	// or : 'phone_active_right extra_header_active' 

• This reply was modified 3 years, 2 months ago by Guenni007.

6 different pages with each different headers?
if not – and these 6 pages will have the same header.
you can have a page array on the code above instead of : if ( is_front_page() ) {

all social icons do have consistent link – if they are present.
or could it be that on page1 there is a facebook link different than on page2 etc.

with logo you can do it this way :

add_filter('avf_logo','av_change_logo');
function av_change_logo($logo){
    if( is_page(21) ) {
    	$logo = "http://www.domain.com/wp-content/uploads/logoforpage21.jpg"; 
    }
  
    elseif ( is_page( array( 42, 54, 6 ) ) ) {
    	$logo = "http://www.domain.com/wp-content/uploads/logoforpage22.jpg"; 
    }

    elseif ( is_page() && !is_page(1307) )  {
    	$logo = "http://www.domain.com/wp-content/uploads/logoforpage23.jpg";  
    }
    return $logo;
}

border top color is just css with classes on #top ( .page-id-123 )

no e-mail here on my account – send again please

Btw all social icons do have their own links per organisation (page)

if it is in your widget only ( not the top-heading ) i would install something like: restrict widget and put the different social media links into different widgets.
( or maybe better: https://wordpress.org/plugins/widget-logic/ )

first i would try to have this tree function to have all pages – that are subpages – the same logo

f.e:

function is_tree($pid){
global $post;
   $ancestors = get_post_ancestors($post->$pid);
   $root = count($ancestors) - 1;
   $parent = $ancestors[$root];
   if(is_page() && (is_page($pid) || $post->post_parent == $pid || in_array($pid, $ancestors))){
     return true;
    }
   else{
     return false;
    }
};

function av_change_logo($logo){
      if (is_tree(178)) { $logo = "/wp-content/uploads/2021/08/logo_MEE.png";}
  elseif (is_tree(aaa)) { $logo = "/wp-content/uploads/2021/08/logo_VTV.png";}
  elseif (is_tree(bbb)) { $logo = "/wp-content/uploads/2021/08/logo_JongLeren.png";}
  elseif (is_tree(ccc)) { $logo = "/wp-content/uploads/2021/08/logo_Xtra.png";}
  elseif (is_tree(ddd)) { $logo = "/wp-content/uploads/2021/08/logo_Mooi.png";}
  elseif (is_tree(eee)) { $logo = "/wp-content/uploads/2021/08/logo_JESS.png";}
   return $logo;
}
add_filter('avf_logo','av_change_logo');

you had to replace the aaa – eee with the page id’s.

@steviger :
on the method above you had to think of that every page concerning to mee is subpage of mee. etc.

or if you have not too much pages and subpages etc.
you can give to them a tag

you can activate for all pages / posts the tag option by:

// add tag support to all posttypes
function tags_support_all() {
  register_taxonomy_for_object_type('post_tag', 'page');
}
add_action('init', 'tags_support_all');

function tags_support_query($wp_query) {
  if ($wp_query->get('tag')) $wp_query->set('post_type', 'any');
}
add_action('pre_get_posts', 'tags_support_query');

you now have the opportunity to give each post / page a tag (avoid using two of those tags )

function av_change_logo($logo){
  	  if(has_tag('mee')){ $logo = "/wp-content/uploads/2021/08/logo_MEE.png"; }
  elseif(has_tag('vtv')){ $logo = "/wp-content/uploads/2021/08/logo_VTV.png";}
  elseif(has_tag('jong')){ $logo = "/wp-content/uploads/2021/08/logo_JongLeren.png";}
  elseif(has_tag('xtra')){ $logo = "/wp-content/uploads/2021/08/logo_Xtra.png";}
  elseif(has_tag('mooi')){ $logo = "/wp-content/uploads/2021/08/logo_Mooi.png";}
  elseif(has_tag('jess')){ $logo = "/wp-content/uploads/2021/08/logo_JESS.png";}
  return $logo;
}
add_filter('avf_logo','av_change_logo');

I think that’s how it should work.
You just have to remember to set the tag for the pages you want to create.

Hi Guenni,

Indeed, it works like a charm! And I too do appreciate your time and effort. The issue with the socials in the header, I will tackle with “display none” based on page ID I guess.

Best regards,

Steven

@steviger
on your logo img you got a margin set i think set by yourself in quick css – remove that and try to position it f.e. this way:

.logo img {
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}