技術情報|ProRelease

画像の縮小/拡大方法

Wed, 30 Jan 2008 14:29:51 +0900

現在画像のUP方法は記事追加フォームの　画像ボタン　をご利用いただいているかと思います。

今回さらに、画像を好きなサイズでUPできる方法をお伝えいたします。

画像タグでサイズ指定をする

画像ファイルのデータそのものを拡大するわけではなく、表示上大きくしているだけなので画像が粗くなりがちです
等倍で拡大、縮小しないと縦のび、横伸びの画像になります

とくに画像が粗くなるのは縮小率/拡大率が大きくなる程表示が粗くなるようです。

Microsoft ペイントを利用して画像サイズを小さくさせる

WindowsOSなら基本的に搭載しているMicrosoft「ペイント」を利用する方法です。

画像サイズ自体を変えるので先ほどの方法より画像が粗くなる心配が軽減されます。

画像の縮小方法

　ペイントを開きます。
　　ペイントは、「スタート」→「すべてのプログラム」→「アクセサリー」→「ペイント」で立ち上げる事ができます。

　画像をペイントで開きます。
　　フォルダから画像をペイント上にドラッグすると開きます。

図1

　「伸縮と傾き」を開きます。　ファイルや編集とかかれている項目の「変形」を選択。
　上から2つ目の「伸縮と傾き」をクリックしてください。

　ペイントの上でキーボード「Ctrl」ボタンと「W」を両方押して頂く方法もあります。

　縮尺の倍率を決めます。
　上部分の「伸縮」部分（赤枠部分）に記載のあるパーセンテージを書き換えていただきます。
　OKを押すと画像サイズが変わります。

　図2

　変えた画像を保存する
　上の「ファイル」をクリックし、「名前を付けて保存」をします。
　（そのまま上書き保存をすると元の画像データそのまま書き換わってしまいます。）

あとは、いつもと同じ様にボタンから縮小した画像をUPしてください。
これは拡大にも使えます。

プロリリースでは画像サイズの横幅を500pxまでを推奨としています。
それ以上横幅のある画像をご利用頂くとデザインが崩れる恐れがある為です。

また、小さい画像を見やすく拡大するときなどにもご利用頂けます。

ぜひご活用ください。

箇条書きの方法

Fri, 28 Dec 2007 20:22:14 +0900

記事内で箇条書きする方法を記載します。

箇条書き例

箇条書きの場合

箇条書きをする方法の例文です。
箇条書きをする方法の例文です。このタグを使うとを一文が長くなってしまい、改行がされた場合でも段落の調整をします。
箇条書きをする方法の例文です。

さらに応用をすることで数字も自動でつきます。
この数字は自動的に振られているので、ひとつ項目がなくなっても数字を書き換えずに、
自動で繰り上がります。

上記の記述の管理画面側

箇条書きの場合
<ul><li>箇条書きをする方法の例文です。</li>
<li>箇条書きをする方法の例文です。このタグを使うとを一文が長くなってしまい、改行がされた場合でも段落の調整をします。</li>
<li>箇条書きをする方法の例文です</li></ul>

番号を振った箇条書きの場合
<ol><li>さらに応用をすることで数字も自動でつきます。</li>
<li>この数字は自動的に振られているので、ひとつ項目がなくなっても数字を書き換えずに、</li>
<li>自動で繰り上がります。</li></ol>

<ul>で囲われている部分が箇条書きの部分全部の指定。
さらに<li>で囲われているのがひとつの箇条書き部分です。
<ul>は通常の箇条書きのタグで、<ol>は番号を振る為の箇条書きタグです。

このタグを利用するメリットは、改行がされても、左の段落を合わせてくれるところです。
さらに、番号を振った箇条書きにしたり、その他も指定でいろいろな箇条書きのマークに変更することができます。

その他のマークには以下があります。

白い丸（="circle"）
黒い四角（type="square"）
マーク無し（type="none"）

以下は番号用<ol>にのみ利用できます。

アルファベット (type="a"）
大文字アルファベット( type="A")
大文字ローマ字( type="I")
小文字ローマ字( type="i")

変更方法はtype="○○"という指定をタグに振って頂くことです。
指定の方法二通りあります。

■まとめて変更する場合
<ol
<ol type="i"><li>するとolで囲われている部分は</li>
<li>すべて同じ</li>
<li>マークになります。</li></ol>

■個別に変更する場合
<ol><li　type="i">するとolで囲われている部分は</li>
<li　type="i">すべて同じ</li>
<li　type="i">マークになります。</li></ol>

参考にしてみてください。

※　注意：ProReleaseは改行をすべて反映させます。今回は分かりやすさの為、タグ内に改行を入れていますが、実際に利用する場合は改行を入れないように注意してください。

記事内でタイトルを区切る方法

Thu, 18 Oct 2007 19:56:28 +0900

記事内にでタイトルを利用する場合はタグが有効です。

タグとは

〜

のHとはHeadingの略で、見出しを意味します。

が最上位の見出し（大見出し）で、以下数字が小さくなるにつれて下位の見出し（小見出し）となります。
一般的なブラウザではタグで囲まれた部分はテキストのサイズが変化し、太字で表示され、前後に改行が入ります。

またプロリリースの場合には予めのデザインが指定がされている為、自動的に見栄えがよくなります。

タグの利用方法

テキストを
〜
で囲うことによってタイトルとなります。

例：
タグの利用方法

　　これで上記のタイトルと同じ表記になります。

また、デザインオーダー等をされているお客様は別途併せたデザインを施しますので、必ずしも同じ様にはなりません。
ご指定がある場合にはお気軽にプロリリース事務局までお問い合わせください。

カラーチャート（色見本）

Fri, 17 Aug 2007 19:50:36 +0900

プロリリースでは、文字などに色をつけることが出来ます。
エディターでは赤色文字をボタンひとつでつけることが出来ますが、赤の指定部分を決められたカラーネームかカラーコードに置き換えることで別の様々な色を利用することが可能です。

赤文字
　　　　　　　　　　　　　↓
ライムグリーン

インディゴ

いろいろ試してみてください。

カラーコード/カラーネームの一覧

色名	入力コード	色
Black	000000	000000
DimGray	696969	696969
Gray	808080	808080
DarkGray	A9A9A9	A9A9A9
Silver	C0C0C0	C0C0C0
LightGrey	D3D3D3	D3D3D3
Gainsboro	DCDCDC	DCDCDC
WhiteSmoke	F5F5F5	F5F5F5
White	FFFFFF	FFFFFF
Maroon	800000	800000
DarkRed	8B0000	8B0000
Red	FF0000	FF0000
OrangeRed	FF4500	FF4500
DarkOrange	FF8C00	FF8C00
Orange	FFA500	FFA500
Gold	FFD700	FFD700
Olive	808000	808000
Yellow	FFFF00	FFFF00
DarkGoldenrod	B8860B	B8860B
SaddleBrown	8B4513	8B4513
Chocolate	D2691E	D2691E
Goldenrod	DAA520	DAA520
FireBrick	B22222	B22222
Brown	A52A2A	A52A2A
Sienna	A0522D	A0522D
Peru	CD853F	CD853F
Tomato	FF6347	FF6347
Coral	FF7F50	FF7F50
IndianRed	CD5C5C	CD5C5C
SandyBrown	F4A460	F4A460
DarkKhaki	BDB76B	BDB76B
Salmon	FA8072	FA8072
DarkSalmon	E9967A	E9967A
LightSalmon	FFA07A	FFA07A
LightCoral	F08080	F08080
BurlyWood	DEB887	DEB887
Tan	D2B48C	D2B48C
Khaki	F0E68C	F0E68C
RosyBrown	BC8F8F	BC8F8F
PaleGoldenrod	EEE8AA	EEE8AA
NavajoWhite	FFDEAD	FFDEAD
Wheat	F5DEB3	F5DEB3
Moccasin	FFE4B5	FFE4B5
PeachPuff	FFDAB9	FFDAB9
Bisque	FFE4C4	FFE4C4
BlancheDalmond	FFEBCD	FFEBCD
LemonChiffon	FFFACD	FFFACD
LightGoldenrodYellow	FAFAD2	FAFAD2
PapayaWhip	FFEFD5	FFEFD5
AntiqueWhite	FAEBD7	FAEBD7
Beige	F5F5DC	F5F5DC
Cornsilk	FFF8DC	FFF8DC
LightYellow	FFFFE0	FFFFE0
MistyRose	FFE4E1	FFE4E1
Linen	FAF0E6	FAF0E6
Oldlace	FDF5E6	FDF5E6
Seashell	FFF5EE	FFF5EE
FloralWhite	FFFAF0	FFFAF0
Ivory	FFFFF0	FFFFF0
Snow	FFFAFA	FFFAFA
Chartreuse	7FFF00	7FFF00
LawnGreen	7CFC00	7CFC00
DarkGreen	006400	006400
Green	008000	008000
Lime	00FF00	00FF00
ForestGreen	228B22	228B22
OliveDrab	6B8E23	6B8E23
DarkOliveGreen	556B2F	556B2F
GreenYellow	ADFF2F	ADFF2F
YellowGreen	9ACD32	9ACD32

色名	入力コード	色
LimeGreen	32CD32	32CD32
DarkSeaGreen	8FBC8F	8FBC8F
LightGreen	90EE90	90EE90
PaleGreen	98FB98	98FB98
Honeydew	F0FFF0	F0FFF0
SpringGreen	00FF7F	00FF7F
MediumSpringGreen	00FA9A	00FA9A
LightSeaGreen	20B2AA	20B2AA
SeaGreen	2E8B57	2E8B57
MediumSeaGreen	3CB371	3CB371
Turquoise	40E0D0	40E0D0
MediumTurquoise	48D1CC	48D1CC
MediumAquamarine	66CDAA	66CDAA
Aquamarine	7FFFD4	7FFFD4
MintCream	F5FFFA	F5FFFA
Teal	008080	008080
DarkCyan	008B8B	008B8B
Cyan	00FFFF	00FFFF
Aqua	00FFFF	00FFFF
DarkTurquoise	00CED1	00CED1
DeepSkyBlue	00BFFF	00BFFF
Navy	000080	000080
DarkBlue	00008B	00008B
MediumBlue	0000CD	0000CD
Blue	0000FF	0000FF
MidnightBlue	191970	191970
DodgerBlue	1E90FF	1E90FF
DarkSlateGray	2F4F4F	2F4F4F
RoyalBlue	4169E1	4169E1
SteelBlue	4682B4	4682B4
CadetBlue	5F9EAD	5F9EAD
CornFlowerBlue	6495ED	6495ED
SlateGray	708090	708090
LightSlateGray	778899	778899
SkyBlue	87CEEB	87CEEB
LightSkyBlue	87CEFA	87CEFA
LightBlue	ADD8E6	ADD8E6
Paleturquoise	AFEEEE	AFEEEE
LightSteelBlue	B0C4DE	B0C4DE
PowderBlue	B0E0E6	B0E0E6
LightCyan	E0FFFF	E0FFFF
Lavender	E6E6FA	E6E6FA
Azure	F0FFFF	F0FFFF
AliceBlue	F0F8FF	F0F8FF
GhostWhite	F8F8FF	F8F8FF
Indygo	4B0082	4B0082
DarkViolet	9400D3	9400D3
BlueViolet	8A2BE2	8A2BE2
DarkOrchid	9932CC	9932CC
DarkSlateBlue	483D8B	483D8B
MediumOrchid	BA55D3	BA55D3
SlateBlue	6A5ACD	6A5ACD
MediumSlateBlue	7B68EE	7B68EE
MediumPurple	9370DB	9370DB
Purple	800080	800080
DarkMagenta	8B008B	8B008B
Magenta	FF00FF	FF00FF
Fuchsia	FF00FF	FF00FF
DeepPink	FF1493	FF1493
Crimson	DC143C	DC143C
MediumVioletRed	C71585	C71585
HotPink	FF69B4	FF69B4
Orchid	DA70D6	DA70D6
PaleVioletRed	DB7093	DB7093
Violet	EE82EE	EE82EE
Plum	DDA0DD	DDA0DD
LightPink	FFB6C1	FFB6C1
Thistle	D8BFD8	D8BFD8
Pink	FFC0CB	FFC0CB
Lavenderblush	FFF0F5	FFF0F5

テーブルの周り込み方法

Wed, 4 Jul 2007 19:14:16 +0900

テーブルを以下のように回りこみをさせる場合の方法について記載します。

周り込みテスト例

周り込みテスト

周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト

上記の記述の管理画面側

<table width="40%" border="2px" align="left" cellpadding="10">
<tr bgcolor="#ffffff"><td>周り込みテスト</td></tr>
<tr bgcolor="#ffffff"><td>周り込みテスト</td></tr>
</table>
周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト周り込みテスト

通常のテーブルを書いてしまうと上記のように回り込みがされません。
テーブルの<table>の中にalign="位置指定"をつけてください。
これをつけることによって回り込みが出来るようになります。

位置には以下のようにあります。

　　右　 align="right"
　　左　 align="left"
　　中央align="center"

参考にしてみてください。

カテゴリ別にRSSを表示する方法

Mon, 2 Apr 2007 20:11:00 +0900

現在のRSSはすべての最新記事内容をRSSとして配信していますが、
少しURLを変えるだけで、カテゴリ別にRSSを配信することも出来ます。

カテゴリ別RSSはお客様のサイトにリンクすることにも利用できますが。
プロリリースのヘッドラインモジュール（一覧を表示する機能）を設置する際に、
カテゴリ別RSSのURLを指定するだけでカテゴリ別の一覧を作成することが出来ます。

カテゴリ別にRSS配信するURLの作り方

現在のすべてを配信しているRSSはこちらです。

http://プロリリースのURL/xml-rss2.php
　例：http://demo.prorelease.net/guest/xml-rss2.php

http://プロリリースのURL/xml-rss2.php?catid=カテゴリID
　例：http://demo.prorelease.net/guest/xml-rss2.php?catid=1

通常のURLの最後に?catid=カテゴリIDを追加するだけで、カテゴリ別のRSSを抽出することが可能です。

カテゴリIDの調べ方

サイドバーのカテゴリから、表示させたいカテゴリをクリックします

表示したカテゴリ毎の記事一覧ページのURLを見ます

?catid=　から始まる分列の数字部分がカテゴリIDです

お試しください。

タイトルを別ページへのリンクにする方法

Wed, 14 Mar 2007 16:30:00 +0900

記事のタイトル部分に直接リンクを貼ることが可能です。

ヘッドラインタイトルをクリックした際に直接別ページが開きます。

タイトル内にも本文上部にありますツールバーを利用頂くことが可能です。

※タイトルに別ページへのリンクをつけてた場合でも、本文は記述して下さい。RSS配信した場合に本文内容もRSSリーダー側で読み取れる為です。RSSユーザの為の文章を記載するようにしましょう。

注意事項

■使用例
タイトル
タイトル

タイトルに直接リンク貼った場合の注意事項

Wed, 14 Mar 2007 15:30:00 +0900

タイトルから直接リンク貼った場合も本文は記述して下さい。
本文には、リンクページの説明を書いて下さい。

理由は、RSS配信した場合に本文の内容もRSSリーダー側で読み取れるためです。

macの文字化けについて

Wed, 14 Mar 2007 15:00:00 +0900

機種依存特殊文字を使用した場合macのブラウザでは文字化けする場合があります。
全角１文字の記号などがそれに当たります。
主に単位等で文字化けする可能性があります。

cm、mm、m/s、等は、半角英数字で入力して下さい。
（株）、等も全角１文字の特殊記号を使用しないようにして下さい。

HTML特殊文字の表示方法（その１）

Wed, 14 Mar 2007 14:30:00 +0900

本文に特殊文字を使用（表示）することが可能です。

※但し、機種依存文字はmacで文字化けする可能性があります。

特殊文字使用する場合は、以下のようにコードへ変換してからのご利用をお願いします。

　記号　　コード
　€　→　　€　ユーロ記号
　™　→　　™　商標
　©　→　　©　コピーライト

詳細はこちら　HTMLの特殊文字