Windows でよく使うアプリ
Git for Windows
ソースコード管理以外にも、Bash 環境がバンドルされていて、ほぼ、これだけで疑似
UNIX/Linux 環境が整う。 サーバー系は Docker かエミュレーター もしくは実機(私の場合は Raspberry Pi 3B)でまかなえばいい感じ。
基本的に ssh もここで繋げてしまうので、ssh クライアント使わなくなった。ssh の設定は C:\Users\ユーザ名\.ssh\config に書いておけば OK。
ConEmu
コンソール環境の強化。 コマンドプロンプト、PowerShell、Git Bash、Docker どれもこのコンソールエミュレーターに集約している。
bash と cmd と ssh(Git bash)をタブで同時使用とか、かなり便利。
日本語を使う場合、安定版(stable)よりも、preview とか alpha の方が良かったりすることも多いので、動作に不満があったら試してみるといい。公式サイトのおすすめは preview らしい。
Docker
Windows に限らないけど、仮想環境は便利。
どーでもいいけど、イラストがかわいい。 イラストのかわいさだと yarn もいいけど。
Atom
これも Windows に限らないけど便利。最近、ようやく Git 機能が入った。 日本語化すると起動が遅いので、英語メニューで使っている。
Cyberduck
ftp, sftp, webdav クライアントとして良く出来ているし、DropBox や Google drive なども同期クライアント無しで集約できるので楽。
Chrome
入っていて当然。 デベロッパーツールは本当に奥が深い。
node.js
node そのものもいいけど、これをベースに作られたツール関係も便利。
http-server とか、ちょっとしたコンバーターとか便利だわ。 awesome node.js h_network21氏による日本語訳 とかで探すと面白い。
この辺は、python とか ruby とか Go でもいいと思うけど。
このあたりと、フォントくらいを入れれば、一通り揃った感は出てくるようになった。
Mac だと、コンソールとか bash とかフォントについては、揃ってるけど、Windows も、かなり環境構築の作業量は減った感がある。
前回のツイッター編に続いて、Facebook 編。
前回、今回ともに Twenty Eleven という少し古めのテーマを使っていますが、公式デフォルトテーマは、新しいものでも同じような構造になっているので、同じ手法で行けることも多そうです。
今回は、header.php, content.php, content-single.php の3つのファイルに手を入れます。
まずは、header.php の HEAD のタグの中に以下のコードを追加
<meta property="og:url" content="<?php the_permalink(); ?>">
<meta property="og:type" content="website">
<meta property="og:title" content="<?php the_title(); ?>">
<meta property="og:description" content="<?php bloginfo('description'); ?>">
<meta property="og:image" content="投稿用画像のURL">
Facebook のボタンはクリックした後に、Facebook 側からクローラーがこちらのサイトのURL(後で指定する個別投稿ページのパーマリンク)を読みに来て、各種の情報を取得するようになっているようなのだが、このクローラーが正しい情報を読めるとは限らないので、個別投稿ページのヘッダーに、情報を埋め込んでおく。 無しでも動くし、シェアプラグインの類でもこのタグは使ってないものも多いが、安定動作のためには入れて置いた方がいい。イメージのURLも適当に明示指定するのがお勧めです。 ある程度のサイズ(260 px 角以上とかそのくらい)が必要なようです。
このヘッダーは、各ページに使用されるものなので、個別投稿ページ以外では正常に動作しない可能性があるが、悪さはしないので、これでいいかなと考えている。
また、Facebook のクローラーには、キャッシュが入っていて、一度失敗すると、しつこく失敗し続けることもあるようなので、もし、Facebook ボタンを追加するのであれば、面倒がらずに最初からちゃんとやった方が良いようです。 間違った情報がキャッシュされると Facebook 側のデバッグツールを使わないとなかなか消えなくて鬱陶しいです。
Facebook の SDK を読み込んでおきたい場合は、BODY の開きタグの直後に書いておけばいいです。 ちなみに Google Analytics のコードもここに置きます。
保存したら、次に、Facebook のボタンコード生成ページでコードを作ります。
https://developers.facebook.com/docs/plugins/share-button#
IFRAME 版の方のコードの方が、ずれたりしにくいように見えるので、こっちを使います。 通常版の方は SDK の読み込みコードが必要です。 IFRAME 版は無くても大丈夫そうです。
生成したコードを、前回同様に content.php および content-single.php の以下のタグ
</div><!-- .entry-content -->
の直前にコードを貼り付けます。
次に、URL が入っている部分を、以下のコードに書き換えます
<?php urlencode(the_permalink()); ?>
ちょうど、href= から & layout の間になると思います。
これで保存して、完了です。
今回の記事では、以下のページを参考にしました。
WordPressでFacebookのいいね！ボタンを不具合無く設置する際のポイント
Google fonts の Kalam というフォントです。
the quick brown fox jumps over lazy dog.
THE QUICK BROWN FOX JUMPS OVER LAZY DOG.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
TweetWordPress のテーマをシンプルな Twenty Eleven にしてみた。
以前使っていた simplicity2 と比べると、大幅に機能ダウンだが、何となくシンプルなテーマにして、カスタマイズするのもいいかなと。
一番の問題は SNS のボタンがなくなってしまったので、とりあえず twitter のボタンだけ自分で追加してみることにした。
ページのソースを Chrome の [検証] 機能を使って探してみると、
content.php と content-single.php をいじれば良さそう。
twitter の公式ページに行って、リンクを作る。
https://about.twitter.com/ja/resources/buttons#tweet
URLを共有 と ツイート本文 の部分には、何か適当にダミー文字列を入れておき、リンク文字列を作る。
content.php ファイルから
</div><!-- .entry-content -->
という、タグを見つけて、その直前にリンクの文字列を入れる。
先ほどの URLを共有のダミー文字列を
<?php the_permalink(); ?>
に、 ツイート本文のダミー文字列を
<?php the_title(); ?>
に置き換えて保存。
再び、twitter のページに戻って、
・URLを共有をページのURLを使う
・ツイート本文をページのタイトルを使う
に設定して、リンク作成。
content-single.php ファイルで、先ほどと同じ div の閉じタグを検索し、その直前にリンクの文字列を挿入して保存。
これで使えるようになってるはず。
have fun!!