らい帳

画像を管理して簡単に表示する方法

ブログを書いていいて、面倒なのが画像の管理です。

らい帳では自分のパソコンに入っているjpgpng形式の画像ファイルを簡単に管理してブログで表示できます。

追加方法

記事の作成画面で、以下の画像エリアが表示されています。

記載されているように、左上の「参照」ボタンで画像ファイルを選択するか、指定の場所に画像をドロップします。

画像を追加

画像を追加すると以下のようになります。

画像を追加後

画像編集

追加した画像の部分をクリックすると画像編集画面が起動します。

ここで画像のサイズやファイル名などを変更できます。

一つの記事に同じファイル名の画像は登録できませんので、ここで変更します。

また、グレースケールやセピアなどの簡単な特殊効果で編集することも可能です。

画像編集画面

記事に画像を表示

記事に画像を表示する方法は画像を表示するで紹介していますが、上記のように追加した画像は簡単に表示できます。

ドラッグアンドドロップで表示

追加した画像の部分をドラッグして、表示したい箇所にドロップすると。![画像ファイル名](/@/画像ファイル名.png "画像ファイル名")の形式で文字列が入力され、記事中に画像を表示させることができます。

画像選択画面で選択

画像選択画面から、追加した画像を選択して、記事に表示できます。

ツールバーの以下のボタンをクリックすると画像選択画面が表示されます。

ツールバー画像

カーソル位置に文字列が入力されるため、画像選択画面を評する前に、表示したい箇所にカーソルを当てた状態にしておきます。

画像をクリックすると、![画像ファイル名](/@/画像ファイル名.png "画像ファイル名")の形式で文字列が入力され、記事中に画像を表示させることができます。

画像選択画面

画像選択画面

画像選択画面の初期表示時は現在の記事に追加した画像の一覧が表示されます。

参照ページのテキストボックスに、他の記事のファイル名を入力して、検索ボタンをクリックすると、その記事で追加したファイルの一覧が表示されます。

そのため、別の記事で追加した画像も簡単に表示できます。



Related Posts

  • 作成したサイトをレンタルサーバーにアップロードする

    サイト生成で生成したファイルをレンタルサーバーにアップロードして世の中に公開する方法を紹介します。ここではエックスサーバーというレンタルサーバーを例にして説明します。エックスサーバーは10日間の無料お...


  • らい帳の基本的な使い方

    らい帳の基本的な使い方を紹介します。ダウンロードしたexeファイルをダブルクリックして起動するとインストーラが起動され自動でインストールされます。アンインストールしたい場合は他のソフトと同様、「プログ...


  • テーブル(表)を表現する

    テーブル(表)形式で表現したい場合は、以下のようにします。:の位置で文字寄せを指定できます。先頭に:XXXを記載すると、XXXは表題になります。


  • プログラミングコードをシンタックスハイライトで表示する

    プログラミングのコードを表現したい場合はコードの文字列を`(バッククウォート)で囲うと、囲われた部分の文字列はコードとして表現されます。変数に値を代入するにはa = 3;のようにします。複数行に渡るプ...


  • 文献などの引用を表現する

    文献などを引用を示すための表現をする場合は文章の先頭にを記載します。複数行に渡る文章の引用を示す場合はそれぞれの行の先頭にを記載します。Markdown(マークダウン)は、文書を記述するための軽量マー...


  • 数式をLATEXで表現する

    $$で囲うとLATEXの形式で数式を表現できます。$だと、文章中に数式を表現できます。数式の変換ライブラリはkatexを使用しています。詳しい使い方は公式ページをご確認ください。半径 rrr の円の面...


  • 箇条書きのリストを表示する

    箇条書きリストを表現するにはリストの各項目の先頭に*または-または+を記載します。+を使用した場合は、リストの先頭の・が表示されませんが、その代わりにアイコンリストとしてフォルダ構成などを表現できます...


  • 他のページヘのリンクを作成する

    別ページヘのリンクを作成するには[リンクテキスト](リンク先URL) ツールチップの形式で指定します。同一サイト内へのリンクは同じタブ、外部サイトへのリンクは新しいタブで開きます。wikipedia同...


  • 太字、斜体、打ち消し線、マーカーなどで文字を修飾する

    *や_などの記号を用いて、文字を太字にしたり、下線を引いたりすることができます。太字にしたい文字列を**または__で囲うと、囲われた部分の文字列は太字になります。このソフトを使用すれば、プログラミング...


  • 画像を表示する

    画像を表示する場合は、![画像の説明](画像のURL 画像タイトル)の形式で指定します。同一サイト内の画像の場合は以下のようにページ名とファイル名だけで指定することも可能です。/ファイル名/画像名の形...