每次轉貼圖文都抓錯?教你讓 Facebook、Google+、Twitter 正確顯示部落格文章、首頁與網頁的名稱、圖片與摘要!

每次轉貼圖文都抓錯?教你讓 Facebook、Google+、Twitter 正確顯示部落格文章、首頁與網頁的名稱、圖片和摘要! | 社技哲學
每次轉貼 blogger 文章、首頁或網頁,你的辛苦挑的照片和寫的摘要都出不來嗎?本文教你如何用 meta 標籤讓 Facebook、Google、Twitter 都正確顯示!...
很久以前我在這裡提過一個問題,就是轉貼時 FB 和 G+ 會抓到不同名稱、圖片、摘要(有時後還抓不到),而且 G+ 甚至完全抓不到首頁連結!

我終於把這個問題解決了!把解法分享給大家,有碰到這個問題的朋友,快點來修改 html 一下吧! 

Gmail 自己設計範本?

我在 Gmail 收到很多電子報,都很精美,圖文並茂,也打算自己設計一個。

實作發現大多數電子郵件系統不支援某些 CSS 語法,例如圓角、陰影、背景圖片......等。因為這樣的限制,好幾次寄出去的信,都跑位或無法正常顯示,圖片與 DIV 沒對好,或是CSS  Box 的內外距離沒正常呈現。

電子郵件的編輯器其實無法編輯 HTML ,所以我都先用 Blogger  發佈,然後複製內容結果,貼到電子郵件的編輯器內。

結果我一直修改 CSS ,因為在 Blogger 是正常的,但 Email 是不正常的。我只好用其他的 CSS 來替代。一直測、一直測、一直測.....

不知道各位能不能給個建議讓我參考?


Joseph Chang: 可以先看看別人的範本是怎麼做的,從模仿學起
http://www.creativebloq.com/career/10-free-newsletter-templates-your-design-work-11410393

Wayne Bot: 好多現成範本~

動態 SVG 簡報圖檔,在 Blogger 網頁上顯示

製作動態 SVG 簡報圖檔,要在 Blogger 網頁上顯示,卻無法使用,因為 Blogger 的圖片插入只支援上傳 JPG, PNG, GIF 圖檔。

找一個克服方法: 圖檔上傳雲端硬碟 
但是要把圖檔的網址找出來,需要一點技巧說。
請看這篇文章效果及作法說明 → http://goo.gl/1GQQFl

如果您有其他好方法,請不吝分享大家學習……


bigsishead跪婦阿冠 可是用行動版看的話,簡報會超出版面,請問有解決辦法嗎?

BigELK176 大麋鹿 我的網站沒有針對行動裝置去特別設置喔!
將寬度設為 "##%" 或許可以解決,
但是高度無法控制,比例失真了。

其實內文圖下方有「→新分頁開啟連結」
點按連結用瀏覽器看 SVG 簡報
在行動置上顯示應該沒有問題
請試試看……
 
攔截暫時出現的檔案下載網址,這個動作有點難。發現另一個好方法:按下載,完成後,再去瀏覽器去找出下載紀錄,再把裡面的網址複製下來,尾部參數"?e=download&nonce..."刪除,即可使用。

按Enter換行的問題

馬來妹的異想世界
有關台灣和馬來西亞素食的食記...
大家好,我是blogger新手,請大家多多指教。
一下有幾個問題~
1. 每次編輯文章,需要按Enter換行編輯。然而,到了預覽模式,卻發現文字跑上去,結果需要花時間回到編輯模式,按了很多次的『enter』鍵才可以~可是這樣同時延伸到另一個問題就是:行動版的時候,看到一張圖片,接著很大段的『空白』才到另外一張圖片,雖然電腦版看起來是沒問題的
2. 我偏好設定照片『特大』和左對其以及文章左對其,有沒有一次過設定的方法?不然每次得一張張更改,一行行的字更改?

感謝!


Keanu Li
#吳姳萱  
回答第一個問題:切換到HTML模式,你會看到很多</br>的標籤,它就是控制網頁斷行的語法,而你在編輯模式按下ENTER,系統就會幫你在HTML法語加上</br>,也就是你看到很多空白的原因,到HTML模式移除那種個多出來的</br>應該可以解決你的問題

吳姳萱
沒錯,我刪除了,然後預覽畫面,結果文章還是跑到圖片上方,等於我回去還要enter⋯⋯
謝謝你哦!

Keanu Li
這樣啊,那就得針對圖片的語法來修正了哦!

吳姳萱
比如說?不好意思,我是新手,還不太會><

