Whatsapp in social share button stopped working - Support | Kriesi.at

Viewing 15 posts - 1 through 15 (of 15 total)

Author

Posts
April 29, 2019 at 3:05 pm #1095307
chrishilli
Participant
Hello!

The Whatsapp button in the social share blog posts stopped working.
It now opens a new page instead of sharing to whatsapp.

My functions.php from the child theme is:
```
<?php

/*
* Add your own functions here. You can also copy some of the theme functions into this file. 
* WordPress will use those functions instead of the original functions then.
*/

// Register new icon as a theme icon
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);
function avia_add_custom_icon($icons) {
	$icons['whatsapp']	 = array( 'font' =>'whatsapp-font-icon', 'icon' => 'ue800');
	return $icons;
}

//Adjust icons
add_filter('avia_filter_social_icons', 'avia_filter_social_icons_mod', 10, 1);
function avia_filter_social_icons_mod($icons) {
	$icons['Whatsapp'] = 'whatsapp';
	return $icons;
}

//Add items on the social share section
add_filter('avia_social_share_link_arguments', 'avia_add_social_share_link_arguments', 10, 1);
function avia_add_social_share_link_arguments($args)
{
	$args['whatsapp'] = array("encode"=>true, "encode_urls"=>false, "pattern" => "whatsapp://send?text=[title]&url=[permalink]", 'label' => __("Auf Whatsapp teilen",'avia_framework'));
	return $args;
}
```
Regards

Chris
April 30, 2019 at 8:03 am #1095643
Victoria
Inactive Moderator
Hey chrishilli,

Please post us your login credentials (in the “private data” field), so we can take a look at your backend.
1. Install and activate ” Temporary Login Without Password “.
2. Go to ” Users > Temporary Logins ” on the left-side menu.
3. Click ” Create New “.
4. Add the email address for the account ( you can use (Email address hidden if logged out) ), as well as the ” Role ” making that the highest possible and the expiry about four days
  ( do be sure that we have enough time to debug ).
5. Click ” Submit “.
6. You’ll now have a temporary account. Please provide us here in the private section the URL, so we can login and help you out.
When your issue is fixed, you can always remove the plugin!
If you prefer to not use the plugin, you can manually create an admin user and post the login credentials in the “private data” field.

Best regards,
Victoria
April 30, 2019 at 9:38 am #1095678

chrishilli
Participant

Data in privat content reply.

May 3, 2019 at 9:28 am #1096812

Victoria
Inactive Moderator

Hi chrishilli,

Well, I see that href value is stripped out. Was it working in Enfold 4.5.5?

Best regards,
Victoria

May 3, 2019 at 9:35 am #1096815

chrishilli
Participant

Yes, it was working with Enfold 4.5.5. It´s broken since the update. I have no idea why because in functions.php the href link is correct.

May 5, 2019 at 10:55 am #1097385

Günter
Keymaster

Hi,

With 4.5.6 we added for security reasons function esc_url(..) which WP uses to filters for valid protocols (see wp-includes\functions.php wp_allowed_protocols() ).

And whatsapp is not a valid protocoll.

You can use filter kses_allowed_protocols (see see wp-includes\functions.php line 5738) to add whatsapp.

Best regards,
Günter

May 24, 2019 at 5:57 pm #1103959
chrishilli
Participant
Sorry for the late reply!

I did some tests with kses_allowed_protocols but finally i must have missed something.
I added following to the child themes functions.php
```
function custom_add_more_protocols( $protocols ){
	$protocols[] = 'whatsapp';
	return $protocols;
}
add_filter( 'kses_allowed_protocols' , 'custom_add_more_protocols' );
```
The link is now visible and also there is a sharing function. But the url is missing and not send. Only the title.

Can you give me a hint to solve that.
May 27, 2019 at 2:49 pm #1104522
Tim
Participant
Hey chrishilli,

