Support » Theme: Storefront » Change location of Tawk.to widget via style.css

  • I am using Storefront theme perfectly fine. I want to ask a help. I used tawk.to plugin in my site http://www.sikko.biz . Everything is working fine. But the icon overlaps the ‘My Cart’ icon in the mobile page. I tried to use custom CSS but the property is inside the iframe. Can you please help me to shift this widget icon a bit upper by using property ‘ bottom: 50px !important; ‘ inside the iframe property. I have attached the screenshot too.
    Screenshot

    Thank you

Viewing 4 replies - 1 through 4 (of 4 total)
  • Mikey Arce

    (@mikeyarce)

    Automattic Happiness Engineer

    Hi @biswashkoirala,

    Good question! I think I would actually talk to Tawk.to about this – since their plugin is what’s adding the code to display on that side of your site. My suggestion would be to just not display it on mobile.

    Best,

    Thread Starter biswashkoirala

    (@biswashkoirala)

    Thank you .. I have left it as it is now.. If it disturbs the visitors too much, I will disable in some pages or on mobile devices.

    Thank you
    Best Regards

    you can add a 4th column in bottom bar, as it described here:
    Customize links in the handheld footer bar

    if you want the place at the end, put priority 20

    UPD I was wrong about priority

    • This reply was modified 4 years, 9 months ago by serhiiku.

    or some reason “priority” didn’t work, so I had to swap $new_links and $links in the code and remove the “href” attribute, so the final code looks like this:

    // add a place in footer bar in mobile screeins for chat icon
    add_filter( 'storefront_handheld_footer_bar_links', 'jk_add_chat_link' );
    function jk_add_chat_link( $links ) {
    	$new_links = array(
    		'chat' => array(
    			'priority' => 40,
    			'callback' => 'jk_chat_link',
    		),
    	);
    
    	$links = array_merge( $links, $new_links);
    
    	return $links;
    }
    
     function jk_chat_link() {
    //	echo "  &nbsp  &nbsp";
     echo '<a>' . __( 'Chat' ) . '</a>';
    } 
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Change location of Tawk.to widget via style.css’ is closed to new replies.