141 posts Designer & Developer
  • Elite Author
  • Has been a member for 5-6 years
  • Exclusive Author
  • Sold between 100 000 and 250 000 dollars
  • Referred between 50 and 99 users
  • Bought between 100 and 499 items
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
  • Envato Studio (Microlancer) Beta Tester
Webbu says

Hi,

I want to write this tutorial for help authors which using Zilla Shortcodes;

Step1: Open zilla-shortcodes.php and change codes below;

A – ) Code Block 1;
function add_rich_plugins( $plugin_array )
{
$plugin_array['zillaShortcodes'] = ZILLA_TINYMCE_URI . '/plugin.js';
return $plugin_array;
}

change to

function add_rich_plugins( $plugin_array )
{
if ( floatval(get_bloginfo('version')) >= 3.9){
$plugin_array['zillaShortcodes'] = ZILLA_TINYMCE_URI . '/plugin.js';
}else{
$plugin_array['zillaShortcodes'] = ZILLA_TINYMCE_URI . '/plugin.old.js'; // For old versions of WP
}
return $plugin_array;
}

B – ) Code Block 2; on line 89

wp_enqueue_script( 'zilla-popup', ZILLA_TINYMCE_URI . '/js/popup.js', false, '1.0', false );

change to

if ( floatval(get_bloginfo('version')) >= 3.9){
wp_enqueue_script( 'zilla-popup', ZILLA_TINYMCE_URI . '/js/popup.js', false, '1.0', false );
}else{
wp_enqueue_script( 'zilla-popup', ZILLA_TINYMCE_URI . '/js/popup.old.js', false, '1.0', false );
//For older versions of WP
}

Step 2: Rename these to files below;
1-) tinymce > js > popup.js to popup.old.js (keep original one for change)
2-) tinymce > plugin.js to plugin.old.js (keep original one for change)

Step 3: Change tinymce > plugin.js like sample below for new Tinymce; https://github.com/webbudesign/ZillaShortcodeWP3.9/blob/master/plugin.js

Step 4: Find and change tinymce > js > popup.js code below (line146-150);

if(window.tinyMCE)
{
window.tinyMCE.execInstanceCommand('content', 'mceInsertContent', false, $('#_zilla_ushortcode', form).html());
tb_remove();
}

change to

if(parent.tinymce)
{                parent.tinymce.activeEditor.execCommand('mceInsertContent',false,$('#_zilla_ushortcode', form).html());
tb_remove();
}

That is it. Now this shortcodes will work with old WP and new v3.9 . Hope this helps..

72 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Serbia
  • Sold between 50 000 and 100 000 dollars
jezh says

Hey Webbu thanks for the tut, much appreciated ;)

I went through all the steps with a fresh download of Zilla Shortcodes, and while the button does appear, I only get two shortcodes listed in the dropdown menu – Alerts and Buttons, and when clicking on Buttons shortcode I get this warning:

Warning: Invalid argument supplied for foreach() in zilla-shortcodes-1.2\tinymce\shortcodes.class.php on line 65

Any ideas on what’s going on?

I swear they couldn’t pick a worse moment for updating the WP, all of the plugins and frameworks I started using, broke down due to TinyMCE 4.0 :D

72 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Serbia
  • Sold between 50 000 and 100 000 dollars
jezh says

I see now that you listed the only two shortcodes in the dropdown, but still not sure why the warning…

26 posts
  • Elite Author
  • Has been a member for 4-5 years
  • Exclusive Author
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Bought between 10 and 49 items
  • Referred between 50 and 99 users
  • Sold between 100 000 and 250 000 dollars
Softwebmedia says

Hey Webbu thanks for the tut, much appreciated ;)

I went through all the steps with a fresh download of Zilla Shortcodes, and while the button does appear, I only get two shortcodes listed in the dropdown menu – Alerts and Buttons, and when clicking on Buttons shortcode I get this warning:

Warning: Invalid argument supplied for foreach() in zilla-shortcodes-1.2\tinymce\shortcodes.class.php on line 65

You have to use exact “value” words in identifier… for example “alert” and “button”

Old

a.addWithPopup( b, "Alerts", "alert" );
a.addWithPopup( b, "Buttons", "button" );

New ( identifier: ‘alert’, identifier: ‘button’ )

{text: 'Alerts',onclick:function(){
editor.execCommand("zillaPopup", false, {title: 'Alerts',identifier: 'alert'})
}},
{text: 'Buttons',onclick:function(){
editor.execCommand("zillaPopup", false, {title: 'Buttons',identifier: 'button'})
}},