This worked for me:
```
/*Add items on the social share section*/
add_filter('avia_social_share_link_arguments', 'avia_add_social_share_link_arguments', 10, 1);
function avia_add_social_share_link_arguments($args)
{
	$args['whatsapp'] = array("encode"=>true, "encode_urls"=>false, "pattern" => "whatsapp://send?text=[permalink]", 'label' => __("Deel via WhatsApp",'avia_framework'));
	return $args;
}
```
May 27, 2019 at 3:15 pm #1104527
Tim
Participant
but is only working on mob if it must work on desktop the code has to be:
```
add_filter('avia_social_share_link_arguments', 'avia_add_social_share_link_arguments', 10, 1);
function avia_add_social_share_link_arguments($args)
{
	$args['whatsapp'] = array("encode"=>true, "encode_urls"=>false, "pattern" => "https://web.whatsapp.com/send?text=[permalink]", 'label' => __("Deel via WhatsApp",'avia_framework'));
	return $args;
}
```
Is there a way to combine this?
May 27, 2019 at 4:19 pm #1104543

chrishilli
Participant

Thank you Tim!

“Is there a way to combine this?”

This is the question. It doesn´t make sense to offer a whatsapp share button and it only works on mobile or desktop. If there is a button it should work in any case.

May 30, 2019 at 3:40 am #1105318
Ismael
Moderator
Hi,

Thank you for the update.

You can use the wp_is_mobile function to load the appropriate URL pattern for desktop and mobile device.
```
// set whatsapp url pattern
add_filter('avia_social_share_link_arguments', 'avia_social_share_link_arguments_mod', 10, 1);
function avia_social_share_link_arguments_mod($args)
{
    $pattern = 'https://web.whatsapp.com/send?text=[permalink]';

    if ( wp_is_mobile() ) {
        $pattern = 'whatsapp://send?text=[permalink]';
    } 

	$args['whatsapp'] = array("encode"=>true, "encode_urls"=>false, "pattern" => $pattern, 'label' => __("Deel via WhatsApp",'avia_framework'));
	return $args;
}
```
Best regards,
Ismael
May 31, 2019 at 12:53 pm #1105669

allaith
Participant

I’m also looking to add the whatsapp icon, can you share the latest code (all of it including fixes) to include in functions.php that worked for you please?

June 2, 2019 at 3:04 am #1106225

Rikard
Keymaster

Hi allaith,

Did you try the code Ismael posted?

Best regards,
Rikard

June 5, 2019 at 9:15 am #1107427
chrishilli
Participant
Hi allaith!

This is the code i use now and which is working.
All the whatsapp relevant parts
```
// Register new icon as a theme icon
add_filter('avf_default_icons','avia_add_custom_icon', 10, 1);
function avia_add_custom_icon($icons) {
	$icons['whatsapp']	 = array( 'font' =>'whatsapp-font-icon', 'icon' => 'ue800');
	return $icons;
}

//Adjust icons
add_filter('avia_filter_social_icons', 'avia_filter_social_icons_mod', 10, 1);
function avia_filter_social_icons_mod($icons) {
	$icons['Whatsapp'] = 'whatsapp';
	return $icons;
}

// set whatsapp url pattern
add_filter('avia_social_share_link_arguments', 'avia_social_share_link_arguments_mod', 10, 1);
function avia_social_share_link_arguments_mod($args)
{
    $pattern = 'https://web.whatsapp.com/send?text=[permalink]';

    if ( wp_is_mobile() ) {
        $pattern = 'whatsapp://send?text=[permalink]';
    } 

	$args['whatsapp'] = array("encode"=>true, "encode_urls"=>false, "pattern" => $pattern, 'label' => __("Deel via WhatsApp",'avia_framework'));
	return $args;
}

function custom_add_more_protocols( $protocols ){
	$protocols[] = 'whatsapp';
	return $protocols;
}
add_filter( 'kses_allowed_protocols' , 'custom_add_more_protocols' );
```
And use this in quick-css to style the whatsapp button.
```
/* Whatsapp button color */
#top #wrap_all .av-social-link-whatsapp:hover a {
color: #ffffff;
background-color: #3bb528;
}
```
June 5, 2019 at 1:40 pm #1107550

Victoria
Inactive Moderator

Hi chrishilli,

Thank you for sharing! :)

@allaith Please let us know if you got it working with the solution posted above.

If you need further assistance please let us know.
Best regards,
Victoria
Author

Posts

Viewing 15 posts - 1 through 15 (of 15 total)

You must be logged in to reply to this topic.