SQLの窓

2016年11月29日

Seesaa ブログの簡単カスタマイズ : SimpleDホワイト(右サイドバー) を使用してごそごそと。

★ ブラウザは最大化
★ デスクトップ解像度は幅 1280px

▼ 最初の状態です



ここから、CSS を3箇所変更します。

1) #container の width を 1263px に変更
2) #content の width を 940px に変更
3) .blog に margin-left: 20px を追加

これをするだけで、1280px で最大化しているブラウザの中でいっぱいいっぱいにブログを使用できるようになります。この際、右サイドは 300px に初めから設定されているのでバナー等を表示するのに良いサイズとなっています。

▼ 一番広い状態です



1263px と 940px を同数減らせば、表示が中央よりになります。その際は margin-left: 20px は必要無い感じになるでしょう

1263px だと、情報をたくさん載せたい場合にはいいですが、文章が主体の場合はもう少し幅を狭くするといいと思います

▼ 少し調整した結果です


最大表示 


1) #container の width を 1100px に変更
2) #content の width を 777px に変更
3) .blog から margin-left: 20px を削除


テキストサイズの調整

初期状態ですと、フォントのサイズが少し小さいようです。フォントサイズはいろいろな場所で個別に設定できますが、ここではほぼ全ての要素の初期値的な reset という場所があったのでそこで変更しました。
/* reset */

div,
span,
iframe,
p,
blockquote,
cite,
h1,
h2,
h3,
h4,
h5,
h6,
img,
dl,
dt,
dd,
ol,
ul,
li,
form,
label,
article,
aside,
figcaption,
figure,
footer,
header,
nav,
section,
time,
mark,
input,
textarea {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  vertical-align: baseline;
  font-weight: normal;
  font-style: normal;
  font-size: 17px;
}

テキストの色の変更

元は濃い灰色だったので、黒に設定しました。場所は、.blog .text で、color: #000000; としました。


最大表示 

実際のブログへのリンク


既存のデザインをそのまま同様にコントロールしたい場合

古いタイプのデザインですと、なかなか調整が難しいかもしれないので、現在のデザインがやっている大元の設定を一つ DIV で囲んでそこに指定します。

1) コンテナ(id=container)全体を div で囲んで、以下の CSS を設定する
    position: relative;
    margin: auto;
    width: 1263px;
コンテナの終わりは、<!-- マーク --> で予想される </div> の直前に書いておいて、Google Chrome のデベロッパーツールの Elements で開いて確認する。デベロッパーツール では、階層構造になっているので確実に特定できます。

ディスプレイの解像度は 1280px と言う前提で、1263px と言うのは、ブラウザを最大化してスクロールバーの横幅を差し引いた大きさです。

margin が auto なのは、ブラウザ内の表示を縮小したり、より大きい解像度で表示された場合に中央にコンテンツを表示する為です。

SimpleDホワイト(右サイドバー) では、#container に以下のような設定がされており、幅以外(幅は今回設定したものです)はだいたいにおいて同じ結果をもたらしています。
#container {
    width: 1100px;
    position: relative;
    height: auto !important;
    min-height: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}



posted by at 2016-11-29 13:46 | Comment(0) | Seesaa | このブログの読者になる | 更新情報をチェックする

2016年08月13日

前代未聞の文字化けの Seesaa。サーバが攻撃されたのか?

リビルドしない限り、ページは変わらないはずなのに。
ほんま、とんでも無いわ。
Yahoo! ニュースに乗るレベルの惨事ですがな。





■ 障害内容
時間:2016年 08月13日 00:00ごろ〜
対象:Seesaaブログ
現象:一部のブログにおいて文字化けが発生している
原因:システム障害

<追記>8月13日10:00
上記障害の対応を行い、文字化けが発生しない状態になっております。


さらっと流しとるなぁ。
単なる障害とはとうてい思えないですけどね。




posted by at 2016-08-13 03:35 | Comment(0) | Seesaa | このブログの読者になる | 更新情報をチェックする

2012年11月01日

Seesaa のテンプレート変数を使ってOGPの設定を使用をしたけれど、個別記事の URL を 全体 HTML では使う事ができない。

以下のように設定しましたが、Facebook のデバッガで見ると結局 index 部分にリダイレクトされて、なのに type は article にしかならないのですが、良く解りません。しばらくいろいろ使ってみたいと思います。

・・・と思ったら、Facebook にリンク書き込んだら index にリダイレクトされたので、article の設定は解除します、今から。

結局、ヘタに画像指定するとその画像しか Facebook から選択できなくなるので、トップインデックスページのみの設定で良いという事で納得。ただ、記事に画像が無い場合を考えて、ブログのイメージ画像をページに貼っておく事にした。( 投稿時にはそれを選択 )
<% if:page_name eq 'index' -%>
<meta property="og:title" content="SQLの窓と銀プログラマ">
<meta property="og:type" content="blog">
<meta property="og:url" content="http://ginpro.winofsql.jp/">
<meta property="og:image" content="https://lh3.googleusercontent.com/-qn7uhrzwog0/T0kOKGQZ2WI/AAAAAAAAE4Y/xG7Csjdm8_Y/s260/_img.png">
<meta property="og:description" content="<% blog.description | nl2br | tag_strip %>">
<% /if -%>
<% if:page_name eq 'article' -%>
<meta property="og:title" content="GINPRO">
<meta property="og:type" content="article">
<meta property="og:url" content="http://ginpro.winofsql.jp/">
<meta property="og:image" content="https://lh3.googleusercontent.com/-qn7uhrzwog0/T0kOKGQZ2WI/AAAAAAAAE4Y/xG7Csjdm8_Y/s260/_img.png">
<meta property="og:description" content="<% extra_title | nl2br | tag_strip %>">
<% /if -%>




posted by at 2012-11-01 22:28 | Seesaa | このブログの読者になる | 更新情報をチェックする

2012年06月10日

Seesaa の『バックアップ量』は一年単位が目安ですが、一番古い月は1ヵ月でないとエラーが出るのです

たぶん、殆どのブログは出ないと思います(うちでも一つだけ)。



実際はこんな感じでバックアップしています( 一年単位をたまーーに )




関連する記事

Seesaa の記事カテゴリをソートする IE 拡張
IE拡張メニュー : Seesaa のリンクコンテンツを一瞬でソートする
Seesaa の『コメント/トラックバック/アフィリエイト』を一括変更するブックマークレット



posted by at 2012-06-10 09:28 | Seesaa | このブログの読者になる | 更新情報をチェックする
Seesaa の各ページの表示について
Seesaa の 記事がたまに全く表示されない場合があります。その場合は、設定> 詳細設定> ブログ設定 で 最新の情報に更新の『実行ボタン』で記事やアーカイブが最新にビルドされます。

Seesaa のページで、アーカイブとタグページは要注意です。タグページはコンテンツが全く無い状態になりますし、アーカイブページも歯抜けページはコンテンツが存在しないのにページが表示されてしまいます。

また、カテゴリページもそういう意味では完全ではありません。『カテゴリID-番号』というフォーマットで表示されるページですが、実際存在するより大きな番号でも表示されてしまいます。

※ インデックスページのみ、実際の記事数を超えたページを指定しても最後のページが表示されるようです

対処としては、このようなヘルプ的な情報を固定でページの最後に表示するようにするといいでしょう。具体的には、メインの記事コンテンツの下に『自由形式』を追加し、アーカイブとカテゴリページでのみ表示するように設定し、コンテンツを用意するといいと思います。


※ エキスパートモードで表示しています

アーカイブとカテゴリページはこのように簡単に設定できますが、タグページは HTML 設定を直接変更して、以下の『タグページでのみ表示される内容』の記述方法で設定する必要があります

<% if:page_name eq 'archive' -%>
アーカイブページでのみ表示される内容
<% /if %>

<% if:page_name eq 'category' -%>
カテゴリページでのみ表示される内容
<% /if %>

<% if:page_name eq 'tag' -%>
タグページでのみ表示される内容
<% /if %>
この記述は、以下の場所で使用します


Android SDK ポケットリファレンス
改訂版 Webデザイナーのための jQuery入門
今すぐ使えるかんたん ホームページ HTML&CSS入門
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX