WordPress phpBB mChat integration procedure

User avatar
axew3
w3all User
w3all User
Posts: 2689
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

WordPress phpBB mChat integration procedure

Post by axew3 »

OBSOLETE
1.9.5 has been released and the procedure is available here

This post contain the integration plugin wp_w3all 1.9.5 RC2
and the procedure to fully integrate mChat into WordPress, as widget, as shortcode element iframe on page or as button that toggle the chat:
check online example phpBB mChat into WordPress
At date of this post, the code is suitable for phpBB 3.2.. and latest mChat 2.1.2 (but following procedure, there is no reason to think it will not work fine on any version of phpBB and mChat).
This work both on integration running as Linked users or Not.

Note that all mChat options on phpBB, so for example the option to display or not to a specified user group the chat, affect if integration run as linked users.
So if an user in phpBB can't see the chat, then he can't see nor in wp.
Also note that you need to apply Can view mChat settings on ACP groups permissions. After you choose/select options for the group, click on the APPLY ALL button. Note that you need to do this step even if the option appear as selected or not selected. Choose options that you want to apply and click on APPLY ALL button.

w3all WordPress phpBB mChat integration procedure

before to follow and apply procedure, it is needed to install this 1.9.5 RC3 in attach:
wp-w3all-phpbb-integration_1.9.5_RC1.zip
wp-w3all-phpbb-integration_1.9.5_RC2.zip


