blocs 3最為人熟知的是在相對復雜的網頁設計中插手了一張友愛的面目面貌。它的拖放簡單性和預先編寫的代碼塊的快速組合使得HTML和CSS對于非專業人士來說遠沒有那么恐怖。可是稍加挖掘,即使是中級和高級web設計師也會找到喜好塊的來由。
這里有一個精心籌謀的(但毫不是完整的)列表,列出了它供給的一些更標致的功能。此中一些是您可能忽略的舊的最愛,而另一些則是Blocs 3中全新的。
一、自界說web字體
Blocs 3供給了一些小但不錯的web友愛字體選擇。可是若是你發現它們太有限,可以很輕易地添加你本身的。在Blocs >首選項中,找到一個按鈕來打開Blocs的字體辦理器。
可以利用+按鈕來添加新字體,可以從谷歌的Web字體庫中添加,也可以從當地字體文件中添加,這取決于您鄙人拉菜單中選擇的內容。
對于當地文件,塊至少需要一個.ttf或.woff字體文件,建議選擇一個文件夾,此中包含這兩種格局的字體,再加上.eot和.svg表單,以獲得最年夜的瀏覽器兼容性。
對于谷歌web字體,從谷歌普遍的在線庫中選擇您想要的字體,然后在“Embed font”下復制HTML代碼。
在Blocs的字體辦理器中,添加一個新的谷歌Web字體,然后將HTML代碼粘貼到呈現的框中,然后單擊“Create”。
無論以何種體例添加新字體,在利用任何新歸并的字體之前,都需要退出并從頭打開塊。當您導出利用這些字體的站點時,塊將確保包含準確的鏈接或文件。(只要確保任何非google字體都有許可Web利用的許可證即可。)
二、資產辦理公司
項目布滿了輔助圖像、文本文件、pdf文件等時,Blocs的資產辦理器會撐持您。只需單擊幾下,就可以將這些文件分類到組中,以便更快地拜候。
在Asset Manager中,單擊窗口頂部的“Select”,然后選摘要分類的項目,并單擊窗口頂部呈現的藍色“Add to”。可以將選中的項目移動到任何塊的預置組中,或者建立全新的組來存儲它們。
三、視頻布景
在Blocs中的任何元素中添加視頻布景比想象的要輕易。只要確保視頻是MP4格局,而且巨細小于10MB(任何較年夜的,Blocs城市責罵您;任何跨越20MB的都不克不及工作),然后將其添加到您的資產辦理器。拖曳它直接到任何塊,使它的布景。
選擇所需的Bloc,在Inspector窗格中查找布景調色板,然后單擊“Video”復選框。當Blocs的占位符視頻呈現時,單擊縮略圖中的刷新圖標(見下文),從Asset Manager中選擇一個新的。
四、全球色板
web上有良多HTML調色板選擇器,它們可覺得您的站點供給一套互補的顏色。一旦你找到適合你的色調,把它們添加到Blocs的SatchManager中使它們連結一致,可以經由過程點擊cmd-8、菜單欄中的.>Global Swatch Manager或者點擊窗口右下角的小網格圖標來拜候。
可以經由過程RGB、CMYK、HSB或十六進制代碼值添加顏色,并經由過程簡單的單擊將它們應用于元素。若是改變本家兒意,想用赭色來互換閃灼,在“全球樣本”窗口中如許做將確保站點中的每個赭色元素當即當作為你首選的閃灼。
五、菜單辦理器
塊主動將您建立的任何新頁面添加到其導航欄元素。可是,若是您想從導航欄中解除頁面,或者已經嵌套了子菜單,Blocs會很甘愿答應幫手。
經由過程點擊cmd-9、進入菜單欄中的.>Menu Manager、或者點擊右下角的菜單圖標(上面用紅色圈出)來打開菜單辦理器。可以從站點的本家兒導航菜單中添加或刪除項目,或者建立新的菜單,可以嵌套在本家兒菜單中,或者利用Inspector窗格中的Data選項板附加到所選的下拉菜單或列表Bric。
還可以編纂菜單中的每個項目——單擊本家兒列表中其名稱旁邊的滑塊條圖標——以打開另一個菜單、導航到站點內的頁面或外部URL,或僅充任菜單中其他項目之間的分隔符。
六、數據源
若是喜好本身設計的頁面,而且但愿在站點的其他處所重用它,那么可以經由過程Page>Add to Template Library將其作為模板。可是如許做之前,經由過程設置頁面的一些元素以主動更改,可以節流本身一些時候和從頭輸入。
Blocs中的任何文本對象都可以從頁面名稱、SEO題目或SEO描述中提取其內容。若是頁面名為“我的照片”,可以將題目文本設置為在頂部主動顯示“我的照片”,而不必手動鍵入。只需選擇題目、段落或其他文本對象,然后轉到右側Inspector窗格中的Data選項板。利用下拉菜單選擇想要的選項。
一個有效的提醒:避免“頁面名稱”而贊當作“SEO頁面題目”。Blocs在頁面名稱中的每個單詞之間添加奇異的連字符,當您利用“頁面名稱”作為數據源時,這些連字符就會呈現。SEO頁面題目”給你同樣的工具,沒有時髦的連字符。
七、自界說屬性
HTML5包羅標的目的頁面上的對象添加近似于數據庫的信息而不需要數據庫的絕妙能力。然后可以利用JavaScript讀取和操作這些屬性。
塊使添加自界說屬性變得輕易。只需單擊一個對象,轉到Inspector窗格中的Custom Attributes調色板,并利用+按鈕為肆意數目的自界說屬性添加名稱和值。
八、項目和頁面設置
若是不克不及添加本身的JavaScript,若何將這些自界說屬性傳遞給JavaScript。連同想包羅的任何其他文件。這合用于單個頁面或整個站點。
要查看頁面設置,切換到屏幕左側的頁面視圖,單擊頁面縮略圖右下角的滑塊圖標,并從呈現的上下文菜單中選擇設置。
成果窗口許可您添加SEO信息,打開或封閉每個頁面的頂部和底部的全局區域,將自界說代碼添加到頁眉、頁腳或<!除了輕松啟用頭文件附件之外,頁面上的DOCTYPE>標識表記標幟。
項目設置窗口可以經由過程屏幕左上角的項目名稱旁邊的滑塊圖標拜候,許可對整個站點進行近似的附件。窗口集中的其他選項卡選擇自界說預加載器圖形、添加闡發跟蹤代碼或選擇用于站點的CMS。
九、CMS撐持
Blocs利用四種風行的內容辦理系統:免費、開源十月、付費選項Pulse、Cushy或Surreal。
Pulse和10月獲得它們本身的自界說金磚,您可覺得它們分派響應的CMS將識此外ID。Blocs的幫忙頁面供給有關若何將Pulse或10月份與您的站點集當作的視頻教程。
還可以右鍵單擊頁面上的任何元素,使其對四個CMSe中的任何一個都可拜候,位于上下文菜單的CMS部門下,該上下文菜單呈現:
十、心猿意馬制磚塊
若是可巧建立了一個出格酷的想要重用的Bloc,精曉HTML和CSS,足以編寫本身的Bric,可以轉到法式的新Bloc編纂器或Bric Builder,兩者都在菜單欄中的Developer菜單下找到。
選擇但愿保留今后的任何Bloc,然后右鍵單擊它,并從上下文菜單中選擇Add Bloc to Library,或者轉到菜單欄中的Bloc>Add To Bloc Library。輸入其名稱、關頭字和類別,它將插手Blocs欄中的新伴侶。若是您愿意,可以返回并調整Bloc Editor中的設置,或者經由過程右鍵單擊Bloc并選擇Export Custom Bloc與其他人共享Bloc。
建立本身的金磚四國比力棘手,而且需要上述的編碼常識。若是有技術,扭捏金磚四國扶植者工藝本身的居平易近金磚四國。
即使您不是HTML標的目的導,也可以從各類第三方網站或Blocs的用戶論壇下載其他用戶的自界說Brics,并在這里辦理它們。這些好工具有它們本身的.bex格局,將它們添加到Blocs很是簡單,只需在Finder中打開那些文件即可。若是但愿導出本身的創作供其他人利用,請單擊“共享”按鈕,該按鈕鄙人面的圖像中圈出。
撰寫本文時,Blocs正在開辟一個完整的API,它使第三方可以或許更好地建造、贈予或標的目的應用法式發賣本身的心猿意馬制Brics、Blocs和其他附加組件。
十一、項目出口
完當作了HTML手藝,讓Blocs在分開的時辰給你一份臨別禮品。轉到File>Export>Export Project...以打開選項菜單,這些選項可以使站點的代碼更流利、更苗條,從而確保在拜候者的瀏覽器中加載更快。
不只是初學者
這些只是一些埋沒在Blocs引擎蓋下的加強功能。有關若何讓您的網站扶植更輕易的具體信息,請參閱應用法式的周全常識庫。
0 篇文章
如果覺得我的文章對您有用,請隨意打賞。你的支持將鼓勵我繼續創作!