SORU
5 Aralık 2009, CUMARTESİ

Nasıl blogger/blogspot ile güzelleştirmek başka kullanacak?

Blogger.com programlama bazı metinler barındırmak için kullanıyorum, ve güzelleştirmek başka (stackoverflow gibi) güzel kod örnekleri için renk kullanmak istiyorum.

Nasıl blog alanına da güzelleştirmek başka komut kurarım?
Daha doğrusu onun (mümkünse), paylaşılan bir kopyasını bir yere bağlamak olur mu?
Farklı bir etki alanı var. Bu işe yarar mı?

Çok teşekkürler.

CEVAP
15 Aralık 2009, Salı

Blogger yeni bir giriş yaptığınızda, giriş HTML kullanımı ve blog girdileri Düzenle seçeneği çıkar.

bu yüzden yazın http://blogger.com , sonra giriş, Nakil^ o zaman . Mesaj^ Düzenleyin . Edit orada üstüne bu yerleştirin:

<script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
<script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/lang-css.js"></script>
<script type="text/javascript">
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
addLoadEvent(function() {
    prettyPrint();
});
</script>
<style type="text/css">
/* Pretty printing styles. Used with prettify.js. */

.str { color: #080; }
.kwd { color: #008; }
.com { color: #800; }
.typ { color: #606; }
.lit { color: #066; }
.pun { color: #660; }
.pln { color: #000; }
.tag { color: #008; }
.atn { color: #606; }
.atv { color: #080; }
.dec { color: #606; }
pre.prettyprint { padding: 2px; border: 1px solid #888; }

@media print {
  .str { color: #060; }
  .kwd { color: #006; font-weight: bold; }
  .com { color: #600; font-style: italic; }
  .typ { color: #404; font-weight: bold; }
  .lit { color: #044; }
  .pun { color: #440; }
  .pln { color: #000; }
  .tag { color: #006; font-weight: bold; }
  .atn { color: #404; }
  .atv { color: #060; }
}
</style>

prettyPrint kullanmanız gerektiğini unutmayındoğrudanbir olay işleyicisi, karıştırır (ayrıntılar için the readme). addLoadEvent sonra dönüp prettyPrint çağıran bir işlev geçiyoruz ediliyor.

Blogger bize stil bağlamak için izin vermez, çünkü bu durumda, biz sadece güzelleştirmek başka gömün.css içeriği.

Ekle <code></code> bir etiket veya bile "prettyprint lang-html" böyle dilini belirleyebilirsiniz. "prettyprint" sınıf adı <pre></pre> bir etiket

bu gibi görünmesini sağlar

<pre class="prettyprint lang-html">
<!-- your code here-->
</pre>

ya da bu gibi

<code class="prettyprint lang-html">
<!-- your code here-->
</code>

oraya kod HTML temizlemiş < ve ^ gerekiyor . sadece buraya kodu yapıştır bunu: http://www.simplebits.com/cgi-bin/simplecode.pl

Eğer isterseniz varsayılan olarak tüm sayfalar için dahil HTML düzeni üst kodu koyabilirsiniz.

güncelleme Şimdi blogger CSS dosyalarını bağlayabilirsiniz yani <head> bunu eklemek yeterli olacaktır

<link href="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
<script type="text/javascript" language="javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/lang-css.js"></script>
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded',function() {
        prettyPrint();
    });
</script>

Seçtim değil değiştirmek için vücut yüklendiğinde olay bilerek, onun yerine ben kullanıyorum yeni DOMContentLoaded olay eski tarayıcılar yok Destek ihtiyacınız olursa eski tarayıcı desteği, kullanabilirsiniz herhangi bir diğer yük olayı başlatmak prettyPrint, örneğin bir WordPress kullanmak:

jQuery(function($){
    prettyPrint();
});

ya güya 21* *şimdiye kadar

ve bitti :)

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:
Paylaşılan BarındırmaJavascriptBloggerShared-hostingBlogspotBloggerJavascript Güzelleştirmek BaşkaBlogspot

AYNI ETİKETTEKİ VİDEOLAR

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Caroline Martin

    Caroline Mar

    19 EYLÜL 2008
  • The Platform

    The Platform

    14 HAZİRAN 2006
  • YAN TV

    YAN TV

    20 EKİM 2011

İLGİLİ SORU / CEVAPLAR

İLGİLİ BAĞLANTILAR