humanify

Hope you are still supporting.

I’ve added these console errors that your plug-in emanates, hope that may be of help:

Using Toolbar without label prop is deprecated since version 5.6. Please use ToolbarGroup component instead. See: https://developer.www.ads-software.com/block-editor/components/toolbar/

wp.components.IconButton is deprecated since version 5.4. Please use wp.components.Button instead.

Using custom components as toolbar controls is deprecated since version 5.6. Please use ToolbarItem, ToolbarButton or ToolbarDropdownMenu components instead. See: https://developer.www.ads-software.com/block-editor/components/toolbar-button/#inside-blockcontrols

• This reply was modified 2 years, 9 months ago by humanify.

Hi Frank,

Thanks for the help! Using the noptimize tags for the Facebook SDK script in the header.php solved the problem.

(After some testing, the parts in the content.php work fine without.)

For your reference, this is the part, right after the body opening tag:

<!--noptimize-->		
<script><!-- facebook SDK script -->
  window.fbAsyncInit = function() {
	FB.init({
	  appId            : '-----------',
	  autoLogAppEvents : true,
	  xfbml            : true,
	  version          : 'v2.11'
	});
	  FB.AppEvents.logPageView();
  };

  (function(d, s, id){
	 var js, fjs = d.getElementsByTagName(s)[0];
	 if (d.getElementById(id)) {return;}
	 js = d.createElement(s); js.id = id;
	 js.src = "https://connect.facebook.net/en_US/sdk.js";
	 fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script><!-- END facebook SDK script -->
<!--/noptimize-->

• This reply was modified 6 years, 10 months ago by humanify.
• This reply was modified 6 years, 10 months ago by humanify.

Quick follow up. I’ve now turned HTML optimization back ON, so you could maybe have a look. Here is a
page with the button.

Please note, to clarify. It does only NOT work on IOS devices, like my Iphone 7 or Ipad. It works fine on Chrome or Firefox

Hi, thanks for quick response!

First off. I’m not a huge techie in this regard. I’ve added the Facebook SDK in my webpage header, and added a button in my content.php (part of my template). According to the example that I added in the first link above. I deviated from the example by chaning the href to window.location.href to call the actual page URL.

When I installed autoptimize, the share button stopped working. I’ve tried turning off each of the Autoptimize options to see what caused it. Turns out that only turning off HTML optimization made it appear again. Leaving CSS and JS on does not create problems.

What should it do?
It should open the facebook OpenGraph dialog to share the current page. Current behavior is that it loads the dialog in a new tab.

What does it do instead?
When HTML optimization is turned on: the button activates, but does not load anything.

I do not know what specifically cause the breaking. But I suspect its the facebook scripts paired with the button in the content.php which generates the html.