1
00:00:00,390 --> 00:00:05,960
ようこそ私たちのいくつかのビデオは、私たちのブログのモデルを作成し、私たちはこのビデオでは、インデックスのテンプレートを追加したブログのアプリをセットアップして得た。

2
00:00:06,210 --> 00:00:07,540
 

3
00:00:07,560 --> 00:00:10,070
実際には新しいルートを実際に追加することはありません。

4
00:00:10,090 --> 00:00:13,590
これは非常に速くなりますが、ヘッダとフッタのParshallを追加したいと思います。

5
00:00:13,680 --> 00:00:16,030
そして、セマンティックUIも含めたいと思っています。

6
00:00:16,040 --> 00:00:18,980
そして最後に、上に本当に簡単なナビゲーションバーを追加します。

7
00:00:19,380 --> 00:00:23,990
では、Ejayをファイルとしてヘッダとフッタを作成してみましょう。

8
00:00:24,660 --> 00:00:26,810
そして、それが表示されたディレクトリの中にあるべきである。

9
00:00:26,820 --> 00:00:34,200
ParshallのスラッシュフッターEをスラッシュして、ParshallのスラッシュフッターEをスラッシュしたParshallのスラッシュHetterをスラッシュして表示します。

10
00:00:34,200 --> 00:00:40,990
J. すばらしいです。

11
00:00:41,430 --> 00:00:42,060
さあ、それらを開いてみましょう。

12
00:00:42,060 --> 00:00:45,990
ヘッダーから始めましょう。

13
00:00:46,290 --> 00:00:47,960
そしてなぜHDのメタルヘッドのタイトルなのか基本的なスケルトンではなかったのです。

14
00:00:48,570 --> 00:00:54,990
 

15
00:00:55,470 --> 00:01:02,540
私たちはそれをブログアプリと呼ぶでしょうし、私たちの体はそれと同じように必要なので、これをフッタに移動して、今はそれをカットし、それが機能していることを知るようにします。

16
00:01:02,790 --> 00:01:07,010
 

17
00:01:07,140 --> 00:01:14,310
一番上の段落をヘッダーファイルから追加してみましょう。すべてのページで、正しく行ったことが分かると思います。

18
00:01:14,310 --> 00:01:16,710
今度はフッターペーストを開いて、同じことをフッターセーブから行うことができます。

19
00:01:16,710 --> 00:01:18,060
 

20
00:01:22,980 --> 00:01:30,110
これをリンクして、インデックスから開始して開始する必要があります。

21
00:01:30,450 --> 00:01:33,890
したがって、先頭にはインクルードが必要です。インデックスファイルではなく、私たちの道があります。

22
00:01:34,140 --> 00:01:42,360
だから、ちょうどドットスラッシュParshallのスラッシュヘッダーがほしい。

23
00:01:42,780 --> 00:01:47,780
そして、同じことをここではParshallのスラッシュにします。

24
00:01:48,240 --> 00:01:53,280
これまでのところそれをテストしてみましょう。そして、私たちは足からのヘッダーファイルか5から得ます。

25
00:01:53,700 --> 00:02:02,130
すばらしいです。

26
00:02:02,430 --> 00:02:02,990
さて、セマンティックUIを追加しましょう。

27
00:02:03,180 --> 00:02:05,530
だから、私はこのセマンティックなUIウェブサイトオープンセマンティックダッシュあなたがドットコムを持っている。

28
00:02:05,880 --> 00:02:10,590
ブートストラップのように、ファイルをダウンロードするか、CDNセマンティックUI CDNを含めることができます。

29
00:02:10,620 --> 00:02:18,080
この最初の例をクリックすると、私たちが選ぶことができるたくさんの異なるファイルがあることがわかります。

30
00:02:18,530 --> 00:02:23,790
 

31
00:02:23,790 --> 00:02:24,630
 

32
00:02:24,810 --> 00:02:30,120
 

33
00:02:30,300 --> 00:02:37,200
セマンティックUIは、ブートストラップとは違ってセマンティックUIの仕組みが整っているのは、あなたが望むものが私たちのセクションの後ろにあるか、単にフォームを必要とするだけだからです。

34
00:02:37,560 --> 00:02:39,000
 

35
00:02:39,000 --> 00:02:43,770
SSブートストラップの批判の一つである全体を必要としないので、小さな断片だけが必要な場合は、まだライブラリ全体を取らなければなりません。

36
00:02:43,770 --> 00:02:46,510
しかし、私たちはライブラリ全体が必要です。

37
00:02:46,770 --> 00:02:48,420
 

38
00:02:48,420 --> 00:02:55,920
 

39
00:02:55,920 --> 00:03:04,190
だから、これらすべてのイディオムをスクロールすると、意味論的なことを言いたいCDNがあります。検索やセマンティクスを行うだけでは、ここでの再評価が得られます。あなたがわからない場合や探している場合は見つけるのが難しいですがちょうど検索を行います。

