[Blogger] 2019.08.25 How To Hide Widget Title In Blogger

This article is quoted form How To Hide Widget Title In Blogger

Bloggers hangout presents a simple blogger trick for "How To Hide Widget Title In Blogger". It makes blogs look professional.

Step 1: Sign into your blogger account.

Step 2: Choose the blog from your dashboard and then select design.

Step 3: You will be navigated to page elements page and add a gadget to your blog. Add a
widget with title as Advertisements and then select design.

Step 4: Now select edit html and then check expand widget template which is present on right
side corner.

Step 5: If you are using mozilla firefox then press Ctrl +F and search for widget title as
Advertisements.
(or)

If you are using google chrome then press F3 function key and search for widget title as
advertisements.

Step 6: Check for the line below in your code
<b:widget id='HTML2' locked='false' title='Advertisements' type='HTML'/>

Step 7: Get the id of widget that is written in blue in the above code. In the above example it is HTML2.

Step 8: Now add below Css definition above this tag ]]></b:skin> in your template.

#HTML2 h2{
display: none;
}

Step 9: Preview the blog and save the template.

We successfully completed the blogger trick.

If you have any doubt about this blogger trick don't hesitate to comment.

閱讀更多 »

[Blogger] 2019.08.23 Loops, loop positions, and isFirst variables in Blogger

Looping through the listing of blog posts

<b:loop values='data:posts' var='post'>
Inside the loop data:posts changes to data.post (determined by the value of var, set here as var='post')

We can reference the id of the current post in the loop as <data:post.id />
</b:loop>


Looping through the listing of blog posts with an additional index

<b:loop values='data:posts' var='post' index='i'>
The id of the current post in the look is <data:post.id />

The position of this post in the loop index is <data:i />

We can run a IF statement against this value like so:

  <b:if cond='data:i == 2'>
    This is the post contained in the loop at position 2, which in an array is Post #3 (arrays start counting at 0)
  </b:if>

</b:loop>

To do a greater-than and less-than you need to use the HTML code for greater/less, otherwise it will throw a Blogger template error.

<b:if cond='data:i &#60;=2'> for i is less than or equal to

<b:if cond='data:i &#62;=2'> for i is greater than or equal to


"is first" variables

There are a number of "is first" variables in Blogger that are unfortunately not declared on the official variable list.

data:post.isFirstPost
This variable can be used to show a different behavior on an index page for the first post, by placing it within the data:posts loop, like so:
<b:loop values='data:posts' var='post'>
   <b:if cond='data:post.isFirstPost == &quot;true&quot;'>
first psot!
   </b:if>
</b:loop>

data:post.isDateStart
This variable is used to group posts by date, often found on a Blogger site's index pages, where it shows all posts under one day/date, then moves to the next day/date without repeating that value.

data:post.firstImageUrl
This variable shows the URL of the first image used in the blog post. This is often handy for creating an index page of image thumbnails. But while the "thumbnail" variable (data:post.thumbnailUrl) only shows a 72 pixel square and only works for Google hosted images, this firstImageUrl variable shows the full image url and can be used for non-Google-hosted images.

data:post.sharePostUrl
This variable displays the absolute url for a blog post in question. Used in the social media share buttons, but can certainly be used in other cases.

data:post.snippet
This variable displays the first 140 characters of a blog post, or what comes before a jump break, whichever is first.

Example, albeit not for this usage:

<b:if cond='data:blog.metaDescription != &quot;&quot;'>
   <meta expr:content='data:blog.metaDescription' name='og:description'/>
<b:else/>
   <meta expr:content='data:post.snippet' property='og:description'/>
</b:if>
<meta expr:content='data:post.thumbnailUrl' itemprop='image_url'/>

The above code will show the first image URL as the snippet's thumbnail, along with either the post's meta description (search description in the blog post) or, if none, the 140 character snippet.


Social sharing thumbnail variable that you need

We all wanted to add a larger thumbnail image for social sharing, for example for Facebook and now Google+, but had no way to do so since the other thumbnail was only 72 pixels. Yes, there is now a new variable...

data:blog.postImageUrl
This variable, available to you in the HEAD of your template, if used on item page types, will display the first image from your blog post in all of its glory.

This article is quoted form Loops, loop positions, and isFirst variables in Blogger

閱讀更多 »

[英文學習] 2019.08.05 離開你的人愈多，留下的人就愈重要！《玩具總動員》的 5 句感人名言

This article is quoted form 離開你的人愈多，留下的人就愈重要！《玩具總動員》的 5 句感人名言

《玩具總動員》陪伴我們超過 20 年的歲月，現在第四集熱映中，不知有沒有勾起大家童年的回憶呢？《玩具總動員》裡暗藏了許多人生哲理，這次小 V 帶大家回顧歷年的感人台詞，一起重溫當時的感動！

The important thing is that we stick together.「重要的是我們互相扶持。」

stick together 字面上是「黏在一起」的意思，其實就是表示 「互相扶持、團結一致」 。

胡迪（Woody）一開始忌妒巴斯光年（Buzz Lightyear），後來卻和他變成好朋友，兩人一起合作、冒險，這不就證明了「患難見真情」嗎？人生就是需要這樣的摯友！

A：I'm afraid that we cannot solve the problem this time. Things are getting out of control！（我很怕我們這次無法解決問題，一切都失控了！）
B：As long as you are here with me, everything will be fine. The important thing is that we stick together！（B：只要你和我在一起，事情就會好轉。重要的是我們互相扶持！）

