Tagged: 

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

    Hi, so as my title says, i just need to change the color of the header on a single page of my website. Everything else remains the same. I tried searching the forums, but couldn’t find anything that helped me. How do i do that?

    #1463797

    Hey SenGaxD,
    Please try using the Enfold Options > General Styling > Logo Area > Logo Area Background Color
    Screen Shot 2024 08 04 at 3.55.44 PM
    If this doesn’t help, please link to your page so we can help with custom CSS.

    Best regards,
    Mike

    #1463861

    and by colour is meant the background colour of the header – as Mike already suspected?

    you can look what selectors the background-color of the header is for. and change it via that page-id of your single page.

    #top.page-id-46970 .header_color .header_bg {
      background-color: green
    }
    
    #top.page-id-46970 .header_color .container_wrap_meta {
      background-color: green
    }

    ____________________________

    or you can change f.e. the variable that is set by enfold options ( like mike above shows )
    these colors are for header:
    –enfold-header-color-bg
    –enfold-header-color-bg2

    where bg is header background-color – and bg2 is header_meta background-color

    you can change these settings via filter for one single page only by:

    ( because the page / post ID goes to the html as class: html_entry_id_12345 we can use that as selector )

    function my_avf_dynamic_css_after_vars($output = ''){
      $output .= "\n";
      /*** Override a defined var for a specific page id*/
      $output .= "html.html_entry_id_46970  {\n";
      $output .=    "--enfold-header-color-bg: #aaa;\n";
      $output .=    "--enfold-header-color-bg2: #aaa;\n";
      $output .= "}\n";
      return $output;
    }
    add_filter( 'avf_dynamic_css_after_vars', 'my_avf_dynamic_css_after_vars', 10, 1 );

    replace the color #aaa to your wanted values.

    Once the code snippet has been successfully entered, the page/browser caching must be refreshed.

    you find the page-id-xyz or postid-xyz on the body tag. You had to adjust the codes above to your id and wanted colors.

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