Adding a new blogspot from MarsEdit.

When you want to setup a new blog connection between blogspot and MarsEdit, this is how you can do it.

The basic idea is to make a setting from MarsEdit as follows:

Procedure

You start from “New Blog”.

Then, you are requested to add google account that relates to the bloodspot.

And that’s it. It automatically gets all the blogs from the blogger so that you can update or add some more.

embed swf file into blogger

You need to video capture from any tool. I used Jing for it.

Then, you need to store it into somewhere in the cloud, I used google sites.

<embed src="https://sites.google.com/site/csmgroup/files/2012-10-27_2026.swf"
quality="high" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" align="middle" height="300pt" width="500pt">

Change the name of label in the blogger's new interface

Let's say you want to change the blogger label with bloodspot.

Add a new label, and set the posts with the new label

Click the Posts menu.



Then select them all.


Then, add bloodspot as a new label

Using tab/menu in blogger(blogspot)

You may want to add tabs/menus on top of your blogger.

Actually they are nothing but a web page that you can make a link. For my case, I use label to get the posts with the label. For example, with the Python tab, I link http://prosseek.blogspot.com/search/label/python, and so on.
Then you can visit blogger.com to select your blogs.

Click Pages to add the page you want. Don't forget to set the "Show pages as" to "Top tabs".


You can change the configuration

SyntaxHighlighter brushes

This is a list what kind of brushes that SyntaxHighlighter provides. From http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/.

Changing font size for headers

Some of the default font size in blogger template does not setup accordingly. This is my rendered output with h2 tag.

In order to change this, one needs to edit the css file. The first step is click the design button.

Then Customize the layout.

In advanced menu, you need to use Add CSS.


Add the necessary code in the editor.



Now you have larger font.

Reference

• css tutorial

Syntax highlighter issue with google chrome

The code with SyntaxHighlighter shows wrong line formatting in google chrome.
I found that this is a known issue with of line formatting, check this site.

The http://alexgorbatchev.com/pub/sh/current/styles/shCore.css source has the line that causes this problem.


There are easy two solutions.

Solution 1

Modify the shCore.css : replace this line.

.syntaxhighlighter table td.gutter .line {
  text-align: right !important;
  padding: 0 0.5em 0 1em !important; <-- Replace this line
}

.syntaxhighlighter table td.gutter .line {
  text-align: right !important;
  padding: 0 5px  !important;
}

Or make it point to where the bug is fixed. : http://codeoncloud.co.cc/shCore.css

Solution 2

Add following line after Configure HTML/JavaScript edit.

Following code should be added.

Displaying updated post in blogspot

This post teaches how to enlist newly generated posts.

Get this widget

The basic idea is retrieve information from blogger, and calls he callback function to enlist the result.

The summary has all the information, you can check it from http://prosseek.blogspot.com/feeds/posts/summary. Compare it to the case with only for python label with http://prosseek.blogspot.com/feeds/posts/summary/-/python. so if you want to enlist all the posts updated not for specific label, you can modify the code as follows.

How to make cloud form of labels in blogpost

As the number of blogs grow, I need to organize and find the posting based on labels.

This post explains how to do that.

In short:

1. click the Layout link
2. Select where to put the label cloud and select label :
   
3. Then select options :
   

Using LaTeX in blogspot

First method

I googled this site helps to make LaTeX working in blogspot. I have prosseek/files, for file storing purposes (even though it allows me keep only 1GB). Just right click in google/sites, and copy the file using HREF allows me to download the file from the site like this.
The code is as follows:

$latex \displaystyle S(n)=\sum_{k=1}^{n}{\frac{1}{T_{k}}=\sum_{k=1}^{n}{\frac{6}{k(k+1)(k+2)}$

This is the result: $latex \displaystyle S(n)=\sum_{k=1}^{n}{\frac{1}{T_{k}}=\sum_{k=1}^{n}{\frac{6}{k(k+1)(k+2)}$
You can refer to this post for embedding HTML/javascript in your blog.

MathJax

I googled this post to use MathJax. You need to add the code in template, which add jQuery and MathJax.

The code is as follows:

$x + y_3$

And this is the result: $x + y_3$

Warning

As is written in this post, there is a bug that the result is not shown in Chrome.

References

1. Embedding math with replacemath
2. How to show the string inside a tag verbatim?

Easier way to embed java script/HTML in blogpost

When using javascript in your blogspot, I just copied the javascript and HTML code in the editor, but using template, one can share the java script and HTML code for all of the blogs that I make. The first step is visit blogger.com, and choose your blogspot. Open layout.

Then, open "Add a Gadget", and select HTML/Javascript.

When you need to change some of the template, you also can edit the template HMTL code.

Then add your code in there. I have this for my code.

Showing LaTeX code in blogger

Refer to this post.

Syntax highlighter setup

Refer to this post.

pretty printer

Refer to Code highlighting on blogger by LUKA MARINKO. You also need to modify HTML template as explained before.

You can edit the code anytime you want.