Obs152｜終於能產生書籤與頁碼了！與PDF相關的外掛：Better Export PDF＆PDF++ | 修訂

由 · 發表於: · 更新於: | 瀏覽數: 2 / 523

標籤：

增強PDF匯出功能：

  • 添加頁首（頁眉）與頁尾（頁碼/頁數）
  • 能與[[#^e5003e|Dynamic TOC]]外掛整合→保留文檔內鏈接跳轉
  • 產生PDF大綱書籤
  • 產生前預覽對話窗

gh|700

gh|700

[!WARNING]+ 注意
Dynamic TOC作者不再維護，必須手動安裝 Aidurber/obsidian-plugin-dynamic-toc: An Obsidian plugin for creating Tables of Contents that stay updated with your document

^e5003e

1.1. 與Commander整合

  • 在Tab Bar新增【Better Export PDF: Export Current File to PDF】按鈕，以方便匯出PDF操作

gh|700

1.2. 頁首(頁眉)

<div style="width: 100vw;font-size:10px;text-align:center;"><span class="title"></span></div>

1.3. 頁尾

▼ 原有內容：

<div style="width: 100vw;font-size:10px;text-align:center;"><span class="pageNumber"></span> / <span class="totalPages"></span></div>

將檔名與頁碼放置在頁尾（檔名佔視窗寬度的80%，頁碼佔20%）：

<div style="width: 80vw;font-size:10px;margin-left:20px;float:left;"><span class="title"></span></div>
<div style="width: 20vw;font-size:10px;text-align:right;margin-right: 20px"><span class="pageNumber"></span> / <span class="totalPages"></span></div>

1.4. AnuPpuccin佈景主題修改

預設的AnuPpuccin佈景主題產生的PDF頁面是灰色背景色，可使用下列CSS修改成白色背景色：

@media print {
  .anp-print .print, body.anp-print, .anp-print .markdown-rendered, :root:has(.anp-print), :root {
    background-color: white;  /*rgb(var(--ctp-base));*/
  }
}

1.5. 2024/02/21 v1.5.4

Better Export PDF v1.5.4 增加了由筆記YAML區欄位 headerTemplate與footerTemplate來分別控制該筆記頁首、頁尾模板的功能，只要在YAML區新增欄位再加上HTML內容，即可以指定樣式產生。

頁首、頁尾只有下列資料可取用，必須使用<span class="取用資料"></span>的標籤寫法:

  • title: 筆記檔名
  • date: 產生PDF的時間
  • url: 文件位置
  • pageNumber: 目前頁碼
  • totalPages: 全部頁數

要在頁尾上方加上橫線的寫法：

<div style="width:100vw;font-size:10px;border-top:1px solid red;margin-left:20px;margin-right:20px;">
  <span style="width: 80%;font-size:10px;text-align:left;">
    <span class="title"></span>
  </span>
  <span style="width: 20%;font-size:10px;float:right;text-align:right">
    <span class="pageNumber"></span> / <span class="totalPages"></span>
  </span>
</div>

Reference: https://www.electronjs.org/docs/latest/api/webview-tag#webviewprinttopdfoptions

  • headerTemplate string (optional) - HTML template for the print header. Should be valid HTML markup with following classes used to inject printing values into them: date (formatted print date), title (document title), url (document location), pageNumber (current page number) and totalPages (total pages in the document). For example, <span class=title></span> would generate span containing the title.
  • footerTemplate string (optional) - HTML template for the print footer. Should use the same format as the headerTemplate.

2. PDF++ Plugin

PDF++是Obsidian內建的PDF檢視器的功能擴充。

[!WARNING]+ 注意
PDF++必須手動安裝或使用BRAT安裝。

選取標籤一段區塊後，點擊上方的重點按鈕，此時標示內容會被複製到剪貼簿，到筆記裡按Ctrl+V貼入，PDF即會出現高亮背景色。

gh|700

2.1. 使用Callout

PDF++也設置了自己的Callout外觀，在設定裡啟用後即可使用:


再將複製的Highlight內容改成Callout語法:

> [!PDF|red] Title
> The Styles menu on the Menu bar (Figure 189) provides the most commonly used paragraph, character, and list styles, plus quick links to create and edit styles. To

[[WG76-WriterGuide.pdf#page=188&selection=137,0,142,74&color=red|p.188]]

3. 相關鏈接

✅ Better Export PDF: https://github.com/l1xnan/obsidian-better-export-pdf
✅ PDF++: https://github.com/RyotaUshio/obsidian-pdf-plus
✅ Obsidian Annotator: https://github.com/elias-sundqvist/obsidian-annotator
✅ Dynamic TOC: https://github.com/Aidurber/obsidian-plugin-dynamic-toc
✅ Obsidian commander: https://github.com/phibr0/obsidian-commander

4. 教學影片

＃＃

您可能也會有興趣的類似文章

您可能也會喜歡…

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *