如何在Blogger留言中加入圖片和超連結?

990 Views

有沒有發現有時要留言時想要加入一張圖片, 郤發現blogger的留言功能不能加圖片?

這讓人覺得有些地方想解釋郤很難用文字講清楚說明白.

其實, 要想讓Blogger的留言可以加入圖片, 也不是那麼的難, 只要把下面的程式碼加到Blogger後台即可.

當然啦, 第一步, 還是貼心的提醒您不要忘記先做主題的備份哦.

在留言中加入圖片


做好備份後, 就
到Blogger後台→[主題]→[編輯HTML]

用Ctrl+F 在搜尋列輸入jquery字樣, 先確定自己的主題程式碼有jquery.

Ctrl+F, 然後在搜尋列輸入</body>, 找到後在</body>的面貼入下列程式碼.


Ctrl+F, 然後在搜尋列輸入<b:loop values='data:post

找到後在這一行的方加入下面這行div程式碼:
<div id='bloggerspiceciv'>
然後找到</b:loop>, 在它的方加入</div>

它會看起來像下圖:


然後按下[儲存主題]鍵, 即可.

接下來如何在留言區裡加入圖片呢?

在留言欄要加入圖片時只需在欲加入圖片的URL前後加入下面的字串即可:
:img:圖片URL:eimg:
例如:
:img:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDzmuboZei1Dqh_mwtehL4twQnXLLiGhHMZo2vFmQ0jo9hrlkCCEJ2Vak2NZHV82eaP3xcUyHA2d7o7qRriaErFwJ4eY5ymXZEVEVtXjvLcTdyJ5UcRvkhKD-rMMazExIt9UxORz4Ihk2I/s200/honeygain.gif:eimg:

在留言中加入youtube影片


如果是要加入youtube影片, 只需在youtube的影片ID的前後加入下面的字串即可:

:youtube:影片ID:eyoutube:

不過要注意的是, youtube影片只需加影片ID即可, 而不是影片的URL.

舉例說明: 
譬如說一支youtube影片的URL如下:
https://youtu.be/gl32ntc5Tfs

而該影片的ID則是後面的gl32ntc5Tfs

所以如果要在留言區崁入這個youtube影片, 只需打入:youtube:gl32ntc5Tfs:eyoutube:即可.

實例請看下面的二則留言, 一則是留言加圖片, 一則是留言加youtube影片. 或是請看這裡的測試版, 也歡迎各位在測試版測試.

在留言中加入超連結


另外, 如何在留言中加入超連結呢? 這個就很簡單了, 只要在想要有超連結的字串前加入<a href="網址">然後在字串的結尾加上</a>即可. 

如果想要留言中的超連結呈現不同的顏色, 那麼只需在Blogger後台→[主題]→[編輯HTML]裡, 找到放置comment的CSS區, 加入這行a {color:blue;}程式碼即可.
按這裡看示範!

灰鴿秘技: 留言小工具

另外一個超方便簡單的做法, 就是利用[+新增小工具], 在側欄裡加貼一段Javascript程式碼, 然後訪客只需在留言區貼入圖片的網址, 便會自動出現圖片了. 這個方便多了, 有興趣的朋友可以移駕到灰鴿的網站取得程式碼.

參考網站:BloggerSpice

相關文章:

  • 主題的備份和還原 在修修改改, 添加了或多或少的CSS和HTML在主題後台裡, 如果那天想換個版面試試, 記得要先備份, 不然一旦換了主題, 再回來, 原來添加的東西就都沒了. 另外, 在修改和添加東西前, 如果沒有十足的把握, 也請先備份, 免得搞喳了, 又弄不回來, 於是只好回覆到預設, 那麼, 先前添加的… [繼續閱讀]
  • 如何用部落格賺錢? 用部落格賺錢的方式千奇百怪, 有人可以靠著手寫和幫廣告商代言的功力月入數百萬. 也有人只靠著訪客來訪的流量放廣告賺錢.  對於一個部落格新手, 最開始的心願與期待, 也只想知道怎麼靠寫部落格分享自己的心得便能賺取些微薄的零用金. 本篇便是以此初衷與各位分享如何… [繼續閱讀]
  • 移除"訂閱:文章(Atom)" 和 "訂閱:張貼留言(Atom)"字樣這二串字小小的在每篇文章或是網頁的下方, 其實是無傷大雅的.  但, 既然找到移除的方法了, 又超級簡單, 何樂而不為呢? 第一步: 到後台的[主題]→[自訂] 第二步: 在[進階]→[新增CSS]裡貼上下面這段CSS程式碼, 按下[套用至網誌]鍵就大功告成了! … [繼續閱讀]
  • 使用免費的BlueGriffon來自制一個部落格主題模版 一開始, 先介紹一下 BlueGriffon 這個免費的開源軟體. 它是一個最佳的網頁製造軟體 Dreamweaver 的免費替代軟件. 它一共有分三種版本, 免費使用, 付費單機執照, 和商用執照. 本系列將就免費的版本來介紹如何自製一個 Blogger 的主題模版.  … [繼續閱讀]
  • 如何加一個表格在blogger 中? 如何加一個表格在部落格中? 有三種方法可用, 分別列述如下: 目錄索引 用HTML語法加一個表格只需要知道3個重要的標籤 (table, tr, td), 就可以自己調整下面的HTML表格的格式了. 首先一個表格有行有列. 行是橫的, 列是直的.… [繼續閱讀]

12 則留言:

  1. 測試在留言區加入圖片
    " width="auto" class="bloggerspiceciv">

    回覆刪除
  2. 測試留言區加入youtube 影片

    回覆刪除
  3. " width="auto" class="bloggerspiceciv">
    還要自已加代碼 ~ 不理想 !!

    回覆刪除
    回覆
    1. 我也覺得不理想, 不知灰鴿可有解決方案可分享?
      另外, 找到了https://www.365ordinarydays.xyz/2021/07/emoji.html" rel="nofollow">可以留言區插入表情符號的方法, 歡迎指教, 謝謝." alt="" class="smiley">

      刪除
    2. 試了, 然後? 怎麼加上圖片?

      刪除
    3. 哦, 懂了, 就是插入的圖片要是http的連結...

      讚啦... 謝謝囉...

      刪除
  4. 只要在想要有超連結的字串前加入https://www.365ordinarydays.xyz/2020/03/embed-image.html#point2" rel="nofollow">然後在字串的結尾加上即可.

    回覆刪除
  5. 謝謝你的推薦,然而、連結你引用錯了,那是我偽裝過的 URL,後面這個才是正確的 https://e-717.blogspot.com/2021/01/blogger.html 到後台看我的留言,像這樣也能判讀,URL超連結到結束的地方最好留空格,因為我的APP沒有通靈...

    回覆刪除
  6. 說實在的、我灰熊不喜歡用,前後對齊這個屬性,.comments .comments-content .comment-content { text-align: justify;}
    很難控制

    回覆刪除

顯示表情符號