You have saved our lives. We are eternally grateful.「你救了我們，我們永遠感謝你。」

副詞 eternally 是 「永遠地」 的意思，與 endlessly、permanently、perpetually 同義；grateful 指 「感恩的」，同義詞有 thankful、appreciative。

三眼怪（Aliens）的台詞雖少，但這句絕對是大家印象最深刻的經典台詞之一！他們教了大家要「懂得感恩」。

You're with me every time I'm in need. I'm eternally grateful.（每次我需要幫忙時你都在身邊，我永遠感謝你。）

Woody once risked his life to save mine, and I couldn't call myself his friend if I wasn't willing to do the same.「胡迪曾涉險救我，如果我不願做同樣的事，就不能自稱是他的朋友。」

risk sth. to+V. ／risk+Ving 是 「冒著……的危險去做某事」 之意。
胡迪（Woody）和巴斯光年（Buzz Lightyear）告訴我們「朋友之間是平等、互助的」。

She once helped me when I was struggling financially, I couldn't call myself her friend if I wasn't willing to do the same.（她曾幫助經濟困難的我，如果我不願做同樣的事，就不能自稱是她的朋友。）

To the world you may be just one person, but to one person you may be the whole world.「對這世界來說，你可能只是某人；但對某人來說，你是他的全世界。」主人有很多玩具，但這些玩具卻只有一個主人。

這句話也可以用另一個角度詮釋，表示「不要妄自菲薄，總有一個欣賞、在乎你的人」！

Never look down on yourself. To the world you may be just one person, but to one person you may be the whole world. There's always someone out there for you.（不要看輕自己，因為對這世界來說，你可能只是某人；但對某人來說，你是他的全世界。總有一位適合你的人。）

As more and more people leave you, the more and more important those who remain become.「當離開你的人愈來愈多，留下來的人就愈來愈重要。」

remain 除了表示 「剩下、保持」 之外，還指 「（人）逗留、留下」 。
我們總是會心心念念已經離開的人，卻忽略總是陪在身邊的人，這句話提醒了大家要「珍惜你所擁有的」。

Please spend time with the friends and family who cherish you. As more and more people leave you, the more and more important those who remain become.（請花時間陪伴那些珍惜你的家人與朋友，當離開你的人愈來愈多，留下來的人就愈來愈重要。）

小 V 覺得《玩具總動員》不僅帶來歡笑，更融合了生活哲理，適合所有年齡層的人觀賞！

（本文出自 VoiceTube）

---

Phrases and Vocabdivary

Vocabdivary 單字

eternally IPA [ɪˈtə:nəlɪ] KK [ɪˋtɝnəlɪ]

adv.永恆地，常常，不絕地；

permanently IPA [ˈpəmənəntlɪ] KK [ˋpɝmənəntlɪ]

adv.永久地，長期不變地；

perpetually IPA [pɚˈpɛtʃʊəlɪ] KK [pɚˋpɛtʃʊəlɪ]

adv.永久地，長期不變地；

cherish IPA [ˈtʃɛrɪʃ] KK [ˋtʃɛrɪʃ]

vt.珍愛；懷有；愛護；撫育；

Phrases 片語

be willing to do 願意去做某事。

閱讀更多 »

[Online Tools Practice][已測試OK] 2019.08.03 前端也能產生QRCode

Embed from Getty Images

This article is quoted form 生成二维码的 jQuery 插件：jquery.qrcode.js

預設產生的二維碼大小是 256×256，當然也可自行定義大小

Canvas版方式渲染

Table版方式渲染

自訂size (120x120)

中文 自訂size (120x120)

下圖為經過微信的掃描所呈現的結果

閱讀更多 »

[CSS] 2019.07.25 發現CSS會有衝突, 記錄一下

不同開發者CSS衝突問題

在更新[Online Tools Practice][已測試OK] 2019.07.18 刪除重複行/去除重複資料這個頁面時，為了使用metroui中的checkbox Style卻發生CSS會衝突到的現象，如下圖所示。

引用https://cdn.metroui.org.ua/v4/css/metro-all.min.css

不曉得如何解決，只好將checkbox部分的css code單獨拉出來，才不會讓button的樣式被衝突到，如下圖所示。

閱讀更多 »

[Javascript] 2019.07.19 JavaScript程式碼註釋範例

Embed from Getty Images

This article is quoted form JavaScript程式碼註釋範例

閱讀更多 »

[Online Tools Practice][已測試OK] 2019.07.18 刪除重複行/去除重複資料

Embed from Getty Images

This article is quoted form 刪除重複行/去除重複資料

去除重複資料

使用Excel或TXT文字文件，製作公司/學校人名名單表格，不小心重複輸入了多個名字；或是有一份個人資料文件，有可能出現重複的電話號碼﹑電郵地址等，如果一個一個檢視，然後去修改﹑刪除，是一件很費時費力的工作；這時去除文件中的重複數據，就需要這一個工具，減輕工作。

範例︰ 成龍 成龍 劉德華 周杰倫 蔡卓妍 蔡卓妍 李連杰 林志玲 周星馳 周星馳 yahoo@yahoo.com.hk gmail@gmail.com.tw gmail@gmail.com.tw homail@homail.com.cn homail@homail.com.cn

     

閱讀更多 »