Sunday, February 5, 2017

[Solved] After upgrading WP Bakery Visual Composer does not work in latest wordpress 4.7.2


I used visual composer one of my wordpress website version 4.1. After then 1 year later I upgraded our wordpress version to 4.7.2. Then I noticed that visual composer was not working. When I clicked on the backend editor I saw visual composer icon was loading and nothing happend-





In the console I can see this error -

"Uncaught TypeError: $template.get is not a function"



To solve this go to this directory /wp-content/plugins/js_composer/assets/js/backend/composer-view.js here you can see "render: function ()". Please replace it to -

render: function () {
            var $shortcode_template_el = $( '#vc_shortcode-template-' + this.model.get( 'shortcode' ) );
            if ( $shortcode_template_el.is( 'script' ) ) {
                var newHtmlCode =  _.template( $shortcode_template_el.html(),
                                                this.model.toJSON(),
                                                vc.templateOptions.default );
                if(!_.isString(newHtmlCode)){
                    newHtmlCode = $shortcode_template_el.html();
                }
                this.html2element( newHtmlCode );
            } 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 );
                } );
            }
            this.model.view = this;
            this.$controls_buttons = this.$el.find( '.vc_controls > :first' );
            return this;
        },


Now this is my new composer-view.js file - https://gist.github.com/Mashpy/fc75065c845c5689ac8058c2c597c18a


Then reload the admin panel and click on the backend editor. Hope it will work. There are so many solution on online. But noting works. I have found this solution here - http://stackoverflow.com/a/39959164 and this works for my site perfectly.




19 comments:

  1. Works! Congratulations for your post!

    ReplyDelete
  2. Hey!
    I would like to use that solution as well, same problem.. Is there a more detailed description for people who are not that deep into programming? I don't really know where to search for directory /wp-content/plugins/js_composer/assets/js/backend/composer-view.js.
    Would be great!

    ReplyDelete
    Replies
    1. Thanks for you suggestion. Next time I will try to write more details.

      Delete
  3. I am not able to resolve the issue.

    I am using WordPress 4.7.2, Jupiter theme 5.6 and Visual Composer version 5.0.2
    There is no such directory as backend or such a file called composer-view.js in the latest version of Visual Composer.

    same error :(

    ReplyDelete
    Replies
    1. Can you check on /wp-content/plugins/js_composer/assets/js/backend/composer-view.js ?

      Or can you send me the directory structure of composer-view?

      Delete
  4. Hi Mashpy, I have same situation as you except just bought a theme with the VC included. It has not yet worked for me - it goes to a white screen with cycling VC logo. Your fix sounded good but when I went to do it, no backend directory in js! So, not to miss an opportunit, I made a backend directory and uploaded your file to it. Bit of a wild guess as I don't know what else is supposed to be in that dir nor why I didn't have one. Anyway, same result so dipped out there. Any other info you could share re detecting the problem - where did you find the error, via cPanel somewhere?
    I have VC 5.0.1 and WP 4.7.2 and just installed Futurico theme. Thanks for any tips you can provide. ...Vince

    ReplyDelete
    Replies
    1. As you have no "backend" directory, can you find is there any file like "composer-view.js" ?

      Delete
  5. I searched for it on cPanel and doesn't exist. I should've mentioned! Also in the link to where you got the solution from I saw later post explaining later releases of VC don't contain this directory. I did get a partial solution to my own issues. If I press Shift F5 to force a complete page refresh in the admin screen the VC button comes in (wasn't there before) and the Backend one works. Frontend still the same rolling logo on white. Shift F5 on any web page (for those that don't know) is a much more useful solution than the standard "delete all cookies and cache answer to misbehaving pages as this fixes 90% of the problem.

    I also tried VC's recommended solution of deleting the plugin then reinstalling it as a required plugin for the theme. No apparent change. At this stage I was so over the issues with the theme that made me think maybe VC was the way to solve them I went back to a free theme, which VC stayed active as I had originally got it as part of a paid theme. I put three different themes on before settling on one I will go with and every one had a non-functional Frontend but Backend was fine. With the free theme I don't need VC anyway so unlikely to upgrade to a full licence, which many say does fix all these problems.

    I am guessing the issue is something about how the paid theme legitimises VC for use with their theme. Obviously none of the free themes would have this capacity; my suspicion is the paid theme has stuffed this up in some way. This was Futurico, which turns out to be only any good for fresh installs, not application to existing sites. They are about to do a major version update and maybe this will change, but the support guy I have been dealing with - I may as well asked my 5yo grandkid for help...

    ReplyDelete
    Replies
    1. Right. Also I am facing the same problem. This solution only fix the backend issue not frontend. Still now I am finding how to solve the frontend issue.

      Delete
  6. Well I have given up on the theme and deleted VC and gone the refund route. I don't need to solve programming errors of others. I am pretty sure from what I saw the issue is how the theme seller has tied in their VC licence and there is some problem there, or I would not get exactly the same behaviour with installs in free and paid themes. In fairness to my paid theme provider if I put a new wp site up and imported their data it worked fine. But when I simply activate their theme it didn't work. Pressing Shift F5 got the backend, dunno what that is about as I was also losing all the carriage returns which if I posted without noticing I had to manually put them back, but hit Shift F5 and no worries, all edited good. So it may be a plugin from another theme and the standard WP advice is to disable all plugins and put them back one at a time to find the culprit. I didn't bother with that because this was not the biggest issue with the theme implementation... So good luck...

    ReplyDelete
  7. I'm using Wordpress v.4.5.3 and custom theme faculty-responsive-academic-wordpress-theme, the Visual Composer was included in the theme and suddenly it doesn’t seem to be working.

    When i open “Backend Editor" , it shows nothing and click to “Add Elements,” the menu with various VC elements pops up, but nothing is added when I select.

    At Javascript console, it gives me following Error:
    Uncaught TypeError: $template.get is not a function

    The error in coding: line 146 at composer-view.js

    _.each( $template.get( 0 ).attributes, function ( attr ) {
    attributes[ attr.name ] = attr.value;
    } );

    WHAT CAN I DO AND HOW TO RESOLVE THIS ISSUE??
    PLZ HELP

    ReplyDelete
    Replies
    1. In this post already I said what to do if you get message - "Uncaught TypeError: $template.get is not a function". Have you done it what i had written in this tutorial?

      Delete
  8. This comment has been removed by the author.

    ReplyDelete
  9. This comment has been removed by the author.

    ReplyDelete
  10. Thank you my elements work, but now I'm trying to add a background image to a row and the images don''t load even a single image doesnt load, is there any fix for this?

    ReplyDelete
    Replies
    1. When you are adding images, can u check on the console is there any javascript error?

      Delete