So I switch to Blog In Draft and check the option "Make Blogger in Draft my default dashboard". It solved the line break issues.
Read more!
Showing posts with label Blog. Show all posts
Showing posts with label Blog. Show all posts
Tuesday, November 11, 2008
Another Syntax Highlighter for Online Code Posting
So I switch to Blog In Draft and check the option "Make Blogger in Draft my default dashboard". It solved the line break issues.
Read more!
Tuesday, May 20, 2008
a nice label cloud for Blogger
Read more!
Monday, May 12, 2008
Adding Google Prettifier to Blogger
Goto dashboard, and click Editing HTML under the Layout tag, add the following two lines in the <head> tag
<link href="http://xxx.org/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://xxx.org/prettify.js"></script>
The next thing is to find the <body> tag and change it to
<body onload='prettyPrint()'>
Ok, you are done and you can create a post testing this feature. For example, creating a post with the following code
<pre class='prettyprint'>
class Voila {
public:
// Voila
static const string VOILA = "Voila";
// will not interfere with embedded tags.
}
</pre>
and here is the result
class Voila {
public:
// Voila
static const string VOILA = "Voila";
// will not interfere with embedded tags.
}
PS: Made some improvement to the prettify style and add overflow: auto; for pre.prettyprint
pre.prettyprint { padding: 2px; border: 1px solid #888; overflow: auto;}
Read more!
Thursday, May 8, 2008
Create summaries for the blog posts
In blogger Dashboard, click layout and select 'Edit HTML' tab. The first thing you need to do is to download the full copy of the template in case you mess up something with the template. At least, you can recover it by uploading the full copy. The template should be a xml file. Please make a copy before any further action.
Now open the xml file in your favored editor, since I am using the layout template, I have to add the following style definition into <header>
<b:if cond="data:blog.pageType == "item"">
span.fullpost {display:inline;}
<b:else>
span.fullpost {display:none;}
</b:else>
In my template, there is a big section for <b:skin> tag in the header, so I placed the code above just after it and before the end of <head>. This actually defines the style for class fullpost of span tag. If all blogs are on the same page, any texts of class fullpost will be hidden; otherwise, they will be displayed.
The next thing is to enable the summaries ("Read More" link at the end of the blog) when your blog posts are listed on the page.
</b:skin></b:if><div class="post-body entry-content">
<p>
<data:post.body>
<!--add for blog summary-->
<b:if cond="data:blog.pageType != "item"">
<a href="data:post.url">Read more!</a>
</b:if>
<!--end-->
</data:post.body></p>
<div style="clear: both;"> <!-- clear for photos floats -->
</div>
Finally, you need to specify which part of the blog will be hidden. You can use <span> tag (<div> tag doesn't work). Please refer to the help for more information or check this post itself.
Read more!
Subscribe to:
Posts (Atom)
Posts
