作作看主頁!:設定一覽

作作看主頁!

Header8

0 : 這個章的目的

 看看「作作看主頁!」裡設定的內容


1 : 設定一覽

作作看主頁!」裡設定了主頁。

在這裡看看裡面的內容吧。
為了做主頁的設定,打入

 terminal
 使用Windows的話,請使用「命令提示符」吧。

1 ralis g controller welcome

用這個打入作好的
  • 設定資料的顯示的「app > views > welcome
  • 設定資料的操作的「app > controllers > welcome_controller.rb


3. 設定使用的網頁的「config > route.rb

這個三個文件設定網頁。
 七個網頁的設定(route.rb)

 route.rb

1 2 3 4 5 5 6 7 8 9 ... 58 59 Rails.application.routes.draw do resources :posts , :only => [:show, :index, :new, :create, :edit, :update, :destroy] resources :welcome, :only => [:index] root "welcome#index" # The priority is based upon order of creation: first created -> highest priority. # See how all your routes lay out with "rake routes". # You can have the root of your site routed with "root" # root 'welcome#index' # 省略 # end end

 操作資料的設定(controller文件)

 welcome_controller.rb

1 2 3 4 class WelcomeController < ApplicationController def index end end

 網頁的設定(views文件夾)

 index.html.erb

1 2 3 4 5 <div class="header-image"> <h1 class="text-center header-content"><strong>歡迎光臨</strong></h1> </div> <br> <a href="/posts" class="btn btn-primary">看投稿一覽</a>

網頁的装飾

 style.scss

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 .my-form{ width:500px; } .main-page{ margin-top:50px; } .header-image{ background-image: url(/assets/header12.jpg); height:400px; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; } .header-content{ font-size:75px; padding-top:150px; }