/ / FOUC'u bir Kentico 10 sitesi kapsamında önleyin - zurb-foundation, kentico

Bir Kentico 10 sitesi kapsamında FOUC'yi önleyin - zurb-foundation, kentico

Zurb Vakfı'nın tavsiyesi page html etiketine class = "no-js" ekleme Unstillenmiş İçeriğin Flaşına (FOUC) karşı önlem almak için.

Kentico CMS kullanıyoruz. Bir sınıfa ekleyerek "Kentico" yolunu arıyorum. html ana sayfada öğe etiketi. CMS portal motorunu kullanıyoruz.

Ne için gidiyoruz? <html class="no-js"

Kentico makrolarını veya API'sini kullanarak daha kolay bir yol yoksa, ASP.NET'e geri dönmek ister.

Yanıtlar:

Cevap için 3 № 1

Ana sayfa portal şablonunuzda, bu değişikliği yapmak için böyle bir kod ekleyebilirsiniz:

<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (CurrentDocument != null)
{
CMS.UIControls.ContentPage page= this.Page as CMS.UIControls.ContentPage;
if (page != null)
{
page.XmlNamespace += " class="no-js"";
}
}
}
</script>

Ayrıca, CMSPagesPortalTemplate.aspx sayfasını da değiştirebilir, ancak tipik olarak yükseltme yolunu kırdığı için Kentico tarafından desteklenmez veya önerilmemektedir.


Cevap için 1 № 2

Tanıdığım en hızlı yol, değişiklik yapmaktır. CMSPagesPortalTemplate.aspx sınıfını oraya eklemek için.

<%@ Page Language="C#" AutoEventWireup="true" Inherits="CMSPages_PortalTemplate" ValidateRequest="false" MaintainScrollPositionOnPostback="true" EnableEventValidation="false" Codebehind="PortalTemplate.aspx.cs" %>

<%=DocType%>
<html <%=XHtmlNameSpace%> <%=XmlNamespace%> class="no-js">
<head id="head" runat="server" enableviewstate="false">
...

Cevap için 0 № 3

“No-js”, varsayılan değerdir. Gerçekten de tarayıcınız JavaScript destekliyorsa, “no-is” sınıfı Modernizr motoru tarafından kaldırılacaktır.

Modernizr bir JavaScript kütüphanesidir ve tarayıcı yeteneklerini kontrol eder ve html class = "” ifadesini günceller.

Örneğin, tarayıcınız flexbox teknolojisini destekliyorsa, html sınıfı listesine flexbox sınıfı eklenecektir. Aksi takdirde, flexbox sınıfı eklenmez.

Daha sonra, CSS framework'ü (Bootstrap veya Foundation) kullanırken eksik bir özelliği taklit etmek için bazı stratejiler kullanılabilir.


ilgili sorular


Yorumlar (0)

Yorum ekle