40
00:03:04,190 --> 00:03:05,920
物事をより速くするために、実際にはちょっとしたバージョンをとってはいけません。

41
00:03:06,000 --> 00:03:09,320
 

42
00:03:09,360 --> 00:03:16,950
だから、人間が評価していることを意味するセマンティックです。あなたはErlをコピーして、頭の中のヘッダーファイルに上書きします。

43
00:03:17,340 --> 00:03:20,040
それは長さのタグです。

44
00:03:20,490 --> 00:03:22,300
そして、私たちはそれがリンクであることを望んでおり、そしてrefはそれと同じです。

45
00:03:22,950 --> 00:03:29,030
はいはい。

46
00:03:29,120 --> 00:03:30,260
また、relスタイルのシートタイプとテキストスラッシュを追加する必要があります。

47
00:03:30,420 --> 00:03:34,900
C Ssこれで、サーバーを保存して再起動します。

48
00:03:34,940 --> 00:03:40,500
私たちのホームページを見てみると、最初にブートストラップをインストールしたときのように、フォントの変更が少し変わったような小さな変化が見られます。

49
00:03:41,640 --> 00:03:47,160
 

50
00:03:47,250 --> 00:03:49,070
OK。

51
00:03:49,560 --> 00:03:49,830
 

52
00:03:49,830 --> 00:03:57,720
つまり、ヘッダーとフッターの段落を取り除き、代わりに単純なナビゲーションバーをキューに追加しましょう。

53
00:03:57,870 --> 00:04:01,180
今はもちろんメニューと呼ばれています。

54
00:04:01,230 --> 00:04:03,740
 

55
00:04:03,990 --> 00:04:12,810
だから私たちがここに行くなら、すべての異なるコンポーネントをメニューでクリックし、コレクションのメニューの下にあるメニューを見つけたいと思う。

56
00:04:12,810 --> 00:04:16,170
メニューにはかなりの種類があります。

57
00:04:16,170 --> 00:04:18,630
ここに表示されているメニューがあります。

58
00:04:18,860 --> 00:04:22,190
ポインティングメニューがあり、そこには表形式のテキストがあります。

59
00:04:22,500 --> 00:04:32,090
私たちの体の一番上をdivにしてこれを適切に取得することが必要ですが、必要なものはさらにいくつかあります。

60
00:04:32,470 --> 00:04:40,450
 

61
00:04:40,590 --> 00:04:43,170
ケイトはあなたと同等のクラスです。

62
00:04:43,170 --> 00:04:46,340
私は修正し、ちょうどブートストラップのように色を変える反転メニューを実行します。

63
00:04:46,340 --> 00:04:52,170
あなたは詩で言うことができ、そこには別のdivが必要です。

64
00:04:52,170 --> 00:04:57,410
そして、これは、あなたがブートストラップされたコンテナのようなあなたのコンテナと等しいクラスを持つことになります。

65
00:04:58,020 --> 00:05:03,830
そしてそこに代わりに別のdivがあり、これはHetter項目に等しいクラスを持ちます。

66
00:05:04,260 --> 00:05:10,030
これはブートストラップのnav barブランドのようなものです。

67
00:05:10,320 --> 00:05:13,550
だから私たちは、子供たちがブログのサイトや、私たちのアプリケーションを呼びたいものを何でもしたいと思っているものすべて。

68
00:05:13,560 --> 00:05:18,920
 

69
00:05:19,050 --> 00:05:28,830
 

70
00:05:28,860 --> 00:05:37,140
その後、ホームページのアンカータグを追加して、それを家に呼び出すと、アイテムに等しいクラスで追加します。その後、スラッシュにするのではなく、同じことを行いますスラッシュログに行くスラッシュはまだ存在しないし、それは冷たい新しい投稿または新しいブログになります。

71
00:05:37,140 --> 00:05:45,350
それは私たちが見るテキストになります。

72
00:05:45,410 --> 00:05:47,470
OKので、あなたは反転メニューを修正していません。

73
00:05:48,350 --> 00:05:51,760
その代わりにコンテナ。

74
00:05:51,900 --> 00:05:53,460
そして、コンテナの中に私たちは実際にこの小さな間違いのすべてを自分のところに持っていなければなりません。

75
00:05:53,670 --> 00:06:00,010
だから私たちはそこにも存在することを望んでいる。

76
00:06:00,060 --> 00:06:02,670
それはすべてコンテナに入っています。

77
00:06:03,360 --> 00:06:04,850
そしてヘッダーがあり、それから固定されたTexという2つのアイテムがあります。

78
00:06:05,160 --> 00:06:10,250
今それを見てみましょう。

79
00:06:10,260 --> 00:06:12,200
そして、私たちは簡単な数学バーを手に入れます。

80
00:06:13,500 --> 00:06:15,200
はい、ここに問題があります。

81
00:06:15,520 --> 00:06:17,720
私たちはすぐにそれを処理しますが、今はうまく動作するところがあります。

82
00:06:17,730 --> 00:06:21,450
セマンティックであなたは単にアイコンと呼ばれる単純なアイコンを追加しましょう。

83
00:06:21,660 --> 00:06:27,450
私が使ったものにはたくさんのものがあります。

84
00:06:28,070 --> 00:06:30,690
コードと呼ばれています。

85
00:06:30,720 --> 00:06:32,960
ここでそれを見つけて検索してみてください。

86
00:06:33,120 --> 00:06:35,500
そこにそれがある。

87
00:06:35,550 --> 00:06:36,310
しかし、あなたがコメントが好きなら、あなた自身を選んで自由に感じてください。

88
00:06:36,480 --> 00:06:39,760
アイデアは、それはコードベースのブログだったが、他にもあるかもしれない。

89
00:06:39,810 --> 00:06:43,560
私はアイデアも好きです。

90
00:06:43,560 --> 00:06:44,900
とにかくそれらの束があります。

91
00:06:44,920 --> 00:06:46,190
いいのは、企業にとって有用なアイコンがたくさんあることです。

92
00:06:46,350 --> 00:06:51,980
一番下には彼らがいると思います。アプリケーションにリンクしていた数多くの異なるブランドや共通の企業に行きます。

93
00:06:52,020 --> 00:06:56,610
 

94
00:06:56,610 --> 00:06:59,100
OK。

95
00:06:59,430 --> 00:07:00,070
だから、アイコンの名前をコードにして、私はブログサイトのヘッダーのすぐ隣に追加します。

96
00:07:00,300 --> 00:07:07,160
だからここに彼女のアイテムがあり、私たちに必要なものはアイタグです。

97
00:07:07,470 --> 00:07:11,190
そして、コードとアイコンのクラスを持つ必要があります。

98
00:07:11,670 --> 00:07:17,400
 

99
00:07:17,400 --> 00:07:26,040
だから本当に単純なアイコンの名前だけでなく、クラスアイコンがリフレッシュを保存し、私たちは少しコードを持っています。

100
00:07:26,040 --> 00:07:26,290
私はそこに来る。

101
00:07:26,280 --> 00:07:27,340
このアイコンを少し大きくするための小さな変更を加えましょう。

102
00:07:27,660 --> 00:07:31,830
 

103
00:07:31,860 --> 00:07:38,730
これを行うには、ここで素晴らしいスタイルのタグを書くことができますが、そうするのではなく、私たちが設定したパブリックディレクトリを使用しましょう。

104
00:07:38,730 --> 00:07:40,630
それでもディレクトリを作成する必要があります。

105
00:07:40,680 --> 00:07:41,930
しかし、私たちはそれが提供されているという事実を設定しました。

106
00:07:41,940 --> 00:07:44,570
だから、スタイルシートをスラッシュして、それをaptと呼ぶだろう。Csはまだ存在しない。

107
00:07:44,700 --> 00:07:51,340
だから私たちは、ディレクトリを公開し、ディレクトリパブリックスラッシュスタイルシートを作成し、最終的にパブリックスラッシュスタイルシートスラッシュアプ​​リDotsie

108
00:07:51,690 --> 00:08:03,330
SSを開く必要がありますので、公開スタイルシートAptos

109
00:08:03,330 --> 00:08:11,490
SSタブの完成を開くことは間違いなくあなたの友人です。

110
00:08:11,730 --> 00:08:16,710
そして、すべてのアイコンを少し大きくする。

111
00:08:16,740 --> 00:08:19,990
 

112
00:08:20,400 --> 00:08:26,370
IEMを設定します。

113
00:08:26,370 --> 00:08:35,940
そのクラスのアイコンを持つすべてのアイコンとスティーブアイコンよりも実際にはちょっとだけ具体的です。私たちは、コンテナのサイズの2倍、または親の保存の倍のサイズのように、フォントサイズBE2

114
00:08:36,600 --> 00:08:39,250
これで、サーバーのバックアップを開始し、ページを更新しました。

115
00:08:39,560 --> 00:08:45,180
私たちはアイコンが個人的な好みの問題であるより大きくなるのを見なければなりません。

116
00:08:45,180 --> 00:08:49,530
しかし、私はそれが大きくなると少し良くなると思う。

117
00:08:49,530 --> 00:08:52,340
OK。

118
00:08:52,710 --> 00:08:52,940
これで、このビデオでやる必要があるすべての作業が完了しました。

119
00:08:52,950 --> 00:08:56,850
Footerファイルに追加されたnav

120
00:08:56,850 --> 00:09:03,210
barを設定したかったのは、私たちがカスタムCSSAファイルに追加するのは1行だけですが、今はカスタムテンプレートをすべての単一ファイルに簡単に追加することができます。セマンティックUIを含めることができます。

121
00:09:03,300 --> 00:09:09,810
だから私は、Header

122
00:09:10,500 --> 00:09:13,580
それで、新しいビデオを作成して、実際に新しいブログを作ることができるように、次のビデオをピックアップします。

123
00:09:13,860 --> 00:09:19,420