How to make a Simple Change to Layout of my Header

Good morning! I would like to make a simple change to the layout of my site's (puregoldfish.com) header. I have figured out how to align the search bar to the left, but not how to get the sign in/sign up links and Woocommerce cart down in my header instead of on top.

(Sorry, I'm kind of a dunce at this stuff.)

Thanks in advance!
- Meredith

  • Adam Czajczyk

    Hey Meredith,

    I hope you're well today and thank you for your question!

    I took a look at your site and I can think of two solutions here. The simplest one would be to use custom CSS like this:

    .fusion-secondary-menu {position:absolute; top:70px;}
    .fusion-secondary-menu a {color:black!important;z-index:9999!important;}
    .fusion-header .searchform {margin-right:150px;}

    This will move the search form a bit and re-position the sign in/sign up menu. You may want to adjust it a bit. Take a look at screenshot please.

    The better way though would be to create a child theme of your current theme and re-build header.php file a little. I'm not able though to give you a ready-to-go header.php code here at the moment as I'd need to take a look at your current theme's code first.

    If you'd like me to do this, grant me a support access to your site please by following this guide:

    https://premium.wpmudev.org/manuals/wpmu-dev-dashboard-enabling-staff-login/

    Cheers,
    Adam

  • Predrag Dubajic

    Hi Meredith,

    Apologies for the extreme delay on this thread.

    I have played around with Avada theme on my installation and moving the header info could be bit more complicated because of Avada theme complexity.

    What you would need to do is look for this part of code in header.php:
    <div class="fusion-alignright"><?php echo $content_2; ?></div>
    That should be moved after this code:

    if( ! function_exists( 'avada_header_tagline' ) ) {
    	function avada_header_tagline() {
    		return sprintf( '<h3 class="fusion-header-tagline">%s</h3>', do_shortcode( fusion_get_theme_option( 'header_tagline' ) ) );
    	}
    }

    But due to all the functions included there it's not a simple copy/paste job.

    I would suggest contacting Avada theme developers as they should be able to give you detailed explanation of the required changes.

    Thank you,
    Predrag

  • Meredith

    Well, I guess the title of this thread was a little deceiving. The change isn't simple. It would cost me lots of money I don't have. So... I'm going to try to work out something I like within the possible layouts of my theme and keep it simple.

    Instead, I will need to put the header back at the top with the left side being the sign in/ sign up links and the right side be the social links and a google custom search bar (the WPMU plugin one). While my theme does not support a search bar there by default, I believe I can call the custom search with this code:

    <?php the_widget( 'CGS_Widget' ); ?>

    The question would be then, where do I put that code in my header?

    Thanks! (Oh, and sorry for the super messy writing in the screenshot. :stuck_out_tongue:)

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.