4

Live Preview isn't working for any kind of entry. Dev or production. I get the following error on chrome's console.

jquery-2.1.1.min.js?d=1409764106:4 
POST http://undiario.dev/ 500 (Internal Server Error)

jquery-2.1.1.min.js?d=1409764106:4 
k.cors.a.crossDomain.send

jquery-2.1.1.min.js?d=1409764106:4 
n.extend.ajax

jquery-2.1.1.min.js?d=1409764106:4 
n.(anonymous function)

craft.js:10520 
Craft.LivePreview.Garnish.Base.extend.updateIframe

jquery-2.1.1.min.js?d=1409764106:2 
n.isFunction.f

Anybody knows why this is happening?

2

Looks like it's generating a 500 Internal Server Error which means the underlying error message should be getting logged into your craft/storage/runtime/logs files. Just reproduce the problem and check for an entry with [error] severity.

  • Thanks for the tip. I'm looking at the logs but I'm very confused. Looking at the compiled_templates file the error pointed me to; the error seems to be originating from my home page template. Why would live preview be calling that template at all? :\ – cballenar Jan 2 '15 at 0:58
  • Wow... that was a trip... Took me a good while to figure it out. Turns out I had put a conditional for ajax loading on my base template of which I had forgotten. I had to consider isLivePreview in the logic. All good now. Thanks! – cballenar Jan 2 '15 at 1:15
  • Hah... glad you got it sorted! – Brad Bell Jan 2 '15 at 2:35
7

Just want to mention for anyone running across this thread that if you're having a problem with live preview and seeing dev tools errors of the nature of cors or crossdomain then the first thing you might want to check is that if the domain you're serving the site (the control panel, specifically), is the same as what you have set in "Settings | General Settings" (or in Craft 3, "Settings | Sites")

For example, if you serving the site from a example.com (root domain), and you have www.example.com in the settings, your live preview will bonk because it's a different domain and the live preview is being served via ajax.

  • Good, simple explanation, and it did solve my issue. Thanks for both saying exactly where to check the setting, and the technical detail behind the problem. – itnAAnti Apr 3 at 16:39
5

Another cause of Live Preview not working that can be a pain to debug, because there are no 'errors' as such is your .htaccess setup. For example, on one site we had the following .htaccess entry to force trailing slashes (at server level, not Craft's config option) in order to prevent duplicate listings in the client's analytics:

# Force trailing slash:
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteRule ^(.*[^/])$ http://%{HTTP_HOST}/$1/ [L,R=301]

However that 301 redirect kills the Live Preview and returns the page at it's current saved state. No errors in the logs and easy to miss. Our workaround for this issue was to only apply the trailing slash for non-POST requests, allowing Craft to POST to the Live Preview system uninterrupted:

# Force trailing slash:
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_METHOD} !=POST
  RewriteRule ^(.*[^/])$ http://%{HTTP_HOST}/$1/ [L,R=301]
4

Accepted answer helped me, my issue was Ajax related as well! Here is an example of the code I ended up using in my template.

{% extends (craft.request.isAjax and not craft.request.isLivePreview) ? "_ajaxLayout" : "_layout" %}
  • Yup, pretty much what I did! :) – cballenar Jan 16 '15 at 1:55
2

Another possible source of Live Preview not working is your siteUrl config setting pointing to the wrong environment in a multi-environment setting.

I had this problem when I'd set siteUrl globally in the config but had forgotten to override it for the staging environment that Live Preview was failing in. Adding a siteUrl for the staging environment fixed that.

For example:

return array(
  '*' => array(
    'devMode' => false,
    'omitScriptNameInUrls' => true,
    'siteUrl' => 'http://example.com/'
  ),
  '.dev' => array(
    'devMode' => true,
    'siteUrl' => 'http://example.dev/'
  ),
  'stage.example.com' => array(
    'siteUrl' => 'http://stage.example.com/'
  )
);
1

In my case it was failing because I had set the X-Frame-Options meta in the base template:

<meta http-equiv="X-Frame-Options" content="deny">

The browser was rejecting the preview frame content as being protocol data rather than http.

So i changed the base template to check for live preview:

{% if not craft.request.isLivePreview %}
<meta http-equiv="X-Frame-Options" content="deny">
{% endif %}
1

Make sure {{ siteUrl }} is used in your links in your templates.

For example

href="{{ siteUrl }}stylesheets/styles.css"

Not

href="stylesheets/styles.css"

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.