2019年の記事一覧

YouTubeチャンネルのRSSフィードをPHPでパースして出力する

WEB

概要

  • YouTubeチャンネルは、以下のようなURLでRSSフィードを吐いてる。

https://www.youtube.com/feeds/videos.xml?channel_id=【チャンネルID】

  • これをPHPのsimplexml_load_file関数で読み込み、パースして出力する。

サンプル

Read More

jquery.qrcode.js を使用して生成したQRコードをPNG画像として保存する

WEB

jquery.qrcode.jsとは

jquery.qrcode.js

http://jeromeetienne.github.io/jquery-qrcode/

  • QRコードを生成するjQueryプラグイン
  • 画像は生成されず、tableタグまたはcanvasタグで描画することができる。
  • ソースはGitHubで公開されている。

使用手順

  1. GitHubから jquery.qrcode.min.js をダウンロードし、jQuery本体よりあとで読み込む
  2. HTML側に描画スペースを用意
  3. 用意した要素に対してjQueryスクリプトを記述
Read More

Sublime Text 3 に OmniMarkupPreviewer を導入する

Mac

OmniMarkupPreviewerとは

OmniMarkupPreviewer is a plugin for both Sublime Text 2 and Sublime Text 3 that preview markups in web browsers.

GitHub – timonwong/OmniMarkupPreviewer

マークダウン記法で書かれたテキストを、ブラウザ上でリアルタイムプレビューできるパッケージ

導入ログ

  • Package Controllから「OmniMarkupPreviewer」をインストール
  • cmd + option + O でブラウザプレビュー
    • 初回、404状態になってしまった。

  • パッケージのユーザ設定を追記して解決
    • Preferences > Package Settings > OmniMarkupPreviewer > Settings – User
{
	"renderer_options-MarkdownRenderer": {
		"extensions": ["tables", "fenced_code", "codehilite"]
	}
}

参考エントリー

YouTubeのサムネイル画像をクリックしたら埋め込みiframeを読み込むjQuery

WEB

やりたいこと

  • 余計なデータ通信を発生させないために、YouTube動画のサムネイルをタップ・クリックしたときにだけ、埋め込み動画のiframeを読み込ませる。
  • 16:9のレスポンシブ対応をする。
  • サムネイル画像と埋め込みiframeで表示位置がズレないようにする。

サンプル

Read More