< F2D834A E F CC8A >

Size: px

Start display at page:

Download "< F2D834A E F CC8A >"

あかりかがんじ
5 years ago
Views:

1 1. カスタムプラグインとは 2. ブログパーツの活用 3. お店の地図などを表示 4. 常時告知したい内容の表示 5. ちょっと装飾カスタムプラグインを活用してブログのカスタム化をしてみましょう

2 1. カスタムプラグインとはブログ環境設定内にあるカスタムプラグインの登録の箇所で指示するブログの表示設定を入力したりしますカスタムプラグインはブログパーツアフィリエイトのソースなどいつでも表示させて起きたい画像や文をいれて表示させることが出来る機能です表示箇所はブログのサイドバー個別記事の下記事一覧の上部を選択ここの部分で表示方法の切替を行います

3 では個々の指定でどのように表示されるかと言いますとサイドバー記事一覧の上部を指定した場合ブログを表示したときいつでもサイドバーや記事の上部に表示されています個別記事の下を指定した場合は個別記事を表示した時のみ表示されてトップページでの表示等では表示されません個別記事とはコメントなど記入欄が表示される表示方法を言います

4 2. ブログパーツの活用ブロガーさんの趣味趣向により様々なブログパーツがあります画面上に星が降ったり魚が泳いだりサイドバーに占いや時計表示があったりと様々です無料のブログパーツや登録制だったり有料の場合もあるようですまずは試してみることです無料ブログパーツなどで検索してみるといくつもヒットしますがまずは以下のサイトで簡単に説明します無料ブログパーツ工房ここのサイトを開いていただきトップページの気に入った人気のブログパーツの中から選択してみますちら見オヤジを選択しますと次の画面になり下記のウィンドウ上で ctrl + A で全選択後 ctrl+ C でコピーしてブログのフリースペースに貼り付けしてくださいと説明文がありますのでその手順によりコピーします < div style="text-align:center;font-size:8px;width:150px"> < script type="text/javascript" src=" < a target="_parent" href=" ブログパーツ無料 </a></div> このような表示部分をコピーします

5 ブログの環境設定を開いて下方にあるカスタムプラグイン欄まで移動しコピーした記述をカスタムプラグインの 1~3 のどれかに貼り付けますブログパーツの場合はサイドバーを選択しますブログの環境設定の確認登録ボタンをクリックして完了です全てのブログパーツが e しずおかのブログに対応というわけじゃないのでうまく機能しないブログパーツもあったりしますコピーして貼り付ける部分の記述はどのブログパーツも同じようなものですブログパーツサイトとしていくつか紹介します brog parts.com ブログパーツの森

6 3. お店の地図などを表示サイドバーにお店の地図などを小さく表示してあるブログも多いですよね Google map ここのサイトで地図を開き表示したい場所と縮尺の大まかな調整をして地図の右上のリンクと表示されている部分をクリックしますと窓が開き埋め込み地図のカスタマイズとプレビューという部分をクリックします別のウィンドウが開きますのでここで地図の大きさ表示位置を確定します 1. カスタマイズ地図のサイズとしてはカスタムを選択し幅 160 高さ 300 位でセット好みで数値を変更しても構いませんが横幅はサイドバーに幅に調整して見て下さい 2. プレビューここで地図の表示位置を調整 3. サイトに地図を埋め込む場合はこの HTML をコピーして貼り付けます窓に表示されている HTML の記述をコピーします

7 ブログの環境設定を開き下方のカスタムプラグイン欄まで移動しコピーした記述をカスタムプラグインの 1~3 のどれかに貼り付けます表示箇所はサイドバーとしてブログの環境設定の確認登録ボタンをクリックして完了です応用ですが記事投稿においてもお店の紹介なんかで同様に貼り付けてもその場合は地図のカスタマイズの部分の地図の大きさを調節して記事の中で地図が見やすいような大きさに調整するように地図のサイズで小中サイズで貼り付ければ問題ないと思います地図の貼り付けにおいてもブログパーツとして貼付出来ます顔文字教室 ( というサイトのブログパーツにありますこの画面の中の地図で表示位置縮尺を調整すれば右側の貼付用タグが変わりますのでタグをコピーのボタンをクリックしてコピーカスタムプラグインへ貼り付ければ完了ですタグをコピーのボタンで上手くコピー出来ない場合はその箇所をドラッグして

8 コピーして貼り付けて下さい <iframe src=" width="305" height="350" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe> <iframe src=" width="165" height="350" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>

9 4. 常時告知したい内容の表示お店の今月の休日など常時表示したい時に便利です表示箇所は記事一覧の上部がいいかと思います記述方法ですがそのままカスタムプラグインの欄内に文字を入力しても OK ですが味気ないですね HTML にての記述が可能なんですがそこで管理画面サイドにある普段投稿する記事を書く場合の記事投稿を活用します例えば記事投稿欄にて今月の休日は毎週日曜って文字を入力文字を拡大赤に色づけセンター寄せなどを行い本文記入欄の左上のデザインモードのレ点を外すと < div style="text-align:center"> < span style="color:#ff0000"><span style="font-size:150%;line-height:150%;"> 今月の休日は毎週日曜 </span></span></div> こんな記述になりますこれが HTML による記述なんですこれをコピーしてコピーしたあとは投稿記事は投稿も保存もする必要がありませんそのままブログの環境設定を開き下方のカスタムプラグイン欄まで移動しコピーした記述をカスタムプラグインの 1~3 のどれかに貼り付けます表示箇所は記事一覧の上部としてブログの環境設定の確認登録ボタンをクリックして完了です写真などを貼り付ける場合も同じように記事投稿で行えば OK です但しあまり大きすぎたりすると投稿したブログの記事が下方に下がりますので

10 5. ちょっと装飾ただの文章表示だけでは寂しいと思う方はちょっと文字を動かしてみましょう画像やテキストをスクロールさせるタグ文として marquee ( マーキー ) があります < marquee > 今月の休日は毎週日曜 </marquee > って記述すると構文の内側の今月の休日は毎週日曜ってテキスト文が流れてスクロールします前項の構文に対してはサイドに文字を動かすのでセンター寄せは必要ないので < div style="text-align:center"> < span style="color:#ff0000"><span style="font-size:150%;line-height:150%;"> 今月の休日は毎週日曜 </span></span></div> 下線の部分は削除し < marquee >~</marquee> 文を追加 <marquee><span style="color:#ff0000"><span style="font-size:150%;line-height:150%;"> 今月の休日は毎週日曜 </span></span></marquee> このような記述になりますあたまの <marquee>~</marquee> の部分に <marquee direction="right">~</marquee> 左から流れます left はわざわざ使わなくても規程です他にも以下のようなスクロール方法があります上方向にスクロール <marquee direction="up">~</marquee> 下方向にスクロール <marquee direction="down">~</marquee> 左右に行ったり来たりのスクロール <marquee behavior="alternate">~</marquee>

フレームページの作り方那須シニアネット三宅節雄今回は那須シニアネットのホームページと同様に 1バナーとホームページのタイトルなどを入れた top.html 2スライドショーなど構成するページの名前の一覧から各ページへリンクさせた menu.html 3 取り敢えず表紙を飾った main.htm

フレームページの作り方那須シニアネット三宅節雄今回は那須シニアネットのホームページと同様に 1バナーとホームページのタイトルなどを入れた top.html 2スライドショーなど構成するページの名前の一覧から各ページへリンクさせた menu.html 3 取り敢えず表紙を飾った main.htm フレームページの作り方那須シニアネット三宅節雄今回は那須シニアネットのホームページと同様に 1バナーとホームページのタイトルなどを入れた top.html 2スライドショーなど構成するページの名前の一覧から各ページへリンクさせた menu.html 3 取り敢えず表紙を飾った main.html という構成にします 2の一覧からリンクされたページは3の場所に表示されます通常 1のタイトルを表示させるページはスクロールさせません