Hi. How can we help?

Add Request a quote widget in Avada header

To add the YITH Request a Quote for WooCommerce widget in Avada theme header, please, follow these steps:

First of all, you have to add this code into the functions.php file of Avada (better if it is a child):

//Add our custom widget
add_filter( 'wp_nav_menu_items', 'my_yith_wraq_to_avada_main_nav', 10, 4 );

if ( ! function_exists( 'my_yith_wraq_to_avada_main_nav' ) ) {
function my_yith_wraq_to_avada_main_nav( $items, $args ) {


if ( 'v6' != Avada()->settings->get( 'header_layout' ) ) {
if ( 'main_navigation' == $args->theme_location || 'sticky_navigation' == $args->theme_location ) {

$items .= '<li class="fusion-custom-menu-item yith-wraq">';
$items .= do_shortcode( '[yith_ywraq_mini_widget_quote item_name="" item_plural_name=""]' );
$items .= '</li>';

}
}

return $items;
}
}

Now, the new widget is visible in the header but you have to adjust its style. So, by adding the following snippet, you can make it look like the cart widget:

//customize style
add_action( 'wp_enqueue_scripts', 'my_yith_wraq_style', 25 );
if ( ! function_exists( 'my_yith_wraq_style' ) ) {
function my_yith_wraq_style() {

$css = '
.widget_ywraq_mini_list_quote {
margin: 0 !important;
}

.yith-ywraq-list-widget-wrapper .raq-info {
border: none;
margin: 3px 0 0 0;
padding: 0;
}

.yith-ywraq-list-widget-wrapper .raq-info .handler-label {
display: none;
}

.raq-tip-counter {
position: relative;
}

.raq-tip-counter:before {
content: "\e623";
font-family: icomoon;
font-size: 14px;
}

span.raq-items-number {
position: absolute;
line-height: 11px;
top: -10px;
right: -10px;
padding: 3px;
background-color: ' . Avada()->settings->get( 'primary_color' ) . ';
color: ' . Avada()->settings->get( 'header_sticky_menu_color' ) . ';
border-radius: 50%;
font-size: 11px;
min-width: 17px;
display: block;
text-align: center;
}

.yith-ywraq-list-wrapper {
right: 0;
line-height: normal;
}

.yith-ywraq-list-wrapper .button {
padding: 11px 23px;
line-height: 16px;
font-size: 13px;
font-weight: 700;
color: #ffffff;
background-color: ' . Avada()->settings->get( 'primary_color' ) . ';
text-transform: uppercase;
display: inline-block;
clear: both;
}

.yith-ywraq-list-wrapper ul li {
float: none
}

.yith-ywraq-list-wrapper ul li span.quantity {
display: inline;
border: 0;
}

a.yith-ywraq-item-remove.remove {
font-size: 16px;
}';
wp_add_inline_style( 'yith_ywraq_frontend', $css );

$js = '
jQuery(document).ready(function () {

var list_item = jQuery(".fusion-main-menu > ul > li.yith-wraq");

list_item.find("> .widget").css({
height : list_item.prev().find("> a").css("height"),
"line-height": list_item.prev().find("> a").css("line-height")
});
});';

wp_add_inline_script( 'yith_ywraq_frontend', $js );


}
}

Finally, if you want to hide the cart widget, you can add this snippet:

//remove cart widget
remove_filter( 'wp_nav_menu_items', 'avada_add_woo_cart_to_nav', 10 );
Was this article helpful?
1 out of 1 found this helpful

Back to Help Center >