Notes

Drupal 8のテンプレート内で投稿日時のフォーマットを変更する方法。

2014.10.29 / Notes

Drupal 8からテンプレートエンジンがtwigに変更になりましたので、デザインテーマの作成方法も大きく変わりました。
細かい点ですが「node.html.twig」内で投稿日時を任意のフォーマットに変更する際のメモです。

 

一番シンプルな方法としては、テンプレート内でフォーマットを指定することができます。

 

node.html.twig

「createdtime」はタイムスタンプですので、「|」を挟んでフォーマットを指定します。

 

Drupalでは環境設定に日時のフォーマットを登録していて、デフォルトでは「long」「medium」「short」の3種類があります。
この登録済みのフォーマットを指定する場合には「template_preprocess_node」に変数を用意します。

 

THEMENAME.theme(THEMENAMEは実際のテーマ名になります)

「created」という変数(名称は任意で)を設けて、その中に日時のフォーマットを指定した値をいれます。
テンプレート内では次のように記述します。

後者の方法で日時を指定したほうが、メンテナンス性は高いと思います。

MAMP PROでPostfixにGmailを設定のメモ。

2014.09.24 / Notes

MAMP PROのPostfixにGmailを設定して、ローカルからメールを送信する際のメモです。
MAMP PRO
「ユーザー名」「パスワード」は実際にGmailで使われているものを入力します。
Gmail以外でも一般的なSMTPでしたら問題なく送信できると思います。

CSSでテキストの一行目だけを一文字分出したいとき。

2014.07.27 / Notes

CSSで注釈などのテキストの一行目だけを、一文字分出したいときのメモです。

テキスト全体を「padding-left」で一文字分下げて、「text-indent」にて一行目のテキストのみ一文字分、前にずらしています。表示は次のようになります。

 

※注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。注釈のテキストが入ります。

オンラインノートの「Springpad」が終了。

2014.06.09 / Notes

オンラインノートの「Springpad」が2014年6月24日をもって終了となりました。
この分野ではEvernoteが有力ですが、Springpadも独自性があって、使っていても楽しいツールでした。
Springpadに変わるサービスが、有料であってもいいので登場してほしいところです。

2014年のMacのWeb制作環境。

2014.04.10 / Notes

Web制作ではこれまでずっとMacで行っていますが、使っているアプリケーションの制作環境は少しずつ変わってきました。
2010年当時は、こんなラインナップでした。今でも使い続けているものもありますが、便利さなどを判断して違うアプリケーションに置き換えたものも多いです。今現在の自分のWeb制作環境をご紹介します。

Espresso

Espresso

Web開発でメインで使っているテキストエディタです。Macらしいインターフェイスで軽快に動作するところが気に入っています。ほかのテキストエディタ同様にEmmetを導入することで生産性がぐっと上がります。唯一の不満点をとしては、ウィンドウ分割ができないところでしょうか。以前はCodaをメインにしていましたが、動作が少し重いのとタブのデザインが好みでなかったので、最近ではあまり使わなくなりました。

 

 

Illustrator

Illustrator

ベクターベースのグラフィックツールです。デザインカンプの作成や、画像パーツの作成・スライス処理など、日常的に活用しています。こちらも以前はFireworksで行っていた作業でしたが、CS6をもってFireworksの開発が終了したのを機に、思い切ってIllustratorに移行しました。最近はIllustratorによる作業にも慣れて、改めてその多機能さに感心しています。もっと使いこなさないと。

 

 

Photoshop

Photoshop

画像の編集、Web用の書き出しにはPhotoshopを使っています。サイズの縮小などによるリサンプリングはやはり一番きれいです。

 

 

MAMP

MAMP

MacでApache、MySQL、PHPなどを、ローカル環境で利用できるようにするためのパッケージです。このアプリケーションもWeb開発では必須ではないでしょうか。自分はGUIで細かく設定できるMAMP PROの方を使っています。

 

 

ForkLift

ForkLift

ファイルブラウザ&FTPクライアントです。このアプリケーションも長く使い続けているものの一つです。Finder自体もタブに対応したり進化していますが、ForkLiftではデュアルパネルがあって、さらに便利です。

 

 

Evernote

Evernote

オンラインノートアプリです。Webで見つけた情報のスクラップや、制作の中のちょっとしたメモなどに重宝しています。忘れてしまいがちな情報を記録することは大事だと感じるこのごろです。

 

 

Dropbox

Dropbox

オンラインストレージです。デバイス間でのデータの同期ができるので、デスクトップで行っている作業を場所を変えてノートで行ったりと、ワークスタイルの幅が広がりました。データ自体のバックアップという意味でも安心につながります。

 

 

Parallels Desktop

Parallels Desktop

Windowなどの仮想マシンを構築できます。サイトの動作検証にも十分なので、Windows実機に触れる機会はますます減りました。

 

 

Byword

Byword

文章を書くことに特化したテキストエディタです。マークダウンにも対応しているので、ちょっとしたアウトライン作成に活用しています。

 

 

TextExpander

TextExpander

テキストの入力補助アプリケーションです。短い文字列を入力入力することでスニペットを展開して入力することができます。よく使うHTMLタグやjQueryのコードをあらかじめ登録しておくことで、素早いコーディングが可能です。

 

 

Codebox

Codebox

上記のTextExpanderでは入力を目的としたスニペットですが、こちらはある程度長いコードをストックするためのアプリケーションです。汎用的なスクリプトを再利用するために、残しておくようにしています。

 

 

Dash

Dash

プログラミング言語のリファレンスとスニペット管理アプリケーションです。膨大な種類の言語のリファレンスが用意されていて、高速に検索することができます。

 

 

Window Magnet

Window Magnet

ウィンドウを上下左右に均等に分割して表示するためのアプリケーションです。画面の左半分でコーディング、右半分でブラウザでの確認といった感じに、画面もきちんと整理整頓したい人向け。