10 Ağustos 2012 Cuma

Improvements on Code syntax highlighting for Blogger dynamic views

I have wrote about snytax highlighting in Blogger dynamic views recently. In this post, I will try to improve a few things.

1. Quick style change

Highlight.js is providing 20 style themes currently. You may want to change your theme from time to time, or may want to choose a best-fit theme seeing in action. With the method I explained in previous post, you have to modify HTML template for your blog each time you want to change the theme. Lots of work!

Similiar to helper.js trick, we can reference a style.css file inside the blog template, then import the style whichever we want in this file.

Firstly, Create a stylesheet file (style.css) near to your other files (helper.js etc.). Content of the file will be:
@import url("styles/ir_black.css");
Put relative path of the your desired CSS here.

Then, Change stylesheet target in the blog template to:
<link href='http://my.domain.com/highlight/style.css' rel='stylesheet'/>

2. Font type of some code parts

Some code blocks couldn't be formatted in Courier font. For example, a code block looks like this:
<script>format()</script>
or like this:
class Greeter
def initialize(name)
...

But, we want this:
<script>format()</script>
or this:
class Greeter
def initialize(name)

...
As you see, we want to format Greeter, initialize, script and other "title"s in Courier (not Sans) as well as other parts. So, I realized that all of this problematic parts has a common point: All of them located inside a span of class "title":
<span class="title">...</span>
It looks like our CSS file lacks a definition for
pre .title
So, we need to add it. Instead of adding this to all styles we were given by Highlight.js, it is enough to add to only our style.css which we just created.

Result

Resulting content of the style.css here:
@import url("styles/ir_black.css");

pre .title {
  font-family: Courier;
}

Hiç yorum yok:

WSO2 ESB + ClientAccesPolicy.xml + CrossDomain.xml

ClientAccesPolicy.xml and CrossDomain.xml files have to be found at root of your services Silverlight and Flex clients to be able to acce...