untags

Hugo加上不間斷的背景音樂

Hugo 加上不間斷的背景音樂插件想法：點擊按鈕啓動之後，插入Iframe頁面，讓網頁跳轉的時候音樂也不會停止播放。首先在Themes/layout中新增music.html的頁面 {{- define "main" }} <style type="text/css"> #mainFrame { position: fixed; background: #000; border: none; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; } #mainClose { position: fixed; background: #000; border: none; top: 2; right: 0; bottom: 0; left: 0; width: 10%; height: 3%; } </style> <iframe src="{{.Site.BaseURL}}" id="mainFrame"></iframe> <iframe src="{{.Site.BaseURL}}sunnyroad.mp3" allow="autoplay" id="mainMusic"></iframe> <a href="{{.Site.BaseURL}}" id="mainClose">Close Music</a> {{- end }} {{/* end main */}} 在content裏新增一個music....

HUGO如何在Markdown上使用HTML

HUGO如何在Markdown上使用HTML 很神奇的Hugo無法直接渲染Markdown上的HTML代碼，當我們需要修改字體顔色，增加一些功能美化我們的文章的時候，可以使用以下方法在Markdown上面使用HTML代碼：方法1：修改Config檔案,告訴Hugo把HTML的代碼渲染出來。在Config檔案下新增下列參數。 config.yaml: markup: goldmark: renderer: unsafe: true config.toml: [markup] [markup.goldmark] [markup.goldmark.renderer] unsafe = true config.json: { "markup": { "goldmark": { "renderer": { "unsafe": true } } } } 方法2：使用Shortcode 在layout/shortcode/裏新增新的Shortcode.html文件，這裏取名叫做codehtml.html，在裏面輸入: {{.Inner}} 然後就可以在Markdown中使用這個Shorcode了： {{< codehtml >}} <p style='color:red;'> 我要使用<i>HTML</i>！ </p> {{< /codehtml >}} 顯示效果：我要使用HTML！ ...