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

CC BY-SA 3.0
2015-01-02T00:58:50.993Z
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
CC BY-SA 3.0
2015-01-02T01:15:00.120Z
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
CC BY-SA 3.0
2015-01-02T02:35:36.553Z
Hah... glad you got it sorted!
Brad Bell
CC BY-SA 3.0
2015-01-01T15:03:03.417Z
2015-01-01T15:03:03.417Z
Brad Bell
<p>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 <a href="https://craftcms.stackexchange.com/questions/9501/force-trailing-slash-on-urls">force trailing slashes</a> (at server level, not <a href="https://craftcms.com/docs/config-settings#addTrailingSlashesToUrls" rel="nofollow noreferrer">Craft's config option</a>) in order to prevent duplicate listings in the client's analytics:</p>

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

<p>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:</p>

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

CC BY-SA 3.0
2016-11-02T12:17:58.553Z
2016-11-02T12:17:58.553Z
2017-04-13T12:51:00.253Z
billythekid
<p>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")</p>

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

CC BY-SA 4.0
2019-04-03T16:39:35.043Z
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
CC BY-SA 4.0
2019-12-09T18:24:20.853Z
I accidentally downvoted this but i meant to upvote it and now I cant change it :(
Rick Kukiela
CC BY-SA 3.0
2015-02-12T00:40:51.027Z
2018-04-08T22:51:51.887Z
2018-04-08T22:51:51.887Z
Bud Parr
<p>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.</p>

<pre><code>{% extends (craft.request.isAjax and not craft.request.isLivePreview) ? "_ajaxLayout" : "_layout" %}
</code></pre>

CC BY-SA 3.0
2015-01-16T01:55:49.720Z
Yup, pretty much what I did! :)
cballenar
CC BY-SA 3.0
2015-01-15T00:52:07.007Z
2015-01-15T00:52:07.007Z
Fox
<p>Another possible source of Live Preview not working is your <a href="http://buildwithcraft.com/docs/config-settings#siteUrl" rel="nofollow">siteUrl</a> config setting pointing to the wrong environment in a multi-environment setting.</p>

<p>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.</p>

<p>For example:</p>

<pre><code>return array(
  '*' =&gt; array(
    'devMode' =&gt; false,
    'omitScriptNameInUrls' =&gt; true,
    'siteUrl' =&gt; 'http://example.com/'
  ),
  '.dev' =&gt; array(
    'devMode' =&gt; true,
    'siteUrl' =&gt; 'http://example.dev/'
  ),
  'stage.example.com' =&gt; array(
    'siteUrl' =&gt; 'http://stage.example.com/'
  )
);
</code></pre>

CC BY-SA 3.0
2015-07-07T13:57:54.577Z
2015-07-07T13:57:54.577Z
Nick F
<p>In my case it was failing because I had set the <code>X-Frame-Options</code> meta in the base template:</p>

<pre><code>&lt;meta http-equiv="X-Frame-Options" content="deny"&gt;
</code></pre>

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

<p>So i changed the base template to check for live preview:</p>

<pre><code>{% if not craft.request.isLivePreview %}
&lt;meta http-equiv="X-Frame-Options" content="deny"&gt;
{% endif %}
</code></pre>

CC BY-SA 3.0
2016-03-31T07:47:40.070Z
2016-03-31T07:47:40.070Z
Neil Beattie
<p>Make sure <code>{{ siteUrl }}</code> is used in your links in your templates.</p>

<p>For example</p>

<pre><code>href="{{ siteUrl }}stylesheets/styles.css"
</code></pre>

<p>Not</p>

<pre><code>href="stylesheets/styles.css"
</code></pre>

CC BY-SA 3.0
2016-11-15T17:00:05.607Z
2016-11-15T21:06:24.210Z
2016-11-15T21:06:24.210Z
Samsull
<p>Live Preview isn't working for any kind of entry. Dev or production. I get the following error on chrome's console.</p>

<pre><code>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
</code></pre>

<p>Anybody knows why this is happening?</p>

<control-panel><live-preview>
Live Preview not working
# Live Preview not working

(Asked by: username_0 on 2014-12-31)

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?

**Tags:** control-panel, live-preview

---

## 7 answers

### Answer by username_1 on 2015-01-01. Score: 2 | Accepted answer

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.

> **Comments:**
> **username_0**: 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? :\  
> **username_0**: 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!  
> **username_1**: Hah... glad you got it sorted!  

---

### Answer by username_2 on 2016-11-02. Score: 6

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]


---

### Answer by username_3 on 2015-02-12. Score: 6

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.

> **Comments:**
> **username_4**: 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.  
> **username_5**: I accidentally downvoted this but i meant to upvote it and now I cant change it :(  

---

### Answer by username_6 on 2015-01-15. Score: 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" %}

> **Comments:**
> **username_0**: Yup, pretty much what I did! :)  

---

### Answer by username_7 on 2015-07-07. Score: 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/'
  )
);


---

### Answer by username_8 on 2016-03-31. Score: 1

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


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 %}

{% endif %}


---

### Answer by username_9 on 2016-11-15. Score: 1

Make sure {{ siteUrl }} is used in your links in your templates.
For example
href="{{ siteUrl }}stylesheets/styles.css"

Not
href="stylesheets/styles.css"


---