(just replace plugin's files with files of this RC release archive: NOTE -> until 1.9.5 or > not released)

Activate the new mChat option on plugin admin page, or activate it after procedure applied:
phpBB mChat integration

on the overall_footer.html of your theme, where this line (or before the other iframe resizer added code):
[code]<!-- INCLUDEJS ajax.js -->[/code]
immediately after ADD this code:
[code]<script>
// a simple mChat style/display example setup for WP
if( /#w3allmchatif/ig.exec(document.URL) != null || /#w3allmchatif/ig.exec(document.location.href) != null ){
$( document ).ready(function() {
$( "#page-header,#page-footer" ).css( { "height" : "0px", "max-height" : "0px", "overflow": "hidden" } ); // can't be none, or events will not affect
$( "body" ).css( "padding", "0px" );
$( ".page-body h2" ).css( "display", "none" );
$( "div.mchat-text blockquote div cite a" ).click(function(e) {
if( /\?jumpto=/ig.exec(this.href) == null ){
e.preventDefault();
window.open(this.href,'_blank');
return;
}
});

$( "div.list-inner span.mchat-title a" ).click(function(e) {
e.preventDefault();
window.open(this.href,'_blank');
return;
});
$( "a[href='#']" ).click(function(e) {
e.preventDefault();
return;
});


$( "body" ).on("click", ".username,.username-coloured,#mchat-legend a,cite a", function(e) {
var href = $(this).attr("href");
if( typeof href != 'undefined' && /\?jumpto=/ig.exec(this.href) == null ){
e.preventDefault();
window.open(href,'_blank');
return;
}
});
});
}
</script>[/code]

Until this part not added by default into overall_footer.html "official" code, would be necessary to prevent that the resizer scroll on chat, so to avoid this, on the overall_footer.html js code you added, this line:
[code] if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top[/code]
should be changed into:
[code]if( typeof w3_chat_phpBBpage == 'undefined' ){ // activate fix for mchat to not scroll
if ('parentIFrame' in window) window.parentIFrame.scrollTo(0,50); // change 50 to another value may 0 or 100 or 500. Top distance gap in px when page scroll top
}[/code]

This will be added on the default overall_footer.html js code when new plugin version released.
(Note that at date of this post, the overall_footer.html js code has been changed several times to fix little issues now resolved.

#########################
If not running iframe mode, then you do not added the overall_footer.html code of the iframe resizer already, then you'll need to add this into your phpBB overall_footer.html template file, just before the closing </body> tag:
[code]<script type="text/javascript" src="https://www.axew3.com/phpBB/iframeResiz ... dow.min.js" defer></script>[/code]
change the URL to fit /point to the file iframeResizer.contentWindow.min.js you go to add into your phpBB root folder. Copy the file iframeResizer.contentWindow.min.js that is contained inside wp_w3all plugin folder
wp/wp-content/plugins/wp-w3all-phpbb-integration/addons/resizer/
and paste it into your phpBB root folder.
#########################

Remember to recompile phpBB template.

Widget and Shortcode
Activate the new mChat widget in WordPress if you want a widget.
To use/activate the shortcode, that will display as button (like on online example) or as element on page where it is applied, you'll use the shortcode in this way:

to display as element on page/post:
[code] [w3allphpbbmchat] [/code]
to display as toggle button:
[code][w3allphpbbmchat mchat_w3_toggle="1"][/code]

You can't use a widget and/or shortcode instance on same page, nor duplicated of the same on same page:
it can be only: one shortcode x page or one widget x page.

OBSOLETE
1.9.5 has been released and the procedure is available here
User avatar
axew3
w3all User
w3all User
Posts: 2689
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: WordPress phpBB mChat integration procedure

Post by axew3 »

The above procedure and plugin files have been updated at date of this post!
New easy procedure, that require NO mChat files to be edited.
User avatar
axew3
w3all User
w3all User
Posts: 2689
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: WordPress phpBB mChat integration procedure

Post by axew3 »

little piece of js code to add into overall_footer.html just updated at date of this post.
xray
User ww
User ww
Posts: 34
Joined: Mon Dec 24, 2018 9:48 pm

Re: WordPress phpBB mChat integration procedure

Post by xray »

I have noticed an issue in mChat regarding any link in the chat. example if you have the latest topic or post showing in the mCaht window and then use the chat window created it will try an open the link within the chat window instead of taking you to the forum. you can see the example on my site if you don't understand.
User avatar
axew3
w3all User
w3all User
Posts: 2689
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: WordPress phpBB mChat integration procedure

Post by axew3 »

AH! i was quite sure that all resolved since this last code:

Code: Select all

<script>
// a simple mChat style/display example setup for WP 
if( /#w3allmchatif/ig.exec(document.URL) != null || /#w3allmchatif/ig.exec(document.location.href) != null ){
$( document ).ready(function() {
$( "#page-header,#page-footer" ).css( { "height" : "0px", "max-height" : "0px", "overflow": "hidden" } ); // can't be none, or events will not affect
$( "body" ).css( "padding", "0px" );
$( ".page-body h2" ).css( "display", "none" );
$( "div.mchat-text blockquote div cite a" ).click(function(e) {
		if( /\?jumpto=/ig.exec(this.href) == null ){
		e.preventDefault();
		window.open(this.href,'_blank');
		return;
	}
});

$( "div.list-inner span.mchat-title a" ).click(function(e) {
		e.preventDefault();
		window.open(this.href,'_blank');
		return;
});
$( "a[href='#']" ).click(function(e) {
		e.preventDefault();
		return;
});


$( "body" ).on("click", ".username,.username-coloured,#mchat-legend a,cite a", function(e) {
	var href = $(this).attr("href");
	if( typeof href != 'undefined' && /\?jumpto=/ig.exec(this.href) == null ){
		e.preventDefault();
		window.open(href,'_blank');
		return;
	}
});
});
}
</script>
any link, you mean an external link like

Code: Select all

[url]http://externalsite.com[/url]
or that point to a post within the board?
ok! let think and add the joke, patching asap!
User avatar
axew3
w3all User
w3all User
Posts: 2689
Joined: Fri Jan 22, 2016 5:15 pm
Location: Italy
Contact:

Re: WordPress phpBB mChat integration procedure

Post by axew3 »

ok, i've just test and if i'm not wrong you mean links within board, like this:
https://localhost/root_integrations/php ... um.php?f=2
assuming we are on localhost. Think you mean this.
Any other link (also just inserted on chat, the latest pushed), i have the right result with above code, but may i've still not understand your point instead, or not try out the issue.

The kind of url like the above will open within the chat, the forum or the linked topic/post, yes.
I had not give a try to this, patching asap.

[EDITED]
Post Reply