Thank you Webbu for the perfect solution for Zilla Shortcodes plugin :)

141 posts Designer & Developer
  • Elite Author
  • Has been a member for 5-6 years
  • Exclusive Author
  • Sold between 100 000 and 250 000 dollars
  • Referred between 50 and 99 users
  • Bought between 100 and 499 items
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
  • Envato Studio (Microlancer) Beta Tester
Webbu says


Hey Webbu thanks for the tut, much appreciated ;)

I went through all the steps with a fresh download of Zilla Shortcodes, and while the button does appear, I only get two shortcodes listed in the dropdown menu – Alerts and Buttons, and when clicking on Buttons shortcode I get this warning:

Warning: Invalid argument supplied for foreach() in zilla-shortcodes-1.2\tinymce\shortcodes.class.php on line 65

You have to use exact “value” words in identifier… for example “alert” and “button”

Old

a.addWithPopup( b, "Alerts", "alert" );
a.addWithPopup( b, "Buttons", "button" );

New ( identifier: ‘alert’, identifier: ‘button’ )

{text: 'Alerts',onclick:function(){
editor.execCommand("zillaPopup", false, {title: 'Alerts',identifier: 'alert'})
}},
{text: 'Buttons',onclick:function(){
editor.execCommand("zillaPopup", false, {title: 'Buttons',identifier: 'button'})
}},
Thank you Webbu for the perfect solution for Zilla Shortcodes plugin :)

+1 right.

You’re welcome. :)

One more small tip: (For put button image icon)

Open tinymce / css / popup.css and add below line:

.mce-i-zilla_button{background-image:url(../images/icon.png)!important; background-repeat:no-repeat; background-color:transparent; background-position:center center}

Then you can change images / icon.png with your logo.

1067 posts
  • Forum Superstar
  • Most Wanted Bounty Winner
  • Envato Studio (Microlancer) Beta Tester
  • Author had a Free File of the Month
  • Bought between 50 and 99 items
  • Referred between 50 and 99 users
  • Europe
  • Has been a member for 3-4 years
  • Exclusive Author
+1 more
Smartik says
Use version_compare.
if ( version_compare(get_bloginfo('version')), 3.9 '>=' ) {
72 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Serbia
  • Sold between 50 000 and 100 000 dollars
jezh says

Yeah, got it now, works like a charm. Many thanks Webbu, you’re a life saver!

141 posts Designer & Developer
  • Elite Author
  • Has been a member for 5-6 years
  • Exclusive Author
  • Sold between 100 000 and 250 000 dollars
  • Referred between 50 and 99 users
  • Bought between 100 and 499 items
  • Author had a File in an Envato Bundle
  • Most Wanted Bounty Winner
  • Envato Studio (Microlancer) Beta Tester
Webbu says

Yeah, got it now, works like a charm. Many thanks Webbu, you’re a life saver!

Good.. :) You’re welcome.

72 posts
  • Bought between 10 and 49 items
  • Exclusive Author
  • Has been a member for 4-5 years
  • Serbia
  • Sold between 50 000 and 100 000 dollars
jezh says

Did anybody who tried this fix experienced this bug – when switching between the Visual and Text editor a couple of times in TinyMCE, both toolbars become visible and I can’t access the Text editor, as if the tab button is dead. When I disable the Zilla plugin it goes back to normal…

Any ideas what might be causing this?

I tried the Zilla Shortcodes plugin fix on a fresh install and with Twentyfourteen theme…

Other than this, everything works as it should…

1 post
  • Bought between 1 and 9 items
  • Exclusive Author
  • Has been a member for 2-3 years
  • Serbia
Deejan says

Thanks a lot for this tutorial Webbu

If anyone need shortcode to be inserted directly into the editor without popup can use this code inside plugin.js:

{text: 'Subtitle',onclick:function(){
    editor.execCommand("mceInsertContent", false, '[subtitle]Put Your Tittle Here.[/subtitle]')
}},

Did anybody who tried this fix experienced this bug – when switching between the Visual and Text editor a couple of times in TinyMCE, both toolbars become visible and I can’t access the Text editor, as if the tab button is dead. When I disable the Zilla plugin it goes back to normal…

Any ideas what might be causing this?

I tried the Zilla Shortcodes plugin fix on a fresh install and with Twentyfourteen theme…

Other than this, everything works as it should…

I’m getting the same bug switching between visual and the text editor

by
by
by
by
by
by