ぴかぴか(新しい)おすすめ
⇒ジュース1本で動画も音楽もアップロード!ロリポップ

2006年02月13日

スクロール表示スライドバーでコンテンツ改造

posted by はに丸
edit  re
カテゴリー新着記事に限らず、サイドバーやメインに表示させているコンテンツオーバーフロー(スクロールバーを出現させて縦幅を固定する)表示にして見やすくしてみましょう。・・・つづきを読む


2005年12月09日

重いブログ・HPは嫌われる[読み込み表示測定]

posted by はに丸
edit  re
オシャレで楽しい画像ブログパーツなどは、ついつい貼り付けてしまいがち。特にブログペットなどのJAVAスクリプトは重くなる1番の要因です。
そんなブログやホームページの表示速度は、読み込むのに時間がかかりすぎて、実は訪問者にストレスを感じさせているかもしれません。
かくいうこのブログも色々付けすぎているのと、サーバー自体のレスポンスの悪さも手伝って、かなり重い(表示が遅い)と思います。
ごめんなさい。・゚・(ノ∀`)・゚・。

さて、そんなページの重さが気になるアナタ!
とっておきのダイエット商品診断ツールがあるんです!
その名もアブフレット!じゃなかった、ロデオボーイ!!
ダウンロード時間測定ツール

※ただアドレスを打ち込んで計測するだけなのでお金はかかりませんw

ダウンロード時間測定ツール powerd by ダウンロードTIMER
ダウンロード時間を測定したいウェブページのURLを入力してください


* 測定までに数秒〜30秒程度はかかります。
* 測定ボタンを連打しないでください。


どうでしたか?

ダイエットになぞって書いてみましたが、やはり軽い(表示が速い)にこしたことはないですね!
画像は少ない方が軽くなります。画像を使う場合は保存方法を色々試して見ましょう!画質が悪くなりますがページは軽くなると思います。
軽くするにあたってはHTML文書をより簡略化するだけでも軽くする事はできます。
自分のブログやHPのソースを見直して無駄な部分を省きましょう!と言ってもこれはとても時間がかかるし難しいと思います。時間があったら挑戦してみましょう!

2005年11月11日

Seesaa自作デザインテンプレートリンク集

posted by はに丸
edit  re
初心者Seesaaブロガーさんの悩みの種のデザインテンプレート
自作なされてる方のブログをいくつか見つけたので、紹介します。

どれも大変素晴らしいデザインです♪


Style book
http://temp-css.seesaa.net/

Seesaa デザインテンプレート
http://template.seesaa.net/

・まとめブログ
tagebuch-zweit
http://tagebuch-zweit.seesaa.net/article/1920245.html

2005年10月12日

記事の下部分から上へ戻る「TOPへ戻る」を付ける

posted by はに丸
edit  re
記事をだーーーっと読んでいて、上まで戻るのに、
毎回マウスをグリグリ回すのは、面倒くさいですね。

なので、下から上へ、ワープボタンを設置してみましょう。

  うひょーヾ(´3`)ノ


デザイン>コンテンツ>記事>記事(ページコンテンツ)HTML
<% content.header -%>
<!-- Content -->

間に
<% content.header -%>
<A name=ue></A>
<!-- Content -->

を足す。

次に真ん中辺りの
<div class="posted">posted by <% article.nickname %> <% if:article_weather -%>・・・

のところに
<div class="posted"><DIV class=updown><A href="#ue" name=sita>TOPへ</A></DIV>
posted by <% article.nickname %> <% if:article_weather -%>・・・
を足す。

コメントやトラックバックが沢山あって、いっちばん下からも戻れるように、
一番下の
<% /if -%>
<!-- /Content -->
<% content.footer -%>

の間に
<% /if -%>
<!-- /Content -->
<DIV class=updown><A href="#ue" name=sita>TOPへ</A></DIV>
<% content.footer -%>

を足して「再構築」をして、できあがりヾ(´囗`)ノ

2005年10月11日

Seesaaブログ、カレンダーの表示を変える

posted by はに丸
edit  re
カレンダーを横1列で表示する方法

Style bookさんの記事を丸々参考にさせていただいてます^^;
下記は、それを自分なりにまとめてみました。

管理画面の
デザイン -> コンテンツ
を選択し、「新しいコンテンツの追加」というフィールド内で
種類 > カレンダー
追加先ページ > 全ページ
配置 > ヘッダー(付けたい位置にお好みで)
並び順 > 30(これもお好みで)
を選択し、「コンテンツの追加」ボタンを押してコンテンツを追加します。
「カレンダーの設定」というページに切り替わったら、右上のほうにある「コンテンツHTML編集」をクリック。
「コンテンツHTML」というページに切り替わったら、そのページの入力フィールドの内容を全て削除し、以下の内容を全てコピペします。
<style><!--
#cal{text-align:center;white-space:nowrap;width:100%;font-size:10px;padding:10px 0px 10px 0px;color:#ccc;(←お好みの色)}
#cal a{text-decoration:underline;}
--></style>

<% content.header -%>
<div id="cal">
<% date_format(now,content_calendar.datetime) %> 
<% loop:list_calendar -%><% loop:list_data_month -%><% loop:list_data_week -%><% if:data.day %><% if:article -%> <a href="<% article.page_url %>"><% article.createstamp | date_format("%e") %></a><% else -%> <% data.day %><% /if %><% else %><% content_calendar.spc_text %><% /if %><% /loop %><% /loop -%><% /loop -%></div>
<% content.footer -%>

*赤字の部分
色を変える必要のない場合は削除して結構です。

あとは「保存」をクリックしてください。
スタイルシートがいじれる方なら、上の<style>部分は直接スタイルシートに記述してもいいと思います。

で、次は日付の表示の変更

日付が「○年○月」と漢字表示で固定されていますので、
コンテンツ > カレンダー > カレンダーの設定
で、「カレンダー年月」を変更します。

書式内容
%Y/%m/%d年/月/日 になる2005/03/14
%x月/日/年(下2桁) になる03/14/05
%a Y/%m/%d曜日(省略名) 年/月/日 になるMon 2005/03/14
%A Y/%m/%d曜日(省略なし) 年/月/日 になるMonday 2005/03/14
%Y/%b/%d 年/月(英語・省略名)/日 になる 2005/Mar/14
%Y/%B/%d年/月(英語・省略なし)/日 になる 2005/March/14
%F年-月-日 になる2005-03-14
%y/%m/%d年(下2桁)/月/日 になる05/03/14

2005年10月08日

カテゴリーページをタイトル一覧表示(見出し有り)にする

posted by はに丸
edit  re
ちなみに内容を表示する形の一覧表示はコチラ


デザイン→コンテンツ→記事→コンテンツHTML編集で
<% if:page_name eq 'category' -%>
<% /if -%>
となっている部分を
<% if:page_name eq 'category' -%>

<div id="clist">

<p>”<% category.name %>”の記事一覧です。</p>
<% loop:list_article -%>
<div class="blogbody">
<h3 class="title">
<a href="<% article.page_url %>" class="a">
<% article.subject %></a></h3>
<div class="text">
<%article.get_excerpt | tag_strip| shorten(160) %>
<a href="<% article.page_url %>" class="a">続きを読む</a>
<br>
<div style="text-align:right">
(<%article.createstamp | date_format("%Y/%m/%d %A") %>)

</div></div></div>
<% /loop -%>

</div>
<% /if -%>

と書き換える。

後は
<% loop:list_article -%>

<div class="blogbody">

<% /loop %>
を探し
<% unless:page_name eq 'category' %>

</unless>

ではさみこむ。


◆参考サイト様
ゴネるだけ損!

2005年10月07日

タイトルバーの表示をカテゴリー名に変更する方法(Seesaa)

posted by はに丸
edit  re
[変更前]

 トップページ   「ブログ名」 
 カテゴリページ  「ブログ名: カテゴリ名」
 過去ログページ  「ブログ名」
 記事ページ    「ブログ名: 記事タイトル」


これを次のように変更しました。

[変更後]

 トップページ   「ブログ名」
 カテゴリページ  「カテゴリ名 - ブログ名」
 過去ログページ  「ブログ名」
 記事ページ    「記事タイトル -ブログ名」
 


「デザイン」⇒「HTML」と進み、「HTML名」に任意の文字を記入。

タイトル・タグ(<title></title>)内、

<% title><% blog.title %><% if:extra_title %>: <% extra_title %><% /if %></title>
<title></title>間がブラウザタイトルバーに表示される内容です。赤文字のif文を次のように変更します。
<% extra_title %>はカテゴリページではカテゴリ名、記事ページでは記事タイトルになります。
<title><% if:extra_title %><% extra_title %> - <% /if %><% blog.title %></title>

これで作業は完了です。


※はに丸的には
記事ページのタイトルバーの表示を
記事タイトル - カテゴリータイトル
にしたいのです。
article_categoryとarticle.subjectあたりを使えばできるかと思ったのですが、記事コンテンツHTMLでしか反応せず、全体HTMLでのTITLEタグではなぜかエラー。。。
どうにも出来ませんでした。

どなたかカスタマイズのやり方がお分かりの方、いらっしゃいましたら是非教えて下さい。
ペコm(_ _;m)三(m;_ _)mペコ

2005年10月06日

カテゴリーページを一覧表示(タイトルのみ)にする

posted by はに丸
edit  re
デフォルトではカテゴリーを選択すると、全記事が表示されてしまって、
表示するのにも大変なので、各ブロガー先輩様たちの知恵をお借りして
一覧表示にしてスッキリさせたいと思います。

@「記事コンテンツの設定」の「コンテンツHTML編集」を開いて


<% if:page_name eq 'category' -%>
<% /if -%>


<% if:page_name eq 'category' -%>
<div id="clist">
<p>このカテゴリの記事一覧です。</p>
<ul>
<% loop:list_article -%>
<li><a href="<% article.page_url %>" class="a"><% article.subject
%></a></li>
<% /loop -%></ul>
</div>
<% /if -%>
に置き換え。

※追記※

このカテゴリの記事一覧です。

の部分を

『<% category.name %>』の記事一覧です。
に書き換えると「『カテゴリタイトル』の記事一覧です」と表示されるので、更にいいかも。
(このブログのカテゴリ見てみてください)

cssに

/* カテゴリ記事リスト */
#clist
{
text-align:left;
background:#FEFFF0;
margin: 20px;
padding:
10px;
border: 3px double #B2B2B2;
font-size: 90%;
}
#clist li
{
margin-bottom: 0.6em;
font-size:
90%;
font-weight:normal;
line-height:150%;
}

を追加。(見た目は好きに書き換えてみてください)
次は記事本文を消します。

再び記事(ページコンテンツ)の設定」の「コンテンツHTML編集」を開いて

<% loop:list_article -%>


を探します。
注意したい所は、上で一覧表示指定をする記述の中にも同じ文章がある所。
上で書き換えた部分より下に、もう一個出てくるはずですので、間違えずに探してください。

そこからずずずっと下を見て行って、ループ指定の終点


<% /loop -%>

を探します。
ここでも気をつけないといけない所は、ループの指定はいくつもあります。
ここで探すのは

<div class="blog">

を挟むループ指定部分です。
間に<div class="blog">が入っているか、
<% loop:list_article -%>と
<% /loop -%>の間にもう一つ
<% /loop -%>が入っていないか、よく確認してください。

目的の部分が見つかったら、それを

<% unless:page_name eq 'category' %>




<% /unless %>
で挟み込みます。

例えばこんな風に。

<% unless:page_name eq 'category' %>
<% loop:list_article -%>

<div class="blog">

<!--

うんちゃらかんちゃらごちゃごちゃ色々。

<% /if -%>
<% if:article.accept_tb %>
| <a href="<% article.page_url %>#trackback">TrackBack(<%article.tb_count
| __or__ | echo('0') %>)</a>
<% /if -%>
<%
if:style.disp_category
%>| <a href="<% article_category.page_url
%>"><%
article_category.name %></a><% /if
%>
</div>

</div>

</div>
<% /loop -%>
<% /unless %>
後は再構築してできあがり!
月別ページに対応させるには「category」を「archive」にかえればいいだけ。




◆参考サイト様
椰子の避暑地
Seesaa用テンプレート

2005年10月05日

バナー画像(ヘッダー)を変更する

posted by はに丸
edit  re
ブログの一番上、バナー画像の改造について。

スタイルシートの

#banner{
margin:0px;←上の隙間
padding-left:45px;←文字の位置
text-align:left;
height:246px;←全体の高さ
background-image:url(画像アドレス);
background-position:top;
}
新着記事

ブログ改造カスタマイズ”の記事一覧です。

  blogランキングに投票してみよう


このサイトは管理人の趣味・勉強の為に運営しています。従ってサポートを目的としておらず、全ての情報が最新かつ正しい内容とは限りません。自己責任でお願いします。
はに丸の楽曲は著作権を放棄しておりません。営利目的での無断使用を禁止します。
×

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