發表文章

目前顯示的是 2月, 2021的文章

Blogger主題優化，修改字體大小

-
紀錄Blogger主題優化，修改字體大小  去除背景 這邊針對Contempo Light主題介紹如何去除背景圖片，去除背景圖片後還會有個底色，所以還要去除背景高度的設定，去除最小高度限制min="420px"修改成min="0px" <Group description="Backgrounds"> <Variable name="body.background.height" description="Background height" type="length" - min="420px" + min="0px" max="640px" - default="480px" value="480px"/> + default="480px" value="0px"/> 修改字體大小 修改內文字體大小為16px，字體顏色改深一點 #666666 <Variable name="posts.text.font" description="Post text font" type="font" - default="$(body.text.font)" value="15px Roboto, sans-serif"/> + default="$(body.text.font)" value="16px Roboto, sans-serif"/> <Variable name="posts.text.color" description="Post text color" type="color" - default=
張貼留言
閱讀完整內容

在新版Blogger網頁中顯示語法高亮的程式碼（syntax highlight）

-
在新版Blogger網頁中顯示語法高亮的程式碼的方法如下，本篇使用Prism.js來顯示語法高亮， 使用Prism來顯示語法高亮的程式碼 Prism顯示語法高亮的程式碼效果如下： var person = { firstname: 'Jeremy', lastname: 'Lin', getFullName: function(){ var fullname = this.firstname + ' ' + this.lastname; return fullname; } } 下載Prism 到Prism網站選擇DEFAULT主題，然後按DOWNLOAD下載程式碼，然後開始客製化一些功能，也可以直接跳過這步開始下載， JS的部份 "版面配置>側欄（頂端）>新增小工具>HTML/JavaScript新增" 內容貼上剛剛下載的JS部份，記得要勾選"顯示「 HTML/JavaScript 」" CSS 部份 直接使用 unpkg.com 提供的連結，這邊選擇Prism相同版本的 1.23，貼到Blogger的<head>與</head>之間，我是貼在head區域裡的<title>之前， "主題>(下拉選單)編輯HTML" <head> <meta content='width=device-width, initial-scale=1' name='viewport'/> <!-- prism --> <link href='https://unpkg.com/prismjs@1.23.0/themes/prism.css' rel='stylesheet'/> <title><data:view.title.escaped/></title> <b:include data='blog' name='all
張貼留言
閱讀完整內容