Cara Membuat Seleksi Pada Blockquote

Cara Membuat Seleksi Pada Blockquote - Yang dimaksudkan Seleksi pada Blockquote adalah dengan membuat seleksi warna pada setiap kode yang dituliskan pada postingan, untuk membuat seleksi warna ini menggunakan Syntax Highlighter dari Softwaremaniacs. Dengan Syntax higlighter kita dapat mengelpokan warana seperti pada CSS, html, Javascript dan lainnya.

Untuk menggunakan Syntax Highlighter kita menambahkan kode  pre code

pre .comment,
pre .template_comment,
pre .javadoc,
pre .comment * {

Untuk membuat seleksi pada blockquote anda tingal quote (") pada bagian terpenting pada postingan, maka secara otomatis seleksi pada Blockquote dilakukan, bagia anda yan tertarik berikut ini langkah-langkah penerapannya :

Cara Membuat Seleksi Pada Blockquote

• Login keakun Blogger
• Pilih Tempalte » Edit HTML
• Dengan menggunakan ctrl+f anda cari kode ]]></b:skin>
• Selanjutnya anda terapkan kode berikut dibawahnya :

<style type='text/css'>
pre code {
  display: block;padding: 0.6em;
  background: #008383; color: #222;

}
pre .comment,
pre .template_comment,
pre .javadoc,
pre .comment * {
  color: #586e75;
  font-style: italic;
}
pre .keyword,
pre .method,
pre .list .title,
pre .clojure .built_in,
pre .nginx .title,
pre .tag .title,
pre .setting .value,
pre .winutils,
pre .tex .command,
pre .http .title,
pre .request,
pre .status {
  color: #569dcf;
}
pre .envvar,
pre .tex .special {
  color: #660;
}
pre .string,
pre .tag .value,
pre .cdata,
pre .filter .argument,
pre .attr_selector,
pre .apache .cbracket,
pre .date,
pre .regexp,
pre .coffeescript .attribute {
  color: #FF0232;
}
pre .sub .identifier,
pre .pi,
pre .tag,
pre .tag .keyword,
pre .decorator,
pre .ini .title,
pre .shebang,
pre .prompt,
pre .hexcolor,
pre .rules .value,
pre .css .value .number,
pre .literal,
pre .symbol,
pre .ruby .symbol .string,
pre .number,
pre .css .function,
pre .clojure .attribute {
  color: #569dcf;
}
pre .class .title,
pre .haskell .type,
pre .smalltalk .class,
pre .javadoctag,
pre .yardoctag,
pre .phpdoc,
pre .typename,
pre .tag .attribute,
pre .doctype,
pre .class .id,
pre .built_in,
pre .setting,
pre .params,
pre .variable,
pre .clojure .title {
  color: #aa985a;
}
pre .css .tag,
pre .rules .property,
pre .pseudo,
pre .subst {
  color: #0A077B;
}
pre .css .class, pre .css .id {
  color: #000;
}
pre .value .important {
  color: #ff7700;
  font-weight: bold;
}
pre .rules .keyword {
  color: #C5AF75;
}
pre .annotation,
pre .apache .sqbracket,
pre .nginx .built_in {
  color: #9B859D;
}
pre .preprocessor,
pre .preprocessor * {
  color: #444;
}
pre .tex .formula {
  background-color: #EEE;
  font-style: italic;
}
pre .diff .header,
pre .chunk {
  color: #222;
  font-weight: bold;
}
pre .diff .change {
  background-color: #1C7B07;
}
pre .addition {
  background-color: #7B6C07;
}
pre .deletion {
  background-color: #FFC8BD;
}
pre .comment .yardoctag {
  font-weight: bold;
}
</style>

• Selanjutnya anda cari kode </body> terapkan kode dibawah ini diatasnya :

<script src=' https://aakyos.googlecode.com/svn/highlighter.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
// Seleksi tag pada blockquote
$('.post-body, .post-body p, div.post-body, #text-body, #main_text').each(function () {
    $('blockquote[class="tr_bq"]').replaceWith(function () {
        return $('<pre><code>' + $(this).html() + '</code></pre>');
    });
});
//]]>
</script>
<script>
hljs.initHighlightingOnLoad();
</script>

Demikian Cara Membuat Seleksi Pada Blockquote, semoga bermanfaat!

Share this post