Oxygen Builder 完整教學課程

Categories: Oxygen
追蹤清單 分享
分享 Course
Page Link
分享 On Social Media

關於此課程

學員評價:

「這堂課真的好詳細,看完就可以利用氧氣架起一個站了!」— Miriam 個人部落客
「原來氧氣這麼好用、方便,阿控的教學真的好細心、貼心!」— Stella 上班族
「上完課程後,了解到原來氧氣可以這麼靈活且自由的設計自己的網站,與其他的編輯器比較起來,真的非常不一樣,謝謝阿控~!」— Winnie 韋妮筆記
「課程很基礎,從觀念開始談起,對於不會程式設計或是CSS的我來說,真的物超所值!」— Julia 社會新鮮人

購課包含:

。氧氣Oxygen Builder 完整版授權(價值約NT6,500 / 終身 / 可接案用)。
。專業版表單外掛Fluent Forms Pro (終身 / 可接案用)。
。OxyNinja Woocore (終身 / 可接案用)。
。專業程式碼管理工具Advanced Script(終身 / 可接案用)。

售後服務:

。課程看不懂沒關係,購課就享有專屬一對一教學8HR時數。(線上Google Meet或是遠端桌面)
。臉書社團最強後盾支援,每天分享不同設計技巧。
。接案碰到問題?即時LINE支援。
。接案碰到問題?協助設計享優惠。

Monster’s Award 2021

國際認證氧氣Oxygen Builder 

The Best WordPress Page Builder

2021佈景主題國際平台評選最佳WordPress編輯器,氧氣Oxygen Builder 位居第二。(Elementor定位給一般使用者,故市占率較高)


亞洲最完整專業氧氣Oxygen Builder 資源教學

三原是目前台灣最早推廣氧氣編輯器Oxygen Builder 的業者,目前專業氧氣技巧Youtube頻道訂閱人數已達200人,觀眾來自中英語系都有。同時三原也是氧氣官方教學影片認可合作夥伴。

 

 
 
展開課程介紹

Course 課程章節

第一部分:入門
這個章節主要是以圖文的方式呈現內容,主要傳達的是氧氣的基礎概念與架站的基礎認識,這是氧氣最基礎的部分,但往往也是比較無趣的部分。 再規劃這堂課程的時候,有許多人跟我說,為什麼不要教操作就好了,的確,如果只教操作,那麼我很省事,很輕鬆錄製影片就好,課程收費也一樣,但是,氧氣最核心的精神就喪失了! 氧氣,樂趣是什麼?樂趣就在於他提供的是一套完整的工具,透過這個工具可以建立任何我們想製作的版型基礎,也有人這樣說,氧氣是非常考驗邏輯的一套工具,沒有基礎的氧氣,其實就是沒有任何競爭力的廢物工具! 所以,經過評估過後,我還是決定把基礎的內容一起教學出來,用最淺白的方式,傳達看起來很複雜的概念。

  • 【氧氣教學A-1】網站設計流程
  • 【氧氣教學A-2】認識氧氣編輯介面
    02:14
  • 【氧氣教學A-3】網站CSS排版概念
  • 【氧氣教學A-4】元件設定與CSS對應

第二部分:全站
氧氣跟市面上WordPress頁面編輯工具不同的是,他就是一套獨立的佈景主題系統編輯器,所以「全站」的邏輯設計思考也是相當重要的。 而從全站出發的概念也是符合正常網頁設計流程的概念,當我們從整體全站的方向上去設計整個網站,那我們就可以減少很多的時間,就不用花太多的精神去調整那些枝微末節的細節。

  • 【氧氣教學B-1】套用版型庫Library
  • 【氧氣教學B-2】全站設定
  • 【氧氣教學B-3】Template概念
  • 【氧氣教學B-4】Main Template
    08:56
  • 【氧氣教學B-5】Single Template
    22:01
  • 【氧氣教學B-6】Inner Content概念

第三部分:基礎元件
我常常以工具的概念去比擬這套氧氣工具,為什麼這樣說,因為很多人在找尋頁面編輯器的時候,往往是以元件的方式去看待各式各樣的系統,但是氧氣不是這樣的,氧氣提供是一套完整的工具,藉由這些工具,你可以組合成任何自己想要的元件。 就像是汽車零件,很多螺絲跟五金零件,可以組合成一個引擎,也像是繪圖軟體,給你筆刷跟橡皮擦、材質設定等,讓你可以繪製各式各樣的設計稿件,氧氣也是一樣,提供最基礎最核心的元件,也因此搞清楚這些機組元件,就能夠打造自己的網頁與網站。

  • 【氧氣教學C-1】三大基本容器Sec Col Div
    21:31
  • 【氧氣教學C-2】基礎元件
    37:15
  • 【氧氣教學C-3-1】輔助元件
    28:30
  • 【氧氣教學C-3-2】輔助元件
    28:56
  • 【氧氣教學C-3-3】輔助元件 Modal 彈出視窗
    26:36
  • 【氧氣教學C-4】Repeater
    14:59
  • 【氧氣教學C-5】Header Builder
    17:39
  • 【氧氣教學C-6】WP整合元件
    21:32

第四部分:進階與實作
最後一個部分,就是將第一到第三個部分進行整合,並介紹進階的技巧加速我們的架站流程,如果還是不了解基礎概念的同學,可以透過課程最後的實際操作示範,了解該如何實際將自己的想法,利用氧氣建制出來!

  • 【氧氣教學D-1】可重複使用元件
    06:38
  • 【氧氣教學D-2】Block Library
    09:28
  • 【氧氣教學D-3】氧氣設定
    09:16
  • 【氧氣教學D-4】氧氣實作01 - 版型規劃
    35:03
  • 【氧氣教學D-5】氧氣實作02 - 首頁製作
    35:51
  • 【氧氣教學D-6】氧氣實作03 - 沉浸式架設部落格
    41:02

同場加映

  • 程式碼管理 Advanced Script
    07:56
  • 客製化自己的文章模版 以重要引述為例
    10:21
  • 自訂外掛的CSS工具 以CF7整合為例
    20:27
  • 製作華麗的全螢幕選單吧
    26:36
  • 進階AOS設定(英文口語)
    14:29
  • 在氧氣內自訂CSS該寫在哪裡呢?
    08:45
  • 如何把Facebook聊天功能加到網站上
    03:41