第６回 LUREA サイドメニューの作り込み ～プロフィールの作成～

お待たせしました。
今回より、ルレア　ブログ作成　
『サイドメニューの作り込み』に入ります。

私が、サイドメニューについて、作り方を
調べていたら、あまり解説サイトもなく、
ある方の動画を見て、作りました。

このサイトで、さいどメニューも作成出来る
情報をお届けしますので、是非、より機能を高めた、
ブログ作成にお役立て下さい。

今回は、サイドメニューの　『プロフィール』の作成について
お話しします。

ダッシュボードから、
『外観』　→　『ウィジェット』を選択して下さい。

利用出来るウィジェットと、右側にサイドメニュー１、２
などがあります。

このブログでは、　２カラム　形式のブログについて話しを進めます。
サイドメニュー　１　が、　『左カラム』
サイドメニュー　２　が、　『右カラム』　となっています。

左カラムに表示するプロフィールを作成します。

まず、サイドメニュー１にあるウィジェットは、全部削除して下さい。
記憶がうろ覚えなのですが、何も設定されていないかもしれません。

利用出来るウィジェットから、　『テキスト』を
サイドメニュー１に、　ドラッグ＆ドロップして
配置します。

右の　▼　をクリックすると編集する事が出来ます。

タイトルに　『プロフィール』　と入力し、
下のテキストボックスに、自分のプロフィールを入力します。
何を入力すれば良いか、分からない時は、
名前・血液型・星座・住んでいる所　などを書いておけば良いと思います。

テキストボックスは、後から何回でも更新できますので
自分のブログに相応しいプロフィールを書きましょう。

書き方は、表示されるイメージと同じ書き方で構わないのですが、

重要な事は、　『自動改行』してくれない事です。

テキストボックスに文章を書いただけでは、
改行もされない、文字で埋められた　ウィジェットになってしまいます。

そこで、　HTMLタグを使用します。

今回使用するタグは、　＜ｂｒ＞　です。
（タグ埋め込み防止のため、全角アルファベットで記述していますが、
実際に使用する時は、半角英数字で記述して下さい。）

例えば、先ほどのプロフィールだと

名前　：　小林鮎実
血液型　：　AB型
星座　：　おひつじ座
住んでいる所　：　群馬県

となりますが、　ここにタグを使用すると

名前　：　小林鮎実＜ｂｒ＞
血液型　：　AB型＜ｂｒ＞
星座　：　おひつじ座＜ｂｒ＞
住んでいる所　：　群馬県＜ｂｒ＞

と記述する事で、改行されます。
また、１行空白をあけて表示したい場合は、

名前　：　小林鮎実＜ｂｒ＞＜ｂｒ＞

血液型　：　AB型＜ｂｒ＞＜ｂｒ＞

星座　：　おひつじ座＜ｂｒ＞＜ｂｒ＞

住んでいる所　：　群馬県＜ｂｒ＞

のように、　＜ｂｒ＞　タグを２個使用するとより見やすくなります。

＜ｂ＞
名前　：　小林鮎実＜ｂｒ＞＜ｂｒ＞

血液型　：　AB型＜ｂｒ＞＜ｂｒ＞

星座　：　おひつじ座＜ｂｒ＞＜ｂｒ＞

住んでいる所　：　群馬県＜ｂｒ＞
＜／ｂ＞


文字全体を　＜ｂ＞　～　＜／ｂ＞　タグで囲むと
太い文字になり、より見やすいプロフィールになります。

＜ｈ＊＞　～　＜／ｈ＊＞
で囲んでも、同じ効果が適用されます。
これは、見出しタグといって、文字の大きさと太さを同時に
設定出来るタグです。

＊　は、１～６の数字をしめしており、
１が一番大きく、６になると小さくなります。

サイドメニューの中で表示する文字の大きさは、
４～６が適当でしょう。

書き込む文字によって、大きさを変える事で、
より効果的なウィジェットになります。


次回は、サイドメニューに画像を貼る方法をお届けします。

タグ：第６回　LUREA　サイドメニューの作り込み　～プロフィールの作成～

第５回 LUREA ブログでグローバルメニューを作成する。

今日は、ブログのヘッダーの下にある
『グローバルメニュー』の作成方法について、
お届けします。

