Docs

[xponent21]

I would like to add my logo above the search box that comes up when clicking search in the menu. I couldn’t find the source files to change.

Thanks

[Paul R]

Hi,

Thanks for writing in!

You can add this in your child theme’s functions.php

function x_navbar_searchform_overlay() {

    if ( x_get_option( 'x_header_search_enable' ) == '1' ) :

      ?>

      <div class="x-searchform-overlay">
        <div class="x-searchform-overlay-inner">
          <div class="x-container max width">
            <div class="my-logo"><img src="http://demo.theme.co/integrity-5/wp-content/uploads/sites/28/2016/06/five21.png"></div>
            <form method="get" id="searchform" class="form-search center-text" action="<?php echo esc_url( home_url( '/' ) ); ?>">
              <label for="s" class="cfc-h-tx tt-upper"><?php _e( 'Type and Press &ldquo;enter&rdquo; to Search', '__x__' ); ?></label>
              <input type="text" id="s" class="search-query cfc-h-tx center-text tt-upper" name="s">
            </form>
          </div>
        </div>
      </div>

      <?php

    endif;

  }

Change http://demo.theme.co/integrity-5/wp-content/uploads/sites/28/2016/06/five21.png with the url of your logo.

Hope that helps

[xponent21]

Did that, but now search doesn’t work at all:

https://nemobility.com/dev-nemo/

Thanks for your help.

[Jade]

Hi there,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

[xponent21]

This reply has been marked as private.

[Darshana]

Hi there,

Remove that code and then, could you please try adding the following CSS rules into your Customizer, Custom > CSS area change the path to your logo.

.x-searchform-overlay {
    background-image: url("http://demo.theme.co/integrity-5/wp-content/uploads/sites/28/2016/06/five21.png");
    background-position: center top;
    background-repeat: no-repeat;
}

Hope that helps.

[Author]

Posts