• Skip to main content
  • Skip to primary sidebar

WordPress, Genesis Framework and Storefront customization tutorials

  • Archive
    • Genesis
    • WooCommerce
    • WordPress
  • Premium
  • Blog
  • About
    • Tools I Use
  • Contact
  • Login
Home » menu

menu

How to display different menu for logged-in users

2020-11-11 by Gabor Leave a Comment

Put this snippet in the functions.php

Filed Under: WordPress Tagged With: menu

Hamburger Menu Toggle Animation 1

2020-08-06 by Gabor Leave a Comment

View Demo

This content is FREE, but You need to register to view the full content.

If You are already a member, please log in below:

 
 
Forgot Password

Filed Under: Subscribers, UI / UX Tagged With: animation, menu

Hamburger Menu Toggle Animation 2

2020-08-05 by Gabor Leave a Comment

View Demo

This content is FREE, but You need to register to view the full content.

If You are already a member, please log in below:

Filed Under: Subscribers, UI / UX Tagged With: animation, menu

Hamburger Menu Toggle Animation 3

2020-08-01 by Gabor Leave a Comment

View Demo

This content is FREE, but You need to register to view the full content.

If You are already a member, please log in below:

Filed Under: Subscribers, UI / UX Tagged With: animation, menu

How to align Storefront navigation beside the logo

2019-12-09 by Gabor Leave a Comment

1) Add this snippet to functions.php

// =========================================================================
//CHANGE DEFAULT STOREFRONT HEADER LAYOUT 
// =========================================================================
function remove_storefront_actions() {
    remove_action( 'storefront_header', 'storefront_product_search', 40 );
    remove_action( 'storefront_header', 'storefront_primary_navigation', 50);
    remove_action( 'storefront_header', 'storefront_secondary_navigation', 30);
    remove_action( 'storefront_header', 'storefront_header_cart', 60 );
}
add_action( 'init', 'remove_storefront_actions' );
 
add_action( 'storefront_header', 'storefront_header_cart', 40 );
add_action( 'storefront_header', 'storefront_primary_navigation', 30);

2) CSS

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {  
.woocommerce-active .site-header .site-branding {
	width: 20% !important;
}
   
    .woocommerce-active .site-header .site-header-cart {
	width: 15%;
}
.site-header .col-full {
	padding: 0 !important;
	max-width: 100% !important;
	margin: auto;
	display: flex;
}
    
}/*END*/

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 
  .site-header .col-full {
	max-width: 90% !important;
}
    
}/*END*/

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
.site-header .col-full {
	max-width: 90% !important;
}
    .woocommerce-active .site-header .main-navigation {
	width: 70% !important;
}
}/*END*/
    
    /* XXL Large devices*/
@media (min-width: 1400px) { 
.site-header .col-full {
	max-width: 80% !important;
    }
    .woocommerce-active .site-header .main-navigation {
	width: 60% !important;
}
}/*END*/

Filed Under: Free Content Tagged With: header, menu, navigation

Primary Sidebar

  • Facebook
  • GitHub
  • Instagram
  • LinkedIn
  • Twitter
  • YouTube
WP Rocket - WordPress Caching Plugin
UpdraftPlus Premium

Disclosure: Some of the links in this site are affiliate links. I will be paid a commission if you use this link to make a purchase.

  • Privacy Policy
  • Flames Design
© 2021 WP Flames - All Right Reserved