Title: Customize Storefront theme header
Last modified: November 27, 2016

---

# Customize Storefront theme header

 *  Resolved [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [9 years, 6 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/)
 * Hi,
 * I am using Storefront free theme. I need to change theme header. I like to add
   Social Links before the Site logo and add My Account | Register link after the
   site logo. Also want to remove Search Box.
 * Please let me know how can I edit it.
 * Thanks
    Prasun

Viewing 14 replies - 1 through 14 (of 14 total)

 *  [Dat Hoang](https://wordpress.org/support/users/htdat/)
 * (@htdat)
 * [9 years, 6 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8498532)
 * To remove the search box, you can use this code:
    ` remove_action('storefront_header','
   storefront_product_search', 40);
 * It’d be better to follow this [https://github.com/woocommerce/theme-customisations](https://github.com/woocommerce/theme-customisations)
 *  [Dat Hoang](https://wordpress.org/support/users/htdat/)
 * (@htdat)
 * [9 years, 6 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8498605)
 * For the social links and “My account”, I think you should follow this [https://docs.woocommerce.com/document/create-a-social-icon-menu/](https://docs.woocommerce.com/document/create-a-social-icon-menu/)
 * Or you still want to stick with “before” and “after” your logo. You can use this
   code:
    [https://gist.github.com/htdat/6d8d7201430890699d6a19ee2ea6af8a](https://gist.github.com/htdat/6d8d7201430890699d6a19ee2ea6af8a)(**
   you should use this one**)
 * `
    add_action( 'storefront_header', 'htdat_above_logo', 15 ); function htdat_above_logo(){?
   > <div style="clear: both; text-align: left;"> <span style="margin: 0 0.5em;"
   >[Facebook!](https://www.facebook.com)</span> <span style="margin: 0 0.5em;">
   [Twitter!](https://www.twitter.com)</span> </div> <?php } add_action( 'storefront_header','
   htdat_below_logo', 41 ); function htdat_below_logo() { ?> <div style="clear: 
   both; text-align: left;"> <span style="margin: 0 0.5em;">[My account](https://www.facebook.com)
   </span> <span style="margin: 0 0.5em;">[Register!](https://www.twitter.com)</
   span> </div> <?php }
 * This code is based on [https://docs.woocommerce.com/document/add-static-content-to-the-storefront-header/](https://docs.woocommerce.com/document/add-static-content-to-the-storefront-header/)
    -  This reply was modified 9 years, 6 months ago by [Dat Hoang](https://wordpress.org/support/users/htdat/).
    -  This reply was modified 9 years, 6 months ago by [Dat Hoang](https://wordpress.org/support/users/htdat/).
      Reason: well, too bad to handle the code
 *  Thread Starter [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8516502)
 * Hi Dat,
 * Apology for late reply. Also, thank you very much for taking care of this topic.
   I remove Search Bar via Theme Customization plugin. Now, I am bit confused where
   should I put the code you provided. I understand, add_action functions should
   be placed into storefront-template-hooks.php file. But where do I put the htdat_above_logo()
   and htdat_below_logo() functions. Can you please explain?
 * Thanks again.
    Prasun
 *  [Dat Hoang](https://wordpress.org/support/users/htdat/)
 * (@htdat)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8517768)
 * Both of my code should be added into the Theme Customization plugin.
    Don’t edit
   the theme files, you may lose your edit after updating the theme.
 *  Thread Starter [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8530811)
 * Hi Dat,
 * Thanks for your code. It’s working fine. Only problem is that alignment is not
   working properly. I added Register My Account as Secondary Menu and it appears
   same line as of Logo. But the social Icons are placed above logo. Looks bit odd
   
   [http://yeauxbaby.com/](http://yeauxbaby.com/)
 * Is it possible to declare 3rd menu named social menu and placed it in the sameline
   as logo?
 * Regards
    Prasun
 *  [Dat Hoang](https://wordpress.org/support/users/htdat/)
 * (@htdat)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8540057)
 * If so… you should follow this [https://docs.woocommerce.com/document/create-a-social-icon-menu/](https://docs.woocommerce.com/document/create-a-social-icon-menu/)
 * You don’t need to use my code at all 🙂
 *  Thread Starter [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8540123)
 * Nope. I assigned My Account | Register Menu in the secondary menu position. I
   want Social Menus should be before the logo and in same line as logo and secondary
   menu. Your code worked fantastic. Only thing I need to place the social icons
   in the same line as Logo and Secondary menu and the logo to be Centre of the 
   page.
 *  [Dat Hoang](https://wordpress.org/support/users/htdat/)
 * (@htdat)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8545444)
 * Well. You achieved it somehow 🙂
 * > [View post on imgur.com](https://imgur.com/a/0eT6h)
 *  Thread Starter [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-8545613)
 * 🙂 Yes. Need to edit CSS.
 * .site-header .site-branding { clear: none;}
 * Thanks for your great help with adding the Social Menu.
 *  [nsjagtap](https://wordpress.org/support/users/nsjagtap/)
 * (@nsjagtap)
 * [9 years ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9097334)
 * Hi ! i am trying 2017 free theme, when i go to appearance- header-image-edit 
   and try to paste new image, it does not upload, the comment is “is it writable
   on your server”
    i am total beginner, can you help ?
 *  [bobfries](https://wordpress.org/support/users/bobfries/)
 * (@bobfries)
 * [8 years, 10 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9343925)
 * Odd, this isn’t working for me. It’s as if it comes before the functions of the
   main theme. So if I try to remove and element then add it with a different priority(
   see below), I end up with two of them. Any ideas?
 *     ```
       remove_action( 'storefront_header', 'storefront_product_search', 40 );
       add_action( 'storefront_header', 'storefront_product_search', 10 );
       ```
   
 * Note: Have tried adding this using a child theme, and using the theme customisation
   module, it does the same. If I add the code to the bottom of the main storefront
   functions file it works.
 *  [adminim](https://wordpress.org/support/users/adminim/)
 * (@adminim)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9424939)
 * Hi all,
    [@prasun1519](https://wordpress.org/support/users/prasun1519/) I am 
   trying to add some text after logo . I see you have made this perfectly. Can 
   you please share a code how can I make it on my site. Nevermind I have used [https://docs.woocommerce.com/document/create-a-social-icon-menu/#prettyPhoto](https://docs.woocommerce.com/document/create-a-social-icon-menu/#prettyPhoto)
   🙂
    -  This reply was modified 8 years, 9 months ago by [adminim](https://wordpress.org/support/users/adminim/).
 *  Thread Starter [prasun1519](https://wordpress.org/support/users/prasun1519/)
 * (@prasun1519)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9425017)
 * Please let me see your site url
 *  [mario93](https://wordpress.org/support/users/mario93/)
 * (@mario93)
 * [8 years, 8 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9498950)
 * Hello,
 * I ask your help to reproduce the format of the header of my site with storefront
   like this website [http://www.easycash.fr](http://www.easycash.fr) by adding 
   three buttons just at the bottom of the form search:
 * Thank you in advance.

Viewing 14 replies - 1 through 14 (of 14 total)

The topic ‘Customize Storefront theme header’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/storefront/4.6.2/screenshot.png)
 * Storefront
 * [Support Threads](https://wordpress.org/support/theme/storefront/)
 * [Active Topics](https://wordpress.org/support/theme/storefront/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/storefront/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/storefront/reviews/)

 * 14 replies
 * 6 participants
 * Last reply from: [mario93](https://wordpress.org/support/users/mario93/)
 * Last activity: [8 years, 8 months ago](https://wordpress.org/support/topic/customize-storefront-theme-header/#post-9498950)
 * Status: resolved