當你在 Tumblr 上創作貼文時,我們最新版的編輯工具(有時又稱為 Neue Post Format,簡稱為
NPF)可讓你在單一篇貼文中加入多種類型的內容。從 Tumblr iOS 或 Android 應用程式製作的每篇貼文都使用這個格式。
導覽
在應用程式中
開啟貼文編輯工具時,你會在畫面的底部看到一排圖示。
從左到右分別為:
- Aa:文字格式的選項,適用於文字區塊。
- 鏈結圖示:點一下就可以加入一個連結區塊。
- GIF:讓你使用裝置上的影片或是 Tumblr 的 GIF 搜尋功能來創作一個 GIF,如此會插入一個影像區塊。
- 相簿圖示:開啟裝置的影像媒體庫,你可以插入一個影像區塊或是影片區塊。
- 耳機:在 SoundCloud 或 Spotify 上搜尋歌曲然後以音訊區塊的形式插入到貼文中。
- 票選:點一下這個來新增一項票選活動。
- 繼續閱讀:點一下這個來用「繼續閱讀」連結分割你的貼文。
- 兩個人:點一下這個來加入社群標示。
請注意:當你把一些文字反白選取的時候,你就只會看到 Aa 圖示和文字格式選項,取消文字選取來顯示區塊類型圖示。
每個圖示會對應到一個可供加入到貼文中的不同內容區塊類型,我們將在下面介紹各個類型的區塊。
文字選項
在一篇貼文中輸入一些文字,然後將其反白選取,以存取文字格式選項。
在此你將會發現以下的選項:
- 第一排中會是顏色,點一下一個顏色來套用到所選取的文字。
- 按住 Aa 圖示來變更文字的子類型:
- Regular:預設的文字大小。
- Bigger:中型的字型大小。
- Biggest:大型的文字大小,可用這個選項來建立貼文標題。
- Quote:相當於引言貼文類型。
- Chat:相當於對話貼文類型。
- Lucille:草寫體。
- Indented:區塊引述。
- Bulleted list:使用項目符號的未排序清單。
- Numbered list:排序清單。
- 你可以點一下 Aa 圖示來循環選取這些子類型。
- 在 Aa 圖示的右邊,你還會找到其他幾個選項,從左到右分別為:
- 粗體(B)
- 斜體(i)
- 刪除線(S)
- 小(<s>)
- 超連結
- 點一下這個圖示,然後貼上你的 URL 來為文字加入連結。
如要深入了解文字格式選項,請參閱這篇說明文章。
加入連結
點一下鏈結圖示來插入一個連結區塊。小秘訣:如果你已經把你的 URL 複製到剪貼簿中了,Tumblr 將會問你是否要使用該連結。
插入一個 GIF
點一下 GIF 圖示來帶出 GIF 搜尋功能。點一下放大鏡來搜尋 GIF,或者使用「創造一個 GIF」來自行創作一個。
如要深入了解如何創作 GIF,請參閱這篇文章。
加入相片或影片
點一下相片圖示來開啟裝置的影像媒體庫。
在貼文中加入一個影像之後,點一下右下角的那個三點來加入替代文字,替代文字應該要是你的影像的簡短描述,就像是你在電話上跟人家描述那個影像一樣,好讓使用螢幕助讀程式的人可以了解你的貼文。
點一下調色盤圖示來編輯影像,您可加入濾鏡、貼紙和文字。
你也可以貼入來自 Youtube、Vimeo 和 Dailymotion 的連結來將影片直接嵌入到任何貼文中。
如要深入了解如何拍攝及編輯相片,請參閱這篇說明文章,有關張貼影片的說明文章則是在這裡。
音訊
點一下耳機圖示來在 Spotify 和 SoundCloud 中搜尋歌曲。
如要深入了解如何張貼音訊,請參閱這篇文章。
重新安排內容區塊
你可以按住一個區塊然後拖曳到貼文中的不同位置:
如果要刪除一整個區塊的話,只要把區塊拖放到垃圾桶圖示中就可以了。
在網頁版上
在瀏覽器中,編輯工具使用跟行動裝置版的功能相同的內容區塊類型,但是依據你所按的貼文類型圖示的不同,貼文編輯工具看起來會有一點不同,我們將在下面說明各個選項。
HTML 或是 Markdown
貼文編輯工具預設會使用 RTF 格式編輯,不過如果想要的話,你可以切換到 HTML 或是 Markdown
模式。在開啟的貼文表單中,按一下右上角的齒輪圖示,你將會在那個選單的底部看到文字編輯工具選項。
文字貼文
按一下 Aa/文字貼文選項,然後你會看到一個熟悉的貼文編輯工具:
貼文右側的圖示如下,從左到右依序為:
- 相機:上傳一個影像。
- 影片:上傳一段影片。
- GIF:開啟 GIF 搜尋功能。
- 音訊:在 Spotify 或 SoundCloud 上搜尋歌曲,或是貼上 Spotify、SoundCloud 或 Bandcamp 的
URL。我們正在努力為音訊檔案上傳功能提供更多支援。 - 連結:插入一個連結區塊。
- 三點:插入一個繼續閱讀連結。
輸入一些文字,然後將其反白選取來帶出文字格式選項:
從左到右,所顯示的選項依序為:
- 文字子類型選項。按一下來展開下拉式選單:
- Regular:預設的文字大小。
- Bigger:中型的字型大小。
- Biggest:大型的文字大小,可用這個選項來建立貼文標題。
- Quote:相當於引言貼文類型。
- Chat:相當於對話貼文類型。
- Lucille:草寫體。
- Indented:區塊引述。
- Bulleted list:使用項目符號的未排序清單。
- Numbered list:排序清單。
- 刪除線(S)
- 小(<s>)
- 粗體(B)
- 斜體(i)
- 超連結
- 字型顏色
如要深入了解文字格式選項,請參閱這裡。
相片貼文
按一下相片貼文圖示來開啟此編輯工具:
您可以從裝置上傳影像或是透過貼上一個 URL 來加入影像。
在影像下方添加說明時,你會看到我們在文字貼文的部份所提到的所有選項。你也可以在說明中加入任何內容區塊類型。
如要深入了解如何在貼文中加入相片,請參閱這篇文章。
引述貼文
按一下引述貼文圖示將會開啟一篇文字子類型已被設為引述的文字貼文:
連結貼文
按一下連結貼文圖示來開啟一篇已預先插入一個連結區塊的新貼文,然後你可以貼上或輸入你想要用在貼文中的 URL。
對話貼文
按一下對話貼文圖示將會開啟一篇文字子類型已被設為對話的文字貼文:
輸入一些文字然後輸入一個冒號,如此文字就會自動被變成粗體的格式,譬如:
小凱:阿福,很讚的貼文喔!
阿福:是喔,多謝稱讚。
音訊貼文
按一下音訊貼文圖示來開啟一篇已預先插入音訊區塊的貼文表單。你可以在 Spotify 或 SoundCloud 上搜尋歌曲,或是貼上
Spotify、SoundCloud 或 Bandcamp 的音訊 URL。
如要深入了解音訊選項,請參閱我們官方說明中心的文章。
影片貼文
按一下影片貼文圖示來開啟含有以下這兩個選項的貼文表單:
按一下左邊的選項來從你的裝置上傳一個影片檔,按一下右邊的選項來加入一個影片 URL。
按一下那個小小的問號來看看你還可以加入多少分鐘的影片,才不會超過今天的上限。
如要深入了解如何張貼影片,請參閱這篇說明文章。
限制
請注意新的編輯工具對於不同的內容類型有一些限制:
-
一個文字區塊可包含最多 4,096
個字元,如果貼上或書寫的一個段落超過這個限制,那麼這個段落就會被拆分為兩個(或多個)文字區塊。- 一旦貼文被建立之後,各個段落會被轉換為個別的文字區塊。
- 提及次數的上限為 50 次,這是為了預防垃圾內容及濫用。
- 內嵌連結數量的上限為 100 個,單篇貼文中允許的連結區塊數量的上限為 10 個。
- The maximum number of image/GIF blocks allowed in a single
post is 30. - 單篇貼文中允許的影片區塊數量的上限為 10 個,不過,目前一篇貼文中只能上傳一部影片。
- 單篇貼文中允許的音訊區塊數量的上限為 10 個。
- 整篇貼文的大小上限為 1MB。
當兩項限制有發生重疊的情況時,將採用較嚴格的限制。
每篇貼文都有 1,000 個內容區塊的限制。
你知道嗎?一篇 Tumblr 貼文可容納大約三分之一的白鯨記內容。
那貼文類型呢?
在預設情況下,所有透過新的編輯工具製作的新的原創貼文都會被視為文字類型貼文。所謂的單一「貼文類型」已不再有意義,因為 NPF
貼文中可包含各種內容區塊類型,而不是只著重於單一的貼文類型。
雖說如此,NPF 貼文會根據你在貼文中加入的內容區塊來對應到舊版的貼文類型,如要深入了解這其中的邏輯,請參閱這裡。
Tumblr 佈景主題
使用新的編輯工具製作的貼文相較於舊版貼文可能會顯示的不太一樣。為降低這對部落格佈景主題的衝擊,我們在你的部落格的佈景主題中加了一個簡單的 CSS
修補檔以改善貼文呈現在你的部落格上的方式。這項功能對所有人都會預設為開。
如果你使用從我們的佈景主題花園取得的優質佈景主題,那麼請查看你的佈景主題的頁面以找到技術支援聯絡專線並聯絡佈景主題開發人員。我們建議瀏覽由我們選輯的優質佈景主題清單,在清單中所有標有紅色星星的佈景主題都可與新的編輯工具相容:
https://www.tumblr.com/themes/collection/featured
雖然我們建議選用佈景主題花園中的佈景主題,以確保你使用的是安全的佈景主題,不過還是有其他可靠的第三方佈景主題來源可供參考。譬如說,你可以看看
Tumblr 上的這些創作者:@codingcabin、@glenthemes、@rachaelthemes。這些都是很棒的資源。如果你不確定要從哪裡開始的話,我們會建議使用比較現代化而且是最新的佈景主題,像是
Vision 或是
Stereo。佈景主題開發人員
@eggdesign
也製作了一個適用於新貼文的佈景主題範本,這會讓創作屬於你自己的內容容易許多!
如果你使用的是免費的佈景主題或是自行製作的佈景主題,你可以在我們的說明文件中深入了解如何建立或編輯 Tumblr 佈景主題:
https://www.tumblr.com/docs/tw/custom_themes
如果想要多了解一下 HTML 和 CSS 的話,請參考這些免費的資源:
https://developer.mozilla.org/zh-TW/docs/Learn
https://www.w3schools.com/
https://www.freecodecamp.org/chinese-traditional/
說明文件
如要更深入了解 Neue 貼文格式背後的製作祕辛,請參閱我們的工程部部落格貼文。完整的 NPF 詳細規格內幕就放在 Github 上供大家檢閱。