I am pulling my hair out trying to replace the default StoreFront Theme header with a custom header created using Elementor (using a shortcode). However, my code only seems to replace the default nav buttons with blank spaces.
Any ideas on what I am mising?
My code:
add_action('init', 'replace_header' );
function replace_header(){
remove_action( 'storefront_header', 'storefront_primary_navigation', 'storefront_before_site', 'storefront_before_header', 50 );
add_action('storefront_header', 'my_custom_header', 50);
}
function my_custom_header(){
do_shortcode('[elementor-template id="59"]')
}
Here is the default Storefront header.php file:
<?php
/**
* The header for our theme.
*
* Displays all of the <head> section and everything up till <div id="content">
*
* @package storefront
*/
?><!doctype html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
<link rel="profile" href="http://gmpg.org/xfn/11">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<?php do_action( 'storefront_before_site' ); ?>
<div id="page" class="hfeed site">
<?php do_action( 'storefront_before_header' ); ?>
<header id="masthead" class="site-header" role="banner" style="<?php storefront_header_styles(); ?>">
<div class="col-full">
<?php
/**
* Functions hooked into storefront_header action
*
* @hooked storefront_skip_links - 0
* @hooked storefront_social_icons - 10
* @hooked storefront_site_branding - 20
* @hooked storefront_secondary_navigation - 30
* @hooked storefront_product_search - 40
* @hooked storefront_primary_navigation_wrapper - 42
* @hooked storefront_primary_navigation - 50
* @hooked storefront_header_cart - 60
* @hooked storefront_primary_navigation_wrapper_close - 68
*/
do_action( 'storefront_header' ); ?>
</div>
</header><!-- #masthead -->
<?php
/**
* Functions hooked in to storefront_before_content
*
* @hooked storefront_header_widget_region - 10
*/
do_action( 'storefront_before_content' ); ?>
<div id="content" class="site-content" tabindex="-1">
<div class="col-full">
<?php
/**
* Functions hooked in to storefront_content_top
*
* @hooked woocommerce_breadcrumb - 10
*/
do_action( 'storefront_content_top' );
Sorted. This PHP function set worked.
//Delete primary navigation
add_action('init', 'delete_navigation' );
function delete_navigation(){
remove_action( 'storefront_header', 'storefront_primary_navigation', 50 );
}
//Delete header cart
add_action('init', 'delete_cart' );
function delete_cart(){
remove_action( 'storefront_header', 'storefront_header_cart', 60 );
}
//Delete navigation wrapper close
add_action('init', 'delete_wrapper' );
function delete_wrapper(){
remove_action( 'storefront_header', 'storefront_primary_navigation_wrapper_close', 68 );
}