ブログのメインは、大体トップページの内容で
決まってしまいますが、
グローバルメニューには、トップページの他に、
　『特にクリックして欲しい要素』をメニューとして設定します。

・プロフィール
　ブログの運営者がどんな人か、良く分かるプロフィールがあると
　信用度が上がります。

・メルマガ登録ページ
　メルマガを発行している人は、登録ページへのリンクを
　グローバルメニューに置くと、便利です。

・レビューや、無料講座のページ
　商品レビューのページへのリンクを置いておくと、　
　何気に、クリックして貰えます。
　レビューの内容が良いと、レビューから報酬が発生します。
　また、ブログで連載形式の無料講座を進めると、
　読者がリピート訪問してくれます。

・動画集のページ
　面白動画や、オリジナル動画をまとめたページへのリンク。
　ブログの滞在時間が伸び、ブログ全体の質の向上に繋がります。

・ツイッタ―・フェイスブックなど
　ツイッタ―のフォロワーが増えると、呟きでアフィリエイトも可能です。
　また、フェイスブックをフォローして貰う事で、
　最新の情報発信を受け取ってくれる人が増えます。
　フォロワーを増やしたい人や、フェイスブックを活用したい人は、
　グローバルメニューに配置しておくと、効果的です。


～　グローバルメニューの作成方法　～

１．ダッシュボードから、
　　『外観』　→　『メニュー』　を選択。

２．メニューの名前に分かりやすい名前を入力。

３．『固定ページ』　→　『新規追加』　で必要なページを作成。

４．グローバルメニューに追加したい固定ページにチェックを入れ、
　　『メニューに追加』　をクリック。

５．外部リンクをメニューに入れたい時は、リンクをクリック。
　　URL　と、メニューに表示するテキストを入力して、
　　『メニューに追加』をクリック。

６．テーマの位置で、　『Global Navigation』にチェックを入れて、
　　『メニューを保存』　をクリックすると、完成です。


グローバルメニューがあると、ヘッダーと本文に仕切りが出来て、
見た目もすっきりします。
ブログに、グローバルメニューも追加してみて下さい。




～　ストーリーテリングプロジェクト　絶賛活動中！　～

タグ：第５回　LUREA　ブログでグローバルメニューを作成する。

第４回 ルレア ヘッダーメニューの作成。

ブログで使えるHTML講座ですが、
今回は、ルレアのテンプレート設定で、
『ヘッダーメニューの作成方法』について、
お届けします。

ブログのヘッダーメニューは、ブログページの上部に
表示されるもので、自分のブログの運営方法や、サイトの案内などを
表示する部分です。

ヘッダーメニューとして、設定しておくと良いものは、
・特定商取引法の表記　：　教材や、アフィリエイト販売を
　　　　　　　　　　　　　する際の身分証のようなものです。
　　　　　　　　　　　　　主に、販売形式や支払い方法、責任者の表示をします。

・サイトマップ　：　ブログの各ページをマップ式に表示するページ。

・お問合わせ先　；　読者の人が、メールであなたに質問や、
　　　　　　　　　　聞いてみたい事を送るページです。

・運営者情報　：　あなたの運営者としての情報を公開するページです。

・ソーシャルサービスへのリンク　：　ツイッタ―やフェイスブックへのリンク。

ワードプレスのオプションで、ほぼ設定できますが、
例えば、お問合わせ先は、ヘッダーの下のグローバル部分に設定した方が
わかりやすい場合や、メニューの表示順を独自で設定したい、
また、他のブログやサイトへ誘導したい場合などの時に、
ヘッダーメニューを自由に作成する事が出来ます。

作成方法としては、ワードプレスから、
『外観』　→　『メニュー』をクリックすると、
新規メニューの作成が行えます。

『固定ページ』で、独自のページを作成し、
登録しておきます。
『固定ページ』は、新規追加で、ブログ記事の作成と同じ方法で
作成できます。


～　文字の修飾　～

ページ作成の際、文章の途中で、文字の色を変更する事が出来ます。

～　

タグで囲むと、文字の色を変える事ができます。

******　の部分は１６進数のカラ―コードですが、

ff0000　：　赤

0000ff　：　青

00ff00　：　緑

の３色程度で十分だと思います。

ページ作成の時に、色を変えてイメージの強いページを
作成する事が出来ます。


『メニューの名前』　欄にわかりやすい、名前を入力して、
作成した固定ページを　ドラッグ　＆　ドロップ　する事で、
ヘッダーメニューが作成できます。

メニューの設定の下の、　『テーマの位置』で
Global Navigetion　にチェックを入れると、ヘッダーメニューになります。

『メニューを保存』をクリックして、保存して下さい。


＊＊　重要事項！　＊＊

ヘッダーメニューを作成した場合、
オプションで、ヘッダーバーリンクを全て　『表示しない』に
設定して下さい。
（そうしないと、ヘッダーメニューが２重に表示されます。）

ヘッダーメニューには、特にクリックされなくても良いけれど
必要で、重要と思われる要素の内容を設定すると良いです。

次回、説明するグローバルメニューと合わせて、
自分なりのメニューを作成してみて下さい。




～　ストーリーテリングプロジェクト　絶賛活動中！　～

タグ：第４回　ルレア　ヘッダーメニューの作成。

第３回 ルレアの最初の設定。

今回から、ワードプレスのテンプレート、
『ルレア』について、お届けします。
私自身も、初めて　『ルレア』を導入した際、
素材やメニューの設定などで、時間がかかった事もあり、
『ルレア』　まとめ的な記事を書く事で、
これから、ルレアを使用する方のために、
少しでも、お役に立てればとの思いで記事を書きます。
機会があれば、是非、参考にしてみて下さい。

ルレアをインストールし、各種プラグインを設定した後、
次に、設定したいと思うのは、
『デザイン』　と　『ヘッダー・グローバルメニュー』だと思います。
ルレアのトップページは、ワードプレスのホームと同じページです。
そこから、まず、デザインと、ヘッダーメニューを設定したい時は、

『オプション』　→　『オプション』　を選択します。

レイアウト　（ブログのカラム構成）　とデザインを選択する事が出来ます。
『リファイン　スノウ』をインストールした人は、
他のデザインを選択する事が出来ないみたいです。
デザイン　『Snow』が選択されているかと思います。
このデザインは、白がメインの背景画像もほとんどない、
シンプルなデザインです。

『かっこよくない！』　『期待したカラ―と違う！』
そう、思われる方もいるかと思います。
しかし、実は、このデザイン、自分のオリジナルデザインに
仕上げるために、一番都合の良いデザインとなっています。

自分の都合の良いデザインに変えていく方法は、
また、別の記事で書いていきます。
例としては、私のブログを見てもらえれば良くわかります。

オプションのページを下にスクロールして行くと、
『ヘッダーバーリンク』を編集する欄があります。
（私が２日徹夜で悩んだ所　＝＝；）

ヘッダーバーに搭載するメニューは予め決まっていますが、
『表示する』　『表示しない』　チェックボタンで、
はずしたり、表示させたりできます。
全て、オリジナルのメニューにしたい場合は、
後述するヘッダーメニューの作成で、オリジナルメニューを
作成する事が出来ます。

ツイッタ―やフェイスブックなどの外部リンクは、
そのまま、外部リンクのURLを追加すると自動的にリンクされます。
特定商取引法や、サイトマップなどは、
ルレアのテンプレートの中で、　『固定ページ』を作成し、
固定ページの　『パーマリンク』を追加して、リンクを作成します。

『固定ページ』の作成方法は、
『固定ページ』　→　『新規追加』　で作成出来ます。、
タイトルと本文を記入して、公開をクリックすると完成です。

タイトルの下に　『パーマリンク』　が表示されますので、
URLをコピーして、ヘッダーバーリンクのページで、
リンクしたいメニューに貼り付けて下さい。


次回は、ヘッダーメニューの作成についてお届けします。



～　ストーリーテリングプロジェクト　絶賛活動中！　～

タグ：第３回　ルレアの最初の設定。

第２回 ブログで テーブルタグを使用する。

ブログの記事の作成は、
文章を書き続けるだけで、簡単に出来ます。
ただ、文章だけでは、面白味がないので、
今回は、　ブログの記事の中で、
『テーブルタグ』　を使ってみましょう。
エクセルのような、表作成が作れます。
ブログ記事で、表を載せる時に便利です。

テーブルタグには、いくつか種類があります。

＜ｔａｂｌｅ＞　～　＜／ｔａｂｌｅ＞　　：　テーブルを設定するタグです。

＜ｔｒ＞　～　＜／ｔｒ＞　　：　縦カラムの設定をするタグです。

＜ｔｄ＞　～　＜／ｔｄ＞　　：　横カラムの設定をするタグです。

＜ｔｈ＞　～　＜／ｔｈ＞　　：　見出し文字の設定をするタグです。



実際にテーブルタグを使った記事を紹介します。

http://ayumitorendobl.blog.so-net.ne.jp/2013-11-25-1#favorite


今年の紅白歌合戦の出場者を、
紅組と白組に分けて、紹介しています。

文章だけで、紹介すると、名前の羅列にしかなりませんが、
一覧表のように、テーブルで作成すると、見やすいし、
分かりやすいです。


最初のテーブルの設定と、見出し部分のタグ表記です。 border="2"　　：　テーブルの境界線の太さを指定します。 cellpadding="10"　　：　テーブル内の余白部分を設定します。 　　：　セルの中の背景の色を変えています。 　～　　　：　セルの中の文字の色を変えています。 １つの縦カラムの中に、２つの横カラムが存在します。

　～　

　　：見出し文字の設定タグですが、文字の大きさと太さを見やすくしているので 　　　　　　　　　　　私は、頻繁に使っています。 テーブルの最後に　

紅　組	白　組
～
E-girls（初）	泉谷しげる（初）

を記述すると、テーブル作成は終わりです。

データが多い時は、メモ帳などで作成してから
ブログに貼ると便利です。

テーブルは、例えば、競馬のしゅっそう表や、TPPのメリット・デメリットの比較、
色々なデータの比較表を作る時に便利です。

文字だけのブログ記事に、変化をつけてみませんか？


～　ストーリーテリングプロジェクト　絶賛活動中！　～

タグ：第２回　ブログで　テーブルタグを使用する。

第１回 ： ブログの記事の中で、リンクを貼りたい。

HTML　タグとは、ホームページを作成する時に使う、
プログラム言語みたいな、コードの事です。

ページの設定、文字の設定から、テーブル、フォームタグなど、
百科事典くらい、たくさんの　HTMLタグがあります。

しかし、最近では、　ホームページを　１からタグで作る
利用価値は少ないです。

なぜなら、　『ブログ』　が発展して、余計な
ページ設定をする事なく、コンテンツ作成により、重視できるからです。

かといって、　HTML　タグは不必要なものかといえば、
そうでもなくて、実は、ブログ記事で使うと便利な　HTML　もあるのです。

今日から、このカテゴリーでは、
ブログで使うと便利な、　HTMLタグについて、お届けします。

さらに！
私も使用している、ブログテンプレート　『LUREA』についても、
（自分で調べて分かった事など）
お届けしたいと思っています。

現在、ブログで記事を書いている人、
将来的には、　『LUREA』を使用したい人に向けて、
お役立ち情報を載せていきます。


第１回　記事文章の中で、リンクを貼る。

第１回目は、ブログ記事の中で、リンクを貼る方法についてお届けします。
例としては、　『ニュースソースはこちら↓』、『詳しい内容についてはこちら→』のように、
リンクを紹介する方法です。


＜ａ　ｈｒｅｆ＝”紹介したいURL”＞
ニュースソースはこちら　↓＜／ａ＞


＜ａ　ｈｒｅｆ＝”　”＞　で、表示したいページのURLを指定し、

ニュースソースはこちら　↓　　のような文章で、リンクがある事を知らせ


＜／ａ＞　　タグの終了を宣言します。


ブログの文章として、記述しましたが、
実際は、　ニュースソースはこちら　↓　以外は、　全て　半角英数字で
記述して下さい。


気になるニュースの元ネタを紹介したり、
文章の途中で、参考ページを紹介する事もできます。

また、

＜ａ　ｈｒｅｆ＝”過去に書いたブログのURL”＞
こちらもおすすめ記事です。　↓＜／ａ＞


というように、自分のブログの　URLを誘導して
アクセスを増やす方法もあります。

ブログ記事にリンクを貼るだけで、滞在時間も増えますし、
より、深く掘り下げた文章を書く事もできます。

ブログを書いている人は、是非、参考にして下さい。




～　ストーリーテリングプロジェクト　絶賛活動中！　～

タグ：第１回　：　ブログの記事の中で、リンクを貼りたい。