Hero Search Form Align center custom

  1. Log into your site
  2. Hero Settings: SEARCH FORM -> Search Form Style:
    + Bottom: 
    Search Form on the bottom position
    + Right of Screen: 
    Search Form on the middle position
  3. Click on Appearance -> Theme Options -> Advanced Settings -> Custom CSS Code -> and use the code below:
    /* Search Form on the bottom position */
    @media (min-width: 993px) {
         .hero_fullWidth__1u0K7 .wil-tab, .hero_fullWidth__1u0K7 .hero_formWrapper__1IuRO {
            position: static;
         }
    }
    /* Search Form on the middle position */
    @media (min-width: 993px) {
        .hero_horizontal__1t27X .hero_textWrapper__aU40s {
            padding-right: 0px;
            text-align: center;
            width: 100%;
            float: none;
        }
    }
    
    @media (min-width: 993px) {
        .hero_horizontal__1t27X .hero_formWrapper__1IuRO, .hero_horizontal__1t27X .wil-tab {
            width: 100%;
    		max-width: 870px;
    		margin-left: auto;
    		margin-right: auto;
            float: none;
        }
    }
    
    @media (min-width: 993px) {
    	.hero_horizontal__1t27X .wil-tab__nav li {
    		width: auto;
    	}
        .hero_horizontal__1t27X [class*="col-"] {
            margin-bottom: 0px;
        }
    	.hero_horizontal__1t27X [class*="col-md-6"] {
            width: 50% !important;
        }
        .hero_horizontal__1t27X [class*="col-sm-5"] {
            width: 41.66666667% !important;
        }
        .hero_horizontal__1t27X [class*="col-sm-4"] {
            width: 33.33333333% !important;
        }
        .hero_horizontal__1t27X [class*="col-sm-3"] {
            width: 25% !important;
        }
    }
    
    .hero_horizontal__1t27X .hero_text__3ENGw {
    	max-width: 650px;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    @media (min-width: 1600px) {
    	.hero_highlight__1JwX3 {
    		padding-top: 15px;
    	}
    }
  4. Put the following code to functions.php of Wilcity Child Theme:
    add_filter('wilcity/hero/search-form-below-category', function(){
         return false;
    });
    
Please follow and like us:

Leave A Comment?