# AMP - amp analytics & conversion Use google analytics must use amp-analytics component
It can use PHP print template function to view
First include
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script> ## ga click event Refer - Adding Analytics to your AMP pages
function amp_ga_event_click_template($ga_id, $selector, $cate, $action, $label, $non_interaction = "0") { $template = <<<EOF <amp-analytics type="googleanalytics"> <script type="application/json"> { "vars": { "account": "%s" }, "triggers": { "trackClickOnHeader" : { "on": "click", "selector": "%s", "request": "event", "vars": { "eventCategory": "%s", "eventAction": "%s", "eventLabel": "%s" }, "extraUrlParams": { "ni": "%s" } } } } </script> </amp-analytics> EOF; return printf($template, $ga_id, $selector, $cate, $action, $label, $non_interaction); } ## google adwords conversion Refer - Using AMP for your AdWords Landing Pages
...
# paypal - 利用 paypal 開發一個簡單的 EC ## Intro Paypal 大致分兩種方式來處理支付功能
api
paypal button
這邊大致上會以paypal button 的方式來處理, 相對起來較為簡易
...
# webview - handle iOS status bar empty height in webview in iOS
If you use fullscreen webview in app and set app size over iOS device navigation bar.
So need add height to fill status bar height.
iPhone6/7/8 is 20px
iPhoneX is 44px
You can use is sample code
header.ios { padding-top: 20px; } @media (width: 375px) and (height: 832px) { header.ios { padding-top: 44px; } } iPhoneX fullscreen webview width is 375px, height is 832px
...
# HTML - image load error handle 2 way
## Use onerror <img src="<image url>" onerror="this.src='<d4 image url>'" /> ## Use Magic Image Pseudo Element img.imgd4 {
position: relative;
display: block;
}
img.imgd4:after {
display: block;
position: absolute;
top: 0;
left: 0;
background: url(<d4 image url>) no-repeat;
background-size: contain;
width: 100%;
height: 100%;
content: '';
}
...
# Something about favicon on website Favicon is a icon on browser tab.
But now we must do more thing on mobile device handle favicon.
## 2 way add browser favicon Put icon in url path <example.com>/favicon.png
Add meta tag <link rel="icon" type="image/png" href="favicon.png" />
Notice: I like use png as my favicon, because i can reuse this file.
Icon format case
<!-- IE --> <link rel="shortcut icon" type="image/x-icon" href="favicon.
...
# Maker - apws96 winkeyless 96 鍵盤自組紀錄 ## 來源 淘寶 - 比比外設
## 引言 其實當初對 60% 以外最有興趣的大概就是像 96 鍵盤的 layout 了
因為幾乎所有的常用的按鍵都有因為緊密的配置, 所以體積也不會太大
當初買了 cm quick fire tk 借給別人用, 對方也覺得不佔空間也不太會影響使用習慣(當然方向鍵模式和數字鍵模式切換還是有點不便)
但是當年出這種配置的鍵盤不多
但是現在有不少可以自組的方案就有這種配置, 且更彈性的可以配置 layout 更棒
## software update firmware 這塊板子最大的好處是已經有 Mac & Windows 的 client 可以配置 layout 和設定 RGB Led
還可以設定 fn layer 與 macro
更可以把設定存起來
非常得強大
winkeyless 的網站提供的軟體就可以刷了
Firmware Installing and Setting Winkeyless Store
但打開後發現裡面的矩陣配置是板子上的硬體的矩陣配置, 並非對應鍵盤的 layout 配置
...
# PHP - Geoip 設定 隨手紀錄 之前有依照 php.net 中的文章設定
http://php.net/manual/en/book.geoip.php#117240
但在某次 php 升版後有點問題
所以放棄該用法
改採用 GeoIP2-php 這套件來處理
這是一個 MAXMIND 的服務出的套件, 也有其他程式語言的套件
其實 php.net 那方法是 MAXMIND 舊的方法, geoip2 是他們現在新的用法與服務
這服務有做 GeoIP 和 欺詐檢測 的服務
具體欺詐檢測有做啥我就沒研究了
官網
過程我就不詳細介紹了
因為文件都有
這邊會介紹一些要注意的地方
主要是用 composer 安裝
然後用 autoload 載入
這流程應該 php 開發者會比較清楚, 反正也有 step by step 的教學與 sample code 可以看
<?php require_once 'vendor/autoload.php'; use GeoIp2\Database\Reader; // This creates the Reader object, which should be reused across // lookups.
...
# php - loop directory Sometime need use php loop directory list all file in this directory
$directory = scandir('./js'); foreach($directory as $file) { if ($file === '.' || $file === '..') { continue; } echo $file; echo "\n"; }
...
# php - 比對時間 記錄一下比對時間的方式(利用 timestamp)
time() > strtotime('2017-11-13 23:59:59');
...
# web - mobile web on iPhone X first preview ## Intro On 2017 9/12.
Apple published iPhone X.
And this device has so special screen.
So many web & iOS developer worry about some case like.
(form Apple)
OMG!
It can effect app show on full screen.
So Apple has provide guideline about iPhone X.
iPhone X - Overview - iOS Human Interface Guidelines
It is great change for web & iOS developer.
...