ホームページデザインの着せ替えができるテンプレート
Home  > テンプレート > テンプレートの使い方その9の2 テンプレ使用ユーザー様の質問集

テンプレートの使い方その9の2 テンプレ使用ユーザー様の質問集 

PAGE TOP


テンプレートを使うのにリンクは必要ですか?
テンプレートの使用に際しリンクは必須では、ありません。
詳しくはダウンロードのページのテンプレートの利用規約参照
通常のバナーだと、ちょっと気になるけど、一応バナーは入れときたいというビミョーな、テンプレート使用ユーザー用の、ダブルバキバキ画像バナーを開発しました(笑)
↓5回点滅して透明になって消える、テンプレート使用ユーザー様専用バナーです。
〓ダブルバキバキ〓ORIGINAL TEMPLATE  ←ここにあります。
画像が見えないときは、ブラウザの更新ボタンを押すと見えます。
テンプレートのフッター部分に使った場合、ほとんど気づかれませんので、使っていただけるとテンプレートを作ったわたしが勝手に喜びます♪ 
ユーザー様専用バナーのリンクの貼り方

PAGE TOP


新しいデザインに変更しようとフォルダを上書きしたらなんかヘンなんです?

「住所は、書かないでね♪」と恥かしがり屋さんのMさんとAZさんからの質問。

Q. 「新しいデザインに変更しようとフォルダを上書きしたらなんかヘンなんです?
    しかも上書きしちゃったんで元に戻らなくなっちゃいました!」

A.  「うーん、さてどうしまひょー?(あわわ)


6月11日の質問の続きですね
さて、デザインを変更するには、スタイル情報の入っているstyleフォルダを上書きすると変更されるわけですが、拡張版の2列と3列のページで背景に2列と3列用の背景画像がまれに残ってしまう症状のかたがいるようです。

自分の環境では、問題ないのですが、何か不具合があると思われるので現在調査中です。
とりあえず、上書きしてデザインを変更する前にバックアップをとることをオススメします。
元のスタイルを残して新しいスタイルに変更する簡単な方法を書いときます。

まず、現在のstyleフォルダの名前を変更します。
例えばstylestyle01のように名前を変更します。
フォルダを右クリック→名前の変更です。

次に、このフォルダに拡張テンプレートのstyleフォルダをコピーすると同名フォルダでなくなるので、上書きされず元のスタイルも残ります。
ここで一度ブラウザでデザインを確認してみてください。

問題なくデザインが表示されているようなら成功だと思われます。
問題がないと確認できましたら、ヘッダーやフッターの背景画像は、テンプレートの画像になっていますので、新規に作ってください。

変更したデザインを元に戻すには、 現在のstyleフォルダの名前をstyle02のように更に違う名前を変更します。(先ほどstyle01としたので違う名前にします。)
今度は、style01styleに名前を変更すると元に戻ります。
ってわかりづらいですね。


もしかして、もしかして
以前に変更した2点と関係があるかもしれません。
拡張テンプレートのスタイルシートの設定を変更しました。 
   3カラム(3列)のテンプレートを、お使いの方だけの変更です。
拡張テンプレートアップしました。 
   5月15日以前のテンプレートを、お使いの方は不具合が出る可能性があります。

main_boxをmain_box_plusに
main_box_reverseをmain_box_reverse_plusに
変更してくださいというのは3列のページをお使いのかただけです。

現在の拡張テンプレートの3列は、すでにそうなってます。
間違えないでいただきたいのは(私の書き方が悪いのかもしれませんね)
2列を、お使いのかたは、そのままの状態
(main_boxまたは、main_box_reverseのままで_plusはつきません)でOKです。

PAGE TOP


検索エンジンで表示される説明文が変だぞ!

たぶん江戸川区近辺に、お住まいであろうTさんの会社のボスからのご指摘。

Q. 「検索エンジンで表示される説明文が変だぞ!」
A.  「うーん、さてどないしまひょー?(あわわ)


そうですメタタグなのです。
これは、ソースの編集で直接編集することも出来ますが誤って間違わないようにするには、やはりホームページビルダーでページを開いてビルダーの上のメニューの

編集
 ↓
背景/文字色の設定
 ↓
ページ情報でページタイトルを変更してください。

次に左から3番目のメタ情報タブをクリックして多分一番上になっている
NAME descriptionを選択して下のの部分で変更できます。

このタイトルとdescriptionは、検索エンジンで表示されるものですので、なるべく魅力的な文章にすることをオススメします。
この辺は、テンプレートというよりもホームページビルダー(つうかHTML)の操作ですのでビルダーの教則本とかに、もっと詳しく書いてあると思うので、そちらを参考にしてみてください。

PAGE TOP


いろいろといじっていたら、元に戻らなくなっちゃいました!

「住所は、書かないでね♪」と恥かしがり屋さんのMさん、
他2名様(関西方面に、お住まいのHさん含む)からの質問。

Q. 「いろいろといじっていたら、たぶん必要であろう部分
    までもが消えちゃったようで元に戻らなくなっちゃいました!」

A.  「うーん、さてどうしまひょー?(あわわ)


急がば回れです。
元に戻す方法は、いろいろあるのですが例えばページ編集でソースをいじるなんてのは、初心者のかたにとって難しいと思うので、ここでは説明しません。

確実に直すには、新たに作り直すのが確実だと思います。
って、ぜんぜん回答になってませんね(笑)
そんなわけで!基本テンプレートを変更しました。

けっこうデリケートなんです。ボク(笑)
ダブルクリックで選択して、デリートキーで一気に削除とかすると、HTMLページ内の大事なスタイル(DIVとか)を、いつのまにか削除してしまい、元に戻せないというかたが多いようなので、基本テンプレートだけ、ヘッダーとフッターをテーブルを使った縦2段組みの仕様に変更しました。(すでに昨日の夜に変更してます。 ききっ、昨日って?)

テーブルだと誤って消してしまう危険性が減るのではと変更しました。
但し、テーブルをビルダーの編集画面でつまんで大きさを変えたりすると、またレイアウトが変わったりするので(テーブルの巾を100パーセントにしてあります。)、なるべくいじらないほうがいいかなと思います。

テンプレートは、なるべくテーブル(特にレイアウト目的)の使用を控えようと思っていたのですが、これからは、基本テンプレートに限っては、扱いやすさを優先することにします。

PAGE TOP


少しはみ出しています

【今日の回答】
静岡県に、お住まいのCさんからの、ご質問
Q. 「拡張セットのindex.html内で、side_menu.htmlがインラインフレームで表示されています。 左クリックでドラッグすると分かるんですが、side_menu.htmlがちょうど1pxほどインラインフレームの枠より大きい表示サイズなのか、少しはみ出しています。
はみ出しているというのは変な表現かもしれません。
style.cssやindex.htmlのソースを見ると何の問題もないように見えるのですが・・・
何か対処法がありますでしょうか?」


A. 「あわわわわ(あたふた、あたふた汗)
 ぜんぜん気がつきませんでした。(反省)」

そうですね、一見何の問題もないように見えますが、フロートで並べているmenuに背景のラインを合わせる為に、左メニューの場合だとmenuの左側に 1pxのborderを入れているのが原因だと思われます。

本文を書くメイン部分とメニュー部分のレイアウトに、なるべく paddingやborderを使わないようにしていたのですが、背景画像を作るのがめんどくさいので、安易にborderを使ってしまった私が悪いのです。 悩ませてしまってごめんなさいです。

とりあえず、インラインフレーム内のメニューの巾を199pxくらいにすれば直るのですが、Firefoxで見てみると、今度は思いっきりカラムが落ちてたのを発見したので、本格的に直すことにしました。

ついでに、前から作り直そうと思っていた左メニューレイアウトを変更(追加か?)しました。題して

【SEO対策テンプレート】
↑わたしが言ってるだけで、もどきです(笑) 効果の程は期待できません(ひゃっほう♪)

以前の左メニューのレイアウトも、そのまま使えますが初めて、ご利用される方は、こちらの[SEO]タイプの方をオススメします。(右メニューの変更は、ありません。)

拡張テンプレート以外のスタイルは、まだ変更しておりませんので、2〜3カラムでお使いのかたは、もしかしたら不具合が出てるかもしれませんので、なるべく早く直すようにします。

テンプレートダウンロードのページへ

PAGE TOP


ブラウザでの解釈の違いに悩む

例えば、width 300px、padding 10px、border 10pxでスタイルを書きますよね。
↓こういうの

MARY HAD A LITTLE LAMB
Mary had a little lamb
His fleece was white as snow,yeah
Everywhere the child went
You know the lamb was sure to go,yeah


↓スタイルシートの記述は、こんな感じ。(ビルダー君に書いてもらいました。)
width : 300px;
height : 100px;
padding-top : 10px;
padding-left : 10px;
padding-right : 10px;
padding-bottom : 10px;
border-width : 10px 10px 10px 10px;
border-color : gray gray gray gray;


↓これを、ウインドウズのインターネットエクスプローラーで見ると、こうなります。
Win IEの解釈(↓キャプチャーした画像)
これは、画像です。Win IE
paddingとborderまでを含めて巾300pxと解釈。
いわゆるIEのバグと言われているもの。


↓Mozilla Firefoxで見るとこうなってます。
Firefoxの解釈(↓キャプチャーした画像)
これは、画像です。Firefox
paddingとborderの巾を足して巾340と解釈。
W3C準拠と言われているやつですか。


バキバキテンプレートでは、こうならないようにレイアウト部分にpaddingとborderを使わず、余白の調整は、レイアウトしたDIV内に余白等の情報を入れたBOXを入れ子にした作りで回避してます。(今回から、そうなってるといいんですけどね)

参考リンク
Google 検索 解釈の違い width

きょうの話は、小難しくてちょっとつまんなかったですね(笑)

PAGE TOP


3カラムのHTMLページを変更してます。
以前の3カラムの背景部分が2カラムのものと共通だったのを、3カラムの時は、3カラム用の背景になるように変更しております。
そのまま、ご使用になっても、特別支障は、ないと思いますが(2カラム用の背景でも違和感はないと思われます。)
変更されるかたは、お手数ですが、ソースの変更をお願い致します。
main_boxmain_box_plus
main_box_reversemain_box_reverse_plusというように
_plusをつけてください。
2カラムで、お使いの方は、問題なく、そのまま使用できます。
テンプレートダウンロードのページへ

PAGE TOP


サイト名の画像は、どこにありますか?

神奈川県在住のTさんへ
このへんがわかりづらかったんじゃないですか?
テンプレートの使い方その3 タイトルの変更をしましょう♪
↑どうも、このページの意味が、わかりづらいようなので書き直しました。
テンプレートのヘッダー部分にあるサイト名がヘッダーの背景と一体で作られているっていうのが、いまいちわかりづらいようですね。

通常、サイト名は、単体の画像で作っているのがほとんどですが、バキバキテンプレートでは、サイト名の背景に画像を使った場合、サイト名の画像と背景とが馴染まないのを防ぐ意味もあってこういう作りになってます。(他にも意味があるのですが今回は省略。)

【例題】
↓薄い背景の上に画像を挿入した場合なら、それなりに溶け込むのですが


↓濃い背景に透過GIFを挿入した場合、背景と馴染まない例。

さらに、わかりづらくなったかもしれません(笑)
Tさん、ホームページ完成したら報告くださいね(~_~;)

PAGE TOP


ホームページビルダー以外では、使えないのでしょうか?

いつも、するどい質問でドキドキさせてくれる、
やっぱり関西方面に、お住まいだったHさんからの、ご質問。
Q. 「テンプレートは、ホームページビルダー専用テンプレートとなってますが、
    ホームページビルダー以外では、使えないのでしょうか?」

A.  「たっ、たぶん使えます。(自信なさげ汗)

試していませんが...
一応、ホームページビルダー専用テンプレートとなってますが、そのままメモ帳で書き換えたり、ビルダー以外のオーサリングソフトでも使えるんじゃないかと思ってます。

でもね、バキバキテンプレートは、デザインレイアウトのみのテンプレートではなく、操作性、例えば文字の装飾等が簡単に設定できるような設計をしております。(←偉そうですね)

つーまーり、ホームページビルダーの基本操作さえマスターしていれば、ニャンコボタンを駆使しすることによって、スタイルシートが簡単に使えるような初心者向けのテンプレートを目指していますので、ホームページビルダーを使っての作成を強くおすすめします。

つーか、エディタでタグ打てる人やドリームウィーバーをバリバリ使いこなしている人は、テンプレート自体を使わないんじゃないのかなーなんて思ったりしてます。

PAGE TOP


自分でオリジナルなスタイルを追加したんですけど、これで大丈夫かしら?

今日も、たぶん関西方面に、お住まいのHさんからの、ご質問。
Q. 「頑張って、自分でオリジナルなスタイルを追加したんですけど、これで大丈夫かしら?」
A.  「ホームページ拝見させていただきました。 うーん、グッドです♪ナイスです

自分で、新規に追加したスタイルは、まさにオリジナルでマイノリティーな味わいがあって、ホームページ作りを、とても楽しんでらっしゃるなって感じがでてますよ。

ただ、間違いじゃないんですが(もともとテンプレート自体に正しい使い方など存在しませんので)、オリジナルなスタイルを追加するときは、なるべく基本スタイル情報が入っているcss/style/style.css には、追加しないほうが、いいと思います。
←これに追加しない

←こっちに追加する

理由は、テンプレートの改造方法のページを更新しましたので、そちらをどうぞ
テンプレートの改造方法のページを開く


Hさんへ、細かいことを書いてしまいましたが、バキバキテンプレートは、どんな使い方をされてもかまいません。 あなたのなにげない質問で、テンプレートは、どんどん進化します。
いやテンプレートじゃなくて、わたし自身の文章の表現能力が、すこしだけアップした気がします。
感謝いたします。(まだ、Hさんのホームページをリンクしちゃダメかしら)

PAGE TOP


広告バナーを入れると、レイアウトが崩れてしまいます。
アフィリエイトバナーに対応しました!?

今回も、たぶん関西方面に、お住まいのHさんからの、ご質問。

Q. 「広告バナーを入れると、レイアウトが崩れてしまいます。」
A.  「こっ、これも、バグではなく仕様です(冷や汗)

ていうか、テンプレートのレイアウトは、ある程度巾が決まっておりますので、この巾より大きい画像を入れるとレイアウトが崩れだします。
2〜3列のレイアウトですとメニュー部分が下に落ちる場合があります。

そこで、広告バナーのサイズは、ある程度決まった大きさなので一般的なものならレイアウトが崩れないように文字を書く箱(box)の部分の余白を微調整しました。
拡張テンプレートのバナーでレイアウト確認(banner_size.html)のページを参照願います。

変更するには、現在お使いのスタイルを、もう一度ダウンロード後、解凍した
styleフォルダ内のstyle.cssだけを上書きするだけです。
ビミョーな変更なので、レイアウトが崩れないかたや、よくわからないという方は、必要ないかもしれません。
デザインサンプルのダウンロードのページへ

↓バナーのサイズは、こちらのサイトを参考にさせていただきました。
Webサイトデザイン基礎知識[小道具屋] > バナーサイズって?

PAGE TOP


スタイルを設定した文字を、変更しようとしたらアイコンが2つになるんですけど?

たぶん関西方面に、お住まいのHさん、その他おおぜいの方からの、ご質問。
Q. 「スタイルを設定した文字を、変更しようとしたらアイコンが2つになるんですけど?」
A.  「これは、バグではなく仕様です(汗)

一度、文字に設定したスタイルを変更するのに、ホームページビルダーのニャンコボタンでスタイルを変えると、スタイルが2重に設定されてしまうことあるようです。
【スタイルを変更してアイコンが増えたときの直し方】

その1 ↓まず、文字にスタイルを設定しますね。
バグではなく仕様です 

その2 ↓次に設定したスタイルを変更すると、なぜかこうなるときがある。
バグではなく仕様です 

これは、変えようとしたスタイルが変更されず、新たにスタイルが追加され2重に設定されてしまうのが原因です。 こうなった時は、無理にスタイルを変更しようとせずに、一度設定したスタイルを解除したほうが、うまくいくと思います。 

ホームページビルダーでスタイルを解除する方法は、こうです。
↓スタイルを設定した文字に、カーソルを合わせると薄いピンクの枠で囲まれます。
バグではなく仕様です
 スタイルの種類によっては、グレーの枠の場合もあります。
 適用された文字全てを選択しなくてもいいようです。

その3 ↓ピンクの枠が出た状態で、魚ボタンを押すとスタイルが解除されます。
 
魚ボタン
ピンクの枠が消えたらスタイルの解除完了です。
もういちどニャンコボタンでスタイルを設定してください。
んごんご!できたかな?

関連リンク ニャンコボタンとは?

PAGE TOP


インラインフレーム内のリンクを親ウインドウにするのがめんどくさいんですけど

北海道の匿名希望(ほとんど身内)さんからの、するどいご意見。
Q. 「インラインフレーム内のリンクを親ウインドウにするのがめんどくさいんですけど...」
A.  そうです、ついつい忘れますね。 そこで、ネットで勉強しました。
    結果は、改版履歴その2を、どうぞ。


ヘッダーとフッターとサブメニューのページ内のリンクは、全て親ウィンドウで開くようにHTML部分を変更しました。 
以前のテンプレートをお使いのかたは、お手数ですがインラインフレームで表示される
header.html footer.html side_menu.htmlを、ホームページビルダーで開いて、HTMLソースの編集画面で<base target="_parent">を、
↓この辺に追加してください。

<link rel="stylesheet" href="css/style/style.css" type="text/css">
<link rel="stylesheet" href="css/extension/extension.css" type="text/css">
<link rel="stylesheet" href="css/user/user.css" type="text/css">
<base target="_parent"> 
<STYLE type="text/css">


もちろんリンクを親ウインドウで指定していれば追加しなくても、そのまま使えます。

バキバキテンプレートは、ソースを変更しないで済むような初心者向けのテンプレートを目指してますので、HTML部分の変更は、できればやりたくなかったのですが、親ウインドウ指定を忘れるのを防ぐ為に、ソースに1行足しました。(なんで早くこれに気がつかなかったんだと反省しております。)

PAGE TOP


テンプレートは、どこまで改造してもいいですか?

Q. 「どこまで改造してもいいですか?」大阪のSさん(他少数の皆さん)からの質問
A.  テンプレートの説明ページにもあるように、改造は、自由です。
原形が無くなるくらい、カスタマイズ(改造)しちゃって楽しんでください。


わたしの考えは、既存のテンプレートをそのまま使うのも、それはそれでいいのですが、やはりせっかく自力でホームページを作るのなら、デザインもオリジナルで作る楽しさを味わっていただきたいと思っています。


当サイトの骨組みとなる全体のデザインも(特にスタイルシートのレイアウト部分)、
CSSデザインテンプレート さんのテンプレートが元になってます。(感謝♪感謝♪)
改造自由となってましたので、いろいろいじくっているうちに、こんなんなっちゃいました。(笑)
でも、その場の思いつきでスタイルに名前つけちゃったりしたんで、実は、けっこう使いづらいんですよね。 無駄なスタイルの数も多いし。


とりあえず文字の大きさと色の変更だけでも、サイトのイメージがガラリと変わると思いますので、是非試してみてください。 いじればいじるほど、あなた自身のオリジナルデザインになっていくと思います。

参照:テンプレートを改造するには? 

PAGE TOP



前に見てたページに戻る



PAGE TOP