---
# System prepended metadata

title: Untitled

---



## TNL改版架構

```javascript=
|----- js
|        |
|        |home
|        |  |---_newIndex
|        |
|----- scss
|        |
|        |components // 區塊元件
|        |  |---_footer
|        |  |---header
|        |  |   |---_header_layout // Dan 專用
|        |  |   |---_header_rainie // Rainie 專用
|        |helpers  // 變數
|        |  |---_mixins // mixins
|        |  |---_variables // 首頁變數
|        |  |
|        |page // 頁面
|        |  |---homepage
|        |  |   |---component // 首頁共用元件 (可自行新增)
|        |  |   |   |---_in_title // 首頁標題
|        |  |   |---_ad_banner // banner
|        |  |   |---_first_section // News、Opinion
|        |  |   |---_top_story // Top Story（Dan 處理）
|        |  |   |---_media // Videos、Podcasts
|        |  |   |---_come_frequency // Banner 此區尚未確認 先不做
|        |  |   |---_features // Features
|        |  |   |---_most_viewed // Most Viewed
|        |  |   |---_trending_salon // Trending Topic in Salon
|        |  |   |---_subscription // Subscription banner 
|        |  |   |---_the_latest // The latest
|        |  |   |---_the_keywords // keywords
|        |  |   |---_column // Column
|        |  |   |---_explore // Explore
|        |  |   |---_press_releases // Press Releases
|        |  |   |---index.scss // import homepage _scss
|        |
|----- resources // blade.php
|------- |views
|        |   |components
|        |   |  |---footer
|        |   |  |   |---footer_wrap
|        |   |  |   |---footers_group
|        |   |  |---header
|        |   |  |   |---brand_header
|        |   |  |   |---group_header
|        |   |layouts
|        |   |  |---footer
|        |   |  |---head
|        |   |  |---master
|        |   |  |---menu
|        |   |parts
|        |   |  |---homepage
|        |   |  |   |---ad_banner_1 // ad-1 Banner
|        |   |  |   |---tnl_covid-19 // 圖表組插入內容
|        |   |  |   |---first_section // News、Ｗeather、Top Story、Opinion
|        |   |  |   |---media // Videos、Podcasts
|        |   |  |   |---come_frequency // 此區尚未確認 先不做
|        |   |  |   |---features // Features
|        |   |  |   |---most_viewed // Most Viewed
|        |   |  |   |---trending_salon // Trending Topic in Salon
|        |   |  |   |---subscription // Subscription Banner
|        |   |  |   |---ad_banner_2 // ad-2 Banner
|        |   |  |   |---latest_keywords
|        |   |  |   |---|---the_latest // The latest
|        |   |  |   |---|---keywords // Keywords
|        |   |  |   |---|---ad_banner_3 // ad_banner_3
|        |   |  |   |---column // column
|        |   |  |   |---business_blog // Business Blog
|        |   |  |   |---explore // Explore
|        |   |  |   |---press_releases // Press Releases
```

## 注意事項
1. scss 建議 class 前帶 in  (例如 .in-content) 避免跟內頁互衝
2. scss 全小寫,用 "-" 串連 (例如 .index-page)
3. banner & weather & explore & press releases 這四個區塊為前端打 api
4. 能共用的盡量寫共用，減少重複。