記事一覧作ってみました

今まで

自分でも過去に書いた内容みたいと思って探したり・・・・

自分でもやり方忘れて過去のを見たいと思っても・・・・・

（なんせいい加減なもんですから、その場でid名とか適当につけちゃうんであとで困るんです）

探すのにメンドイ！

自分でもそうだから皆さんはもっと面倒だったのではないでしょうか？

これで少しは使いやすくなると良いです

結局、自分が一番使いそうですが・・・・・

プチメ等で問い合わせ頂いていますが簡単な説明はコメントにあります↓

※SEO的にも有効です

　yahoo、Googleの検索ロボットが来たときに全部の記事に行ってもらえる可能性があります・・・

　検索ロボットって来ても全ページをチェックしていくわけじゃないんです

　で、チェックして行ってないページに書かれていることは当然検索しても出てきません

　sitemapを作って登録したいところですが・・・アメブロではできません

　で、記事一覧、まっ、要は普通のサイトのサイトマップですね

　これって検索ロボットの行き先を全ページに振り分けるんで効果的なんです

　最初の記事にyahooがまだ来ていないようなんですが・・・

　これでOK？

本当はココの日にちとかテーマとかは消しちゃいたいんです・・・・

これが出来れば頭の中ではできている冒頭表示が出来そうなんですが・・・・

肝心のこのとこがね・・・・・わかんないです？

CSS 新広告をなんとかしちゃおう 8

好みのテーブルが画像になりましたか？

では広告の背景に設定していきます

CSSに書かれている各サイズがどの部分かわかるように画像を用意してあります
画像を見て自分で作った背景画像に合わせてサイズを調整してください

今回使用の画像のサイズは400px×190pxです

画像サイズ以外を0にした場合・・・・基本の位置です

margin-top: を設定すると・・記事と画像の間隔があきます

height: を設定すると・・・画像の下が開きます

※画像の高さより小さな値ですと画像がその分、欠けます


padding:　にサイズを設定すると・・・画像の横と広告の間隔があきます

最終的に設定するサイズは・・・・width:に注意！

サイズの入れ方を把握したら

CSSの最後にコピペしてください

/* 広告の背景に画像 */
.contents #advertising2{
margin-top: 50px;/* 記事とのスキマ */
padding: 5px 10px 20px 10px;/* 背景画像と広告のスキマ */
display:block;
width: ***px;/* 広告の横幅 */
background:url(背景画像のURL) no-repeat!important
}

2009/2/15

CSS も～い～か～ぃ・・？記事下広告

http://ameblo.jp/exlink/entry-10208568112.html

こちらで不都合が出ましたのでＣＳＳを修正しました

CSS 新広告をなんとかしちゃおう 7

前回に作ったテーブルを画像にしていきます

自分好みのテーブルは出来ましたか？

画像にするためにプリントスクリーン機能を使います

わかりやすく説明すると・・・・・

今、見ているパソコンの画面をそのままコピーしてしまいます

ブログ等でパソコンの操作方法を説明するときなどにも使います

コレがあるとわかりやすいですよね
このページで使っている画像もコレで作っています・・・・・・

ただ・・・あるソフトを使ってはいるんです・・・・　

普通はカーソルは撮れないんですが

説明するときには必要ですから・・・・・

そのソフトについてはまたの機会に・・・・・・

では、自分のパソコンのキーボードで【PrintScreen】とか【PrtSc】を探してください

ノートパソコンとかで【Fn】キーを押しながら【PrintScreen】とか【PrtSc】を押す場合も有ります

画面全部をコピーする場合は【PrintScreen】または【PrtSc】、
一番前にある画面（アクティブ画面）のみコピーする場合は
【Alt】キーを押しながら【PrintScreen】または【PrtSc】

作ったテーブルを画面に表示させてから【PrintScreen】または【PrtSc】を押してください

これらのキーを押しても何の変化もありませんし、なんのアクションも起こしませんが大丈夫です・・・

WINに付属のペイントを立ち上げます

編集 → 貼り付け をしてみてください・・・・

パソコンの画面がペイントに貼り付きました・・・・・

この中から背景画像に必要なテーブル部分を取り出します

選択を選んでからマウスで切り取りたいテーブルを囲います

範囲が選択できたらその中で右クリック → ファイルにコピー

適当な名前をつけて適当なフォルダーに保存します

※24ビット　ビットマップ(BMP) 形式での保存になります

今度はアメブロにアップできるようにbmp → jpg　に変換します

先ほど保存した画像を開きます

もし、余白が目立つようでしたら

再度、範囲指定して右クリック → ファイルにコピーでやりなおしてください

bmp画像をjpg画像に変換します

と、いってもただ形式を選んで保存するだけです

※手持ちのbmp形式の画像をアメブロにアップする場合もこのようにjpgに変換します

　・・・・bmpは大きいので、たぶん縮小もしないとだめだと思いますが・・・・・

ファイル → 名前をつけて保存　

※このときファイルの種類でJPEGを選びます（jpegもjpgも同じです気にする必要はありません）

確認の為、開いてみるとjpgになっているのが確認できます

できましたら、この画像をアメブロの画像フォルダーにアップしてください

　　　　・・・・・　つぎはこの画像を広告の背景にします

※macな方　Sift＋アップルマーク＋3(テンキー)で、全画面のプリントスクリーン
　Sift＋アップルマーク＋4(テンキー) で、一部分のプリントスクリーン（マウスでドラックした範囲）