Multi Step Checkout - How to get the timeline horizontally text style on mobile

If you want to achieve the same result in the screen below, enter the code in your functions.php

if( function_exists( 'YITH_Multistep_Checkout' ) ){
if( ! function_exists( 'yith_wcms_timeline_template' ) ){
function yith_wcms_timeline_template( $pre ){
if( wp_is_mobile() ){
$pre = 'text';
}
return $pre;
}
}

if( ! function_exists( 'yith_wcms_enqueue_mobile_style' ) ){
function yith_wcms_enqueue_mobile_style(){
$css = "@media(max-width: 480px){#checkout_timeline.text li, #checkout_timeline.text li .timeline-wrapper {display: inline;}}";
wp_add_inline_style( 'yith-wcms-checkout-responsive', $css );
}
}

add_filter( 'pre_option_yith_wcms_timeline_template', 'yith_wcms_timeline_template' );
add_action( 'wp_enqueue_scripts', 'yith_wcms_enqueue_mobile_style', 20 );
}
Was this article helpful?
0 out of 0 found this helpful

Back to Help Center

Powered by Zendesk