シーサーブログのカスタマイズ

デザインのコンテンツ画面がブラウザで編集できない

FirefoxでSeesaa、さくらのブログ、so-netブログのデザインでコンテンツ編集画面を開き、「カテゴリー」や「リンク集」、「自由形式」などのパーツをクリックするとその編集画面がブラウザの外にはみ出して編集できない場合多いです。


多いというか、私のFirefoxでは必ず、ブラウザの外にはみ出して編集できません。

そこで、偶然見つけた小技の紹介です。

コンテンツ編集画面で「自由形式」などのをクリックする前に、ブラウザの画面を「全画面表示」にしておきます。Firefoxのメニューから「全画面表示」又はキーボードのF11キーをクリックします。

その後に、「自由形式」や「リンク集」をクリックすると、画面のど真ん中に表示されます。

また、全画面表示にせずに、はみ出してしまった状態からF11キーをクリックすると、あら不思議、はみ出していた画面がど真ん中に移動して表示されます。

Seesaaやさくらでは、エキスパートモードで何とか編集できますが、So-netではエキスパートモードが内容なので、困っていましたが、これで解決ですね。

Seesaa(さくら)ブログのカテゴリ表示件数の変更

Seesaa(さくら)ブログでは、カテゴリの表示件数がデフォルトで20件までに設定されています。


この表示件数を変更するには、

メニューの デザイン->コンテンツ でコンテンツの「カテゴリ」をクリック。

Seesaa Category.png

表示件数を所望の件数に変更して、「保存する」ボタンをクリック。


さくらの場合は、「再構築の実行」が必要。

Seesaaブログにソースコードを読みやすく表示

今回は、スタイルシートやHTML、JavaScript、VBなどのソースコードを読みやすく表示するため、SyntaxHighlighterというJavascriptツールを紹介します。

【表示イメージ】

 
h1 {
margin:0px;
padding-top:50px;
padding-bottom:10px;
font-weight:bolder;
font-size:24px;
font-family:Verdana;
}
  
という感じで、行番号表示、CSSであればCSSのタグなどを色付け表示してくれます。

 

【設置手順】

1.まずは、SyntaxHighlighterをダウンロードして、解凍します。

ダウンロード先は、http://alexgorbatchev.com/wiki/SyntaxHighlighter:Download

zip形式なので、解凍ツールで解凍してください。

2.Seesaaブログのファイルマネージャでアップロード

image_thumb18

stylesフォルダ内のファイルとscripts内のファイルをアップロードします。

 

 

 

 

 

 

 

Seesaaブログのファイルマネージャでフォルダを作成、フォルダ名は何でも構いません。

image_thumb15

次に、作成したフォルダにダウンロードしたstylessフォルダとscriptsフォルダの中身をアップロードしていきます。少々面倒ですが、コツコツアップしましょう。

image_thumb17

(注)アップロード時に、「オプションを表示する」ボタンを押して、必ずディレクトリが目的のディレクトリになっていることを確認してください。

scriptsフォルダ内のshCore.jsとclipboard.swfは必ずアップします。それ例外は必要に応じてアップします。例えば、CSSが必要なら、shBrushCss.jsを、JavaScriptが必要なら、shBrushJScript.jsをアップします。

3.SeesaaブログのHTMLを編集します。

メニューの「デザイン」→「HTML」、そして「HTMLの追加」を押して、現在のHTMLを編集します。

<head>  </head>間に下記コードを追加してください。

(注)customize-seesaa.up.seesaa.net/syntax/ の部分はご自分の環境に合わせましょう。











編集が完了したら、保存してください

4.Seesaaブログで投稿してみましょう

投稿記事のソース部分を<pre class="brush: css;"> 〜 </pre>で囲んで書きます。

また、”brush: css;”はスタイルシートの場合で、htmlなら”brush: xhtml;”となります。

その他は、http://alexgorbatchev.com/wiki/SyntaxHighlighter:Brushes を参照。

(注)記事の投稿設定を「改行をタグ変換しない」、「URL補完しない」に設定しておきましょう。

×

この広告は1年以上新しい記事の投稿がないブログに表示されております。