Sitecore中的頁面預覽問題

我在Sitecore中部署了我的第一個頁面。但它在內容編輯器預覽模式下不能完美呈現。Sitecore中的頁面預覽問題

原始的HTML：

有一個導航菜單和它下面的一面旗幟。在他們後面是一個白色透明覆蓋層&後面的覆蓋是一個塗鴉背景圖像。

查看從經驗編輯：

的設置圖標去了偏移。現在，白色疊加層位於Sitecore菜單上方，用於防止編輯。

Error in browser console:
Uncaught TypeError: element.dispatchEvent is not a function - prototype.js:5734
Uncaught TypeError: element.attachEvent is not a function - prototype.js:5653

查看在內容編輯器：

當你看到菜單得到轉移到圖標它呈現爲如果平板電腦。我明白，這是因爲預覽面板的尺寸。但是，如果是這種情況，作者將如何編輯/查看正確的設計。

Prototype.js不是網站正在使用的文件。所以，它必須來自Sitecore的。

我猜測，某些CSS道具沒有被尊重（像位置，變換）。

這是一個錯誤。如何解決這個問題。我檢查了不同的瀏覽器（IE瀏覽器，Chrome瀏覽器，Chrome瀏覽器，Chrome瀏覽器）。這是相同的

來源

2016-03-10 Qwerty

它看起來像你遇到與prototype.js衝突。 Sitecore在體驗編輯器中使用它。

如果你在你的網站使用jQuery，有關於這裏的知識庫文章：https://kb.sitecore.net/articles/286042

要解決這個問題，就需要在不衝突模式下運行的jQuery。有幾種方法可以做到這一點。下面是一個簡單的例子：

<!-- Putting jQuery into no-conflict mode. --> 
<script src="prototype.js"></script> 
<script src="jquery.js"></script> 
<script> 

var $j = jQuery.noConflict(); 
// $j is now an alias to the jQuery function; creating the new alias is optional. 

$j(document).ready(function() { 
    $j("div").hide(); 
}); 

// The $ variable now has the prototype meaning, which is a shortcut for 
// document.getElementById(). mainDiv below is a DOM element, not a jQuery object. 
window.onload = function() { 
    var mainDiv = $("main"); 
} 

</script>

你可以找到更多jQuery的網站上：http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/

您還需要小心你的CSS - 沒有絕對定位元素到瀏覽器的頂部，始終確保它們與容器相對，以便可以正確添加和定位Sitecore EE DOM元素。

來源

2016-03-10 05:34:37

我有2個類似的問題。（i）設計已經由另一個團隊開發（通常情況下，不是這樣）。如果每個頁面都有很多.js文件，那麼在每個js文件中都需要執行無衝突聲明。（ii）設計者不知道該網頁是在另一個界面（如Sitecore）中查看的，因此定位元素記住sitecore是不容置疑的。那麼怎麼去解決呢。請指教。 – Qwerty

您對於定位元素並沒有真正的選擇。前端團隊必須與Sitecore合作，而不是反對它，它希望體驗編輯器是一個很好的_Experience_ :)至於JS--這一切都取決於他們如何編寫JS。TBH - 一個好的前端團隊應該使用AND模塊或關閉或類似的東西來寫作，這將使他們能夠輕鬆實現不衝突模式。另外 - 我相信這個問題在以後的版本中沒有解決。 –

Sitecore中的頁面預覽問題

回答

相關問題