Keanu Li
你指的是哪一篇文章有這種情形呢? 貼出來大家也許比較好幫你檢查問題出在哪兒?

toa to
我大概懂你的問題在哪裡。你插入圖片的時候是在撰寫模式而不是在HTML模式插入的,這會有個問題……
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQc1T9B_mXvV3i9EFoRAL6ScoDWOiVFqyLXqS0PLzTdvLBkbIcFVnpKzgv6zjB7_txoOSqR0eKL6rWtsrX2fM8_f4s6-0pxD-0elgJYIeKtevqcm_Wb-hcKdGeVJ-D63CtBTGAv_BX27k/s1600/insertpicture.JPG
看到分別了嗎?
於是在撰寫模式的時候在圖片之下放文字,就會變成這樣:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_vrU_mBoZGTLe1IZt2ueYyxuCWiPUu5bOaBIBxUGhhnXEXp82U_bd-RGoflcgNswL6OHEj3taDmvEEueFzOnaGMvvA2KjwEgpC1lAU5x9ROIbCY2PWHBVRJdRJPNyGPYj5p4tQ7ccQY4/s1600/insertpicture2.JPG
一開始在HTML模式插入的話就沒這個問題,我不知道已發表的文章有沒有解決辦法,以後插入圖片還是在HTML模式下插入吧~

Wayne Bot
+toa to 這樣看來很可能是撰寫模式插入圖片引起的問題, 不過要等原 po 驗證了~

吳姳萱
原來如此,沒錯就是這樣!!謝謝+toa to !!
我還以為圖片一定要置中才不會有問題~
最近考試還沒有時間寫
等等下次寫再看看~就像 +Wayne Bot 說的XDD

壓浮水印是有學問的

壓浮水印是有學問的,否則常會被這種麻煩事困擾...


企業號航行網誌
放在中間好些

bigsishead跪婦阿冠
特別要壓在重點上~~~

Ida Wu
壓在重點上+1 冠的浮水印都很用心,我的浮水印想每張都壓在我女兒臉上XD 但我實在好懶

bigsishead跪婦阿冠
+Ida Wu 因為你的女兒是重點,哈哈!

面壁王澳西諾
還好我堅持不用批次處理軟體來壓浮水印是對的! 一張張照片找正確位置上浮水印雖然真的很花時間也很累,但是這麼做就是要防止被"輕易"盜圖,壓水印壓到手抽筋也要繼續用啊!!

Ida Wu
+面壁王澳西諾​ 我只能說太強大了你們

面壁王澳西諾
+Ida Wu 哈 我想大概就是因為這樣搞剛的壓浮水印以及內文總是落落長所以寫文章速度才會那樣慢,因此這樣的方式注定不能當產量大的作者,要顧文章品質跟產量真的不是我們這種兼職的人可以做的,有一好沒兩好,打根基階段的我還是顧品質比較重要XD

toriyama laputa
有推薦的壓浮水印軟體嗎?
直接用picasa自動加浮水印的懶人路過 :P

bigsishead跪婦阿冠
最推薦還是photoshop一張張手動調位置。
XXX未經授權使用及重製Venus的照片 @ Venus' Blog - 美食‧旅行‧飯店住宿 :: 痞客邦 PIXNET ::
回家路上在捷運上滑手機,看到這篇網友最愛「2014十大火鍋店」出爐 鼎王、無老鍋掰掰!一看有我吃過的新莊詹記麻辣鍋耶,越看越覺得巧合,怎麼那張照片(還壓上東森新聞雲字樣)跟我拍的那麼像?一查,根本就是...

免費下載高畫質圖片的 15 個管道

yiguang zheng最初分享了這則訊息:
 
個別有之外⋯⋯不仿試試o⋯⋯
免費下載高畫質圖片

從 Google 搜尋可以找到數十億張的照片,當圖片屬於公共領域,或是在 Creative Commons 授權下,才能被使用而不會有版權問題。

目前的問題是 Google 並不會只提供你免費的圖片,至少在圖片搜尋方面,Google 演算法往往會漏失掉一些優質的免費圖庫網站。如果無法透過 Google 來幫助你找到圖片,這裡有一些不錯的圖庫,可以找到免費、高解析度圖片。

1. unsplash.com (Unsplash) – 這是下載高解析度圖片網站裡我最喜愛的一個。訂閱 Email 電子報可以每 10 天收到 10 張新的圖片更新。所有圖片皆為 CC0 授權,意味著你可以自由使用這網站裡的圖片素材。

延伸閱讀:Unsplash 高解析度免費圖庫素材,適用於個人或商業專案

2. google.com (LIFE) – Google 圖片網站收錄了數百萬計來自 LIFE 圖庫的歷史照片。你可以在 Google 圖片搜尋加入 source:life 及任何搜尋字串來進行查找,這些圖片可以免費用於個人或非商業專案。

3. flickr.com (The British Library) – 英國國家圖書館已上傳超過一百萬張現為公共領域的的老照片和掃描圖片,並鼓勵重新使用它。

4. picjubmo.com (Picjumbo) – 在這裡可以找到許多高品質的照片,可用於個人或商業用途。

5. pixabay.com (Pixabay) – 所有在 Pixabay 的圖片皆為 CC0 授權,可以被用於任何地方。就像 Flickr,有提供選項來瀏覽特定相機型號所拍攝出來的照片。

6. publicdomainarchive.com (Public Domain Archive) – 這是一個令人印象深刻的網站,將許多公共領域的圖片分門別類整理在網站裡。它所收錄的高解析度相片有時間限制。

7. commons.wikimedia.org (Wikimedia Commons) – 此網站收錄 21 萬張以上的圖片,有些為免費授權,有些則屬於公共領域。這些圖片分門別類,可使用搜尋關鍵字來進行查找。

8. superfamous.com (Super Famous) – 另一個為你網站或設計專案尋找高解析度圖片的來源。這些圖片是根據 Creative Commons 授權且必須有姓名標示。



9. nos.twnsnd.co (New Old Stock) – 在這裡可以找到由公共資料館所有的老照片,可自由使用且無版權限制。如果你試著建立一個 Twitter feed 像是 @HistoricalPics,這或許是個不錯的圖片來源。

10. freeimages.com (Stock Exchange) – 這是免費圖片、照片的最大資料庫之一,你可以任意使用。只是你必須登入才能下載圖片,這網站之前是托管於 schx.hu 底下,目前為 Getty Images 的一部分。

11. morguefile.com (Morgue File) – 這網站托管超過 30 萬張免費圖片,你可以自由使用它們至個人或商業項目,而無須標示姓名。相簿也內建一個剪裁工具,你甚至可以直接把圖片置入自己的網站。

12. gettyimages.com (Getty Images) – 如果你正在為你的網站尋找專業圖片,而不想支付昂貴的授權費用,Getty 為你而生。你可以從 Getty Images 直接內嵌圖片至你的網站,不過在未來這個計畫可能會加入廣告。

13. pdpics.com (Public Domain Photos) – 該網站收錄成千上萬的免版權的圖片,可以用於個人和商業項目,但必須標註姓名。

14. imcreator.com (IM Free) – 集合所有類型的高解析度圖片,可免費用於商業用途。這些圖片來源大多為 Flickr,必須要參考其授權方式。

15. photopin.com (Photo Pin) – Flickr 是網路上最大的照片資料庫,Photo Pin 幫助你來查找 Flickr 內以 Creative Commons 授權的圖片。如果你不想把圖片托管在自己的伺服器,還能產生內嵌語法。

提示:如何避免使用到常見圖片

你可能發現一張相當棒的圖片,非常適合你的專案,但不確定是不是其他網站已經採用相同的圖片,這時候你不妨試著利用 Google 圖片搜尋「以圖找圖」方式,來查查看這張圖片於網路上被使用的情形。

網址原本應該是要 .com 結尾 確現在變成 .tw

這是我的BLOG http://ting-yublog.blogspot.tw/
現在遇到一個問題,就是我BLOG裡的圖片連結全都不見了,看不到圖片!!
且網址原本應該是要 .com 結尾 確現在變成 .tw
我想是網域的關係導致的,但是該如何修復呢?
看了許多文章,但還是不知道如何把他修改回來,當中也試過修改HTML,但還是恢復不了!! ㄒ .ㄒ
現在我又在我的 GOOGLE+找到我原本在BLOG連結的那些照片,
請問有誰知道該如何恢復原狀呢? 謝謝!!
如果知道者麻煩請跟我聯繫~謝謝您~


Wayne Bot
圖片
https://plus.google.com/104133984219215703590/posts/9urpMg8nVgt

http://3.bp.blogspot.com/-Hm0ApQHXVhQ/U_wZU28qLUI/AAAAAAAAEnk/SJYruS7oFCw/s1600/33.jpg

網址
http://www.wfublog.com/2012/06/blogger.html

Ting-yu Chen
TO WAYNE BOT :
Thank you so much!!  The problem is solved now :)