Visual composer doesn't load and gives TypeError: _.template(…).trim is not a function

Question

My visual composer plugin doesn't work. It stuck on the loading page. And it gives an error "TypeError: .template(...).trim is not a function" Error is on this line of code: this.$controls = $( .template(template, data, vc.template_options).trim()).addClass('vc_controls');

Please help me to fix this out.

Here is the error which I get:

Answer 1

If you are unable to solve this error by upgrading or downgrading your theme or plugin, you could at least make the below changes.

Open the following two files: 打开以下两个文件：

wp-content\plugins\js_composer\assets\js\frontend_editor\frontend_editor.js
wp-content\plugins\js_composer\assets\js\frontend_editor\custom_views.js

Replace 更换

this.$controls = $( _.template( template, data, vc.template_options ).trim() ).addClass( 'vc_controls' );

this.$controls = $( ( "vc.template_options" ).trim() ).addClass( 'vc_controls' );

This will surely work.

Answer 2

Solution Goto file /wp-content/plugins/js_composer_salient/assets/js/dist/backend.min.js around line 4045:

======> Replace the code

html2element: function(html) {
    var $template, attributes = {},
        template = html;
    $template = $(template(this.model.toJSON()).trim()), _.each($template.get(0).attributes, function(attr) {
        attributes[attr.name] = attr.value
    }), this.$el.attr(attributes).html($template.html()), this.setContent(), this.renderContent()
},

Answer 3

Upgrade to Visual Composer version 4.11.2+

Note Wordpress 4.5 compatibility was fixed on 13th April: https://wpbakery.atlassian.net/wiki/display/VC/Release+Notes

Answer 4

You should try to fix this by up/downgrading your theme/plugin. But if you, like me, can't solve it this way and just need to do a quick hack to get past this particular problem , the following worked for me.

Edit the following two files:

wp-content\plugins\js_composer\assets\js\frontend_editor\frontend_editor.js
wp-content\plugins\js_composer\assets\js\frontend_editor\custom_views.js

Change a single line in each of them, adding () . Change:

this.$controls = $( _.template( template, data, vc.template_options ).trim() ).addClass( 'vc_controls' );

to:

this.$controls = $( _.template( template, data, vc.template_options )().trim() ).addClass( 'vc_controls' );

Answer 5

As Shady sherif said at Maulik's suggestion, this is what I've changed in 2 places at frontend-editor.min.js and it worked!! Thanks to you both!

Change this:

this.$controls=$(_.template(template,data,_.extend({},vc.template_options,{ evaluate:/\{#([\s\S]+?)#}/g})).trim()).addClass("vc_controls");  

With this:

this.$controls=$(("vc.template_options").trim()).addClass("vc_controls");

Answer 6

UPDATE: in current updates none of this is needed just replace the plugin

---

I had problem with WPBakery Page Builder in version 6.0.2.
Wordpress: Version 5.2.1

ERROR: Uncaught TypeError: window.vc.frame_window.jQuery is not a function at window.vc.ShortcodesBuilder.buildFromContent (frontend-editor.min.js? Ver = 6.0.2: 10)
     at Object.vc.build (frontend-editor.min.js? ver = 6.0.2: 10)
     at frontend-editor.min.js? ver = 6.0.2: 10

I was reluctant to upgrade, as there might be a bug. (But it is a fact that an update is bug fix)

Since the update to version 6.0.3 was not successful.

Solution:

Mine was restoring the backup of the whole site.

Tip: Never forget Backup.

Answer 7

This article suggests rolling back your worpress version prior to 4.5. http://forums.artbees.net/t/urgent-wordpress-4-5-broken-vc-backend-editor-workaround-fix-in-comments/2734

This is where you can find older versions of wp to install https://wordpress.org/download/release-archive/30

I haven't tried this myself just a suggestion.

If this is still a problem for you I solved this same error I was getting by manually updating my theme through ftp. I downloaded the latest version of the theme because automatic updates were not working. I kept wordpress version 4.5. Here are the steps I took as follows.

1. I renamed the theme example x-updating once uploaded named the current theme x-previous then changed x-updating to x and deleted x-previous.
2. I updated js_composer the same way as step 1. Uploaded latest version of js_composer which was bundled with the theme. This is updated in plugins outside the theme. At this point you should be able to update visual composer from the wp dashboard if it hasn't already.
3. This got vc working again but left me with some weird errors happening in vc_templates vc_column.php file. I had to manually comment out the trouble code to get the errors to go away.

These 3 steps are a little nerve racking if you are not familiar with uploading files directly to your public_html root directory of your website. Some themes may offer support and do the ftp uploading for you if you provide them with ftp username password.

One more thing to do is clear your cache for your website. In chrome you can clear your cache by going to chrome://settings/cookies enter website.com in the search bar and click remove all clearing all locally stored data for your website. Manual updating themes and plugins is recommended only if auto updates aren't possible then you do the above. For my theme and this same exact error in question I followed these really well-done steps https://community.theme.co/kb/updating-your-theme-and-plugins/ . However this will be different depending which theme you have. And if you would rather roll back your wp version you can follow my original suggestion. But for me I like to have everything new and up-to-date.

One more important note if you do have this theme then I had to delete x-shortcodes plugin from plugins direcotry of my website because my updated theme uses cornerstone instead of x-shortcodes to process important shortcodes to make vc work properly. Another thing to know is none of your data should be harmed while uploading plugins and themes all the data/content is stored safely in your data-base not in your theme.

Answer 8

I tried the following solutions:

• maulik`s (but there was no such files on my plugin folder - frontend_editor.js and custom_views.js, just a "vendors" folder on "/wp-content/plugins/js_composer/assets/js/frontend_editor"),

• Amritosh pandey`s solution (does not work even after cache & history cleaning),

• Berein`s solution (does not work too).

I solved the problem by using a Amritoshpandey's solution: https://gist.github.com/levantoan/519bb0d42c9f7bd6c4d78ef1686bb848 ("The following code has completely corrected my problems, I can load the page, add, clone, remove, etc")

The Amritoshpandey's code should be pasted in /wp-content/plugins/js_composer/assets/js/dist/backend.min.js instead of:

render:function(){var $shortcode_template_el=$("#vc_shortcode-template-"+this.model.get("shortcode"));if($shortcode_template_el.is("script"))this.html2element(_.template($shortcode_template_el.html(),this.model.toJSON(),vc.templateOptions["default"]));else{var params=this.model.get("params");$.ajax({type:"POST",url:window.ajaxurl,data:{action:"wpb_get_element_backend_html",data_element:this.model.get("shortcode"),data_width:_.isUndefined(params.width)?"1/1":params.width,_vcnonce:window.vcAdminNonce},dataType:"html",context:this}).done(function(html){this.html2element(html)})}return this.model.view=this,this.$controls_buttons=this.$el.find(".vc_controls > :first"),this},

Answer 9

If you have Visual Composer 4.9 , just replace these 2 files from archive - frontend-editor.min.js - backend.min.js

path: /wp-content/plugins/js_composer/assets/js/dist

Don't forget to make a backup of your files.

https://yadi.sk/d/JH4cbtnH3UoU3F

click "download add" (tested with VC 4.9 & WP 4.9.5)

Answer 10

I used version 4.10 and upload the file assets/js/frontend-editor.min.js to the same file in 4.12 version.

Note: I keep my version and update only this file. I things this issues risen after update my php version, but i dont sure about that.

That`s work fine.

I get this file here: https://www.downloadfreethemes.io/visual-composer-v5-0-1-page-builder-for-wordpress/

• I have theme license.

Answer 11

Replacing file

> wp-content\plugins\js_composer\assets\js\frontend_editor\frontend_editor.js
> wp-content\plugins\js_composer\assets\js\frontend_editor\custom_views.js

is not a solution, you can download cracked version and resolve it: https://www86.zippyshare.com/v/fguQVId6/file.html

Answer 12

1.请停用插件 2.删除插件文件夹（js_composer 文件夹）中的所有文件 3.下载最新版本的 Visual Composer 4.添加新插件 --> 并选择下载的插件 --> 上传 ---> 激活