綺麗なランディングページが欲しい!
でも、プロに頼むと色々問題が・・。
そんなあなたに、プロと同じとはいえませんが、
ランディングページを
手作りできる情報をお届けします。
×
[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
前回までのページ
⇒ http://zimaginezz.jp/testlp15.html
「こちらをクリックして頂き」 の次に
クリックボタンのような画像があると分かりやすいですね。
今回は、 ここに 画像を挿入します。
********************
こちらをクリックして頂き、<br><br>
<img src="fbbtn10.jpeg"><br>
さらに有益な情報をお受け取り下さい!<br>
********************
一旦、文章から リンクタグをはずし、
文章 2行の間に <img> タグで 画像を挿入しています。
表示結果は こちら
⇒ http://zimaginezz.jp/testlp16.html
最後に挿入した画像にリンクを貼ります。
********************
********************
一旦、文章から リンクタグをはずし、
文章 2行の間に <img> タグで 画像を挿入しています。
表示結果は こちら
⇒ http://zimaginezz.jp/testlp16.html
最後に挿入した画像にリンクを貼ります。
********************
こちらをクリックして頂き、<br><br>
<a href="メルマガの登録フォームのURL">
<img src="fbbtn10.jpeg" border="0">
</a>
<br>
さらに有益な情報をお受け取り下さい!<br>
********************
文章に記述していた リンクタグを
画像の挿入タグに変更するだけです。
<img> タグの中の border="0" は、
リンクした際の画像の表示枠を消すための
コードです。
完成品はこちら
⇒ http://zimaginezz.jp/testlp17.html
border コードを記述しておくことで、
リンクのある画像を綺麗に表示できます。
最近では、ブログが主流となって、タグでウェブページを
作成する機会が減ったのですが、
読者を獲得する率の高いランディングページは
やはり、必要です。
簡単ではありますが、 個性的な LPを作成することで
ビジネスを大きく成長させて下さい。
********************
文章に記述していた リンクタグを
画像の挿入タグに変更するだけです。
<img> タグの中の border="0" は、
リンクした際の画像の表示枠を消すための
コードです。
完成品はこちら
⇒ http://zimaginezz.jp/testlp17.html
border コードを記述しておくことで、
リンクのある画像を綺麗に表示できます。
最近では、ブログが主流となって、タグでウェブページを
作成する機会が減ったのですが、
読者を獲得する率の高いランディングページは
やはり、必要です。
簡単ではありますが、 個性的な LPを作成することで
ビジネスを大きく成長させて下さい。
PR
LP の文章が少し長くなって、
ページがスクロールした時
背景が固定されていた方が
かっこいい時があります。
背景の固定は、 <body> タグの中で設定します。
<body bgcolor="#ffffff" background="ファイル名" bgproperties="fixed">
bgproperties="scroll"
と記述すると、背景画像を固定せず、スクロールします。
bgproperties の記述がない場合は、
特に設定もなく、背景も一緒にスクロールします。
ページがスクロールした時
背景が固定されていた方が
かっこいい時があります。
背景の固定は、 <body> タグの中で設定します。
<body bgcolor="#ffffff" background="ファイル名" bgproperties="fixed">
bgproperties="scroll"
と記述すると、背景画像を固定せず、スクロールします。
bgproperties の記述がない場合は、
特に設定もなく、背景も一緒にスクロールします。
緊急企画
グーグルアドセンス 終了
私の公式ブログは審査が終わったのですが、
個人的なホームページがまだ、エラーです><
いま、調査中・・・
アドセンス開始まででも、即日 審査なしのアフィリエイトがあります!!
⇒ http://urx.blue/0ckd
グーグルアドセンス 終了
私の公式ブログは審査が終わったのですが、
個人的なホームページがまだ、エラーです><
いま、調査中・・・
アドセンス開始まででも、即日 審査なしのアフィリエイトがあります!!
⇒ http://urx.blue/0ckd
実は、文字の背景は違うタグで変えて、
テーブルはテーブルできちんと説明する予定だったのですが、
自分が、スタイルシートを使っていなかったので、
背景の色とテーブルが混ざってしまいました。
すみません。 ><
最初から、テーブルを使用する時の
最初のテンプレートは、記事にのせておきましたので、
そちらをコピペして、本文をいれてくれれば、
できるようにしておきました。
前回のページ
⇒ http://zimaginezz.jp/testlp11.html
なかなか、見ごたえのあるページになってきました。
しかし、テーブルタグを使用する前、
冒頭の3行
文中の 「しかし」
最後のクリック部分
が、左寄せになっていますね。
今回は、こちらを調整していきます。
<td> テキストエリアの表示
<th> 見出しの表示
テーブルタグには、テキストを表示する タグと
見出しを表示する タグの2種類があります。
<td> は通常のテキストエリアで、左寄せの表示します。
,<th> は、見出しのように、中央寄せで表示します。
こちらのタグを使ってページを調節していきます。
今回は、少し タグが入り組んで 複雑になるので
ページの上部から順番に説明していきます。
テーブルはテーブルできちんと説明する予定だったのですが、
自分が、スタイルシートを使っていなかったので、
背景の色とテーブルが混ざってしまいました。
すみません。 ><
最初から、テーブルを使用する時の
最初のテンプレートは、記事にのせておきましたので、
そちらをコピペして、本文をいれてくれれば、
できるようにしておきました。
前回のページ
⇒ http://zimaginezz.jp/testlp11.html
なかなか、見ごたえのあるページになってきました。
しかし、テーブルタグを使用する前、
冒頭の3行
文中の 「しかし」
最後のクリック部分
が、左寄せになっていますね。
今回は、こちらを調整していきます。
<td> テキストエリアの表示
<th> 見出しの表示
テーブルタグには、テキストを表示する タグと
見出しを表示する タグの2種類があります。
<td> は通常のテキストエリアで、左寄せの表示します。
,<th> は、見出しのように、中央寄せで表示します。
こちらのタグを使ってページを調節していきます。
今回は、少し タグが入り組んで 複雑になるので
ページの上部から順番に説明していきます。
<html>
<head>
<title>ページのタイトル</title>
</head>
<body bgcolor"#ffffff" text="#000000" background="背景の画像ファイル"
alink="#ff0000" vlink="#ff0000" link="#ff0000">
<center>
<table border="0" cellpadding="10">
<tr><td bgcolor="#ffffff">
ここに本文を挿入する。
</td></tr>
</table>
</center>
</body>
</html>
こちらに再度、上部から文章を挿入します。
文章はコピペで挿入できます。
まず、冒頭の3行。
********************
<td> に変わって、 <th> を使用しています。
これで、冒頭の3行は、見出しとして表示します。
表示結果はこちら
⇒ http://zimaginezz.jp/testlp13.html
中央寄せで表示できましたね。
次の文章は、左寄せで表示したいので、 <td> タグを使います。
********************
こちらに再度、上部から文章を挿入します。
文章はコピペで挿入できます。
まず、冒頭の3行。
********************
<html>
<head>
<title>サンプルペーj</title>
</head>
<body bgcolor="#ffdead" background="ib1.jpg" text="#000000"
link="#adff2f" alink="#adff2f" vlink="#adff2f">
<center>
<table border="0" cellpadding="10">
<tr><th bgcolor="#ffffff">
<h1>
<font color="#ff0000">
2019年 3月 31日<br>
テンプレート 「賢威」 販売終了<br>
次に来るテンプレートは?
</font></h1>
</th></tr>
</table>
</center>
</body>
</html>
********************
********************
<td> に変わって、 <th> を使用しています。
これで、冒頭の3行は、見出しとして表示します。
表示結果はこちら
⇒ http://zimaginezz.jp/testlp13.html
中央寄せで表示できましたね。
次の文章は、左寄せで表示したいので、 <td> タグを使います。
********************
<html>
<head>
<title>サンプルペーj</title>
</head>
<body bgcolor="#ffdead" background="ib1.jpg" text="#000000"
link="#adff2f" alink="#adff2f" vlink="#adff2f">
<center>
<table border="0" cellpadding="10">
<tr><th bgcolor="#ffffff">
<h1>
<font color="#ff0000">
2019年 3月 31日<br>
テンプレート 「賢威」 販売終了<br>
次に来るテンプレートは?
</font></h1>
</th></tr>
<tr><td bgcolor="#ffffff">
<h4><font color="#008000">
もし、あなたが ブログのテンプレートに<br>
迷っているのならば、<br>
特別に今、有益な情報を公開しています。<br>
「賢威」 が SEO対策史上<br>
最高級のテンプレートである事は<br>
間違いありません。<br>
しかし、令和に元号が変わった今、<br>
「賢威」を新たに入手する事は不可能なのです。
</font></h4>
</td></tr>
</table>
</center>
</body>
</html>
********************
表示結果はこちら
⇒ http://zimaginezz.jp/testlp14.html
中央に寄せたい文章を <th></th> タグで囲み
左寄せに表示したい文章を <td></td> で 囲みます。
しかし から クリック部分までの 2つのタグでレイアウトします。
********************
********************
表示結果はこちら
⇒ http://zimaginezz.jp/testlp14.html
中央に寄せたい文章を <th></th> タグで囲み
左寄せに表示したい文章を <td></td> で 囲みます。
しかし から クリック部分までの 2つのタグでレイアウトします。
********************
<html>
<head>
<title>サンプルペーj</title>
</head>
<body bgcolor="#ffdead" background="ib1.jpg" text="#000000"
link="#adff2f" alink="#adff2f" vlink="#adff2f">
<center>
<table border="0" cellpadding="10">
<tr><th bgcolor="#ffffff">
<h1>
<font color="#ff0000">
2019年 3月 31日<br>
テンプレート 「賢威」 販売終了<br>
次に来るテンプレートは?
</font></h1>
</th></tr>
<tr><td bgcolor="#ffffff">
<h4><font color="#008000">
もし、あなたが ブログのテンプレートに<br>
迷っているのならば、<br>
特別に今、有益な情報を公開しています。<br>
「賢威」 が SEO対策史上<br>
最高級のテンプレートである事は<br>
間違いありません。<br>
しかし、令和に元号が変わった今、<br>
「賢威」を新たに入手する事は不可能なのです。
</font></h4>
</td></tr>
<tr><th bgcolor="#ffffff">
<h2><font color="#0000ff">
しかし!<br>
</font></h2>
</th></tr>
<tr><td bgcolor="#ffffff">
<h4><font color="#008000">
賢威と劣らず 優れたテンプレートはまだあります。<br>
今はまだ、固定化された情報の中でしか、<br>
見えないものもあるのです。<br>
ブログをこれから構築しようとしている 今<br>
改めて、認識を深く掘り下げてみませんか?<br>
</font></h4>
</td></tr>
<tr><th bgcolor="#ffffff">
<h1><font color="#ff0000">
<a href="ltest20.html">
こちらをクリックして頂き、
</a><br>
さらに有益な情報をお受け取り下さい!<br>
</font></h1>
</th></tr>
</center>
</body>
</html>
*********************
出来上がりはこちら
⇒ http://zimaginezz.jp/testlp15.html
改善する余地はあるものの、
LPとしては、十分機能できていると思います。
<th> <td> を使い分けることで、
LPとして稼働できる ウェブページが作成できます。
もし機械があれば参考にしてみてください。
*********************
出来上がりはこちら
⇒ http://zimaginezz.jp/testlp15.html
改善する余地はあるものの、
LPとしては、十分機能できていると思います。
<th> <td> を使い分けることで、
LPとして稼働できる ウェブページが作成できます。
もし機械があれば参考にしてみてください。
<html>
<head>
<title>ページのタイトル</title>
</head>
<body bgcolor"#ffffff" text="#000000" background="背景の画像ファイル"
alink="#ff0000" vlink="#ff0000" link="#ff0000">
<center>
<table border="0" cellpadding="10">
<tr><td bgcolor="#ffffff">
ここに本文を挿入する。
</td></tr>
</table>
</center>
</body>
</html>
次のページ
>>
プロフィール
HN:
hsorimatihh
性別:
非公開