Monthly Archives: July 2018

New!

CSS3: Bootstrap4 グリッドシステムで横並びの col の順番を入れ替える

 Bootstrap のグリッドシステムでレスポンシブデザインを行う際、画面サイズに応じて col の順番を入れ替えたいケースがあります。 そういった場合、従来は col-push, col-pull といったクラスを使用していましたが、Bootstrap4 ではクラス名が order へと変更されています。 今回はこの order の使用方法を説明したいと思います。 目次 Bootstrap4 Grid で横並びの col の順番を入れ替える まとめ Bootstrap4 Grid で横並びの col の順番を入れ替える 以下のような 3つの div(col)があった場合、左から順番に 1-2-3 と表示されます。 order-first 3番目 の div(col)に order-first クラスを加えた場合、3-1-2 と表示されます。 order-last 1番目 の div(col)に order-last クラスを加えた場合、2-3-1 と表示されます。 order-num 2番目 の div(col)に order-12, 3番目 の div(col)に order-1 クラスを加えた場合、1-3-2 と表示されます。 bootstrap のスタイルを見ると、order-first には -1、order-last には 13 の order が定義されているため、order-1 や order-12 より優先されることが理解できます。 まとめ bootstrap のバージョンアップによる修正コストは無視できるものではありませんが、今回説明した order への変更は pull、push より明示的な表現のため、コーディングしやすく、メンテナンスがやりやすくなったと感じました。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。
Update!

Tips: macOS で BizSTATION を利用する方法

メガバンクのひとつである三菱UFJ銀行のネットバンキングサービスに、BizSTATION というサービスがあります。 ただ、この BizSTATION は Mac ユーザーを完全に無視した仕様となっており、Windows 機のみ、しかも IE という前時代的な環境でなければ利用できません。 今回は、この三菱UFJ銀行のネットバンキング BizSTATION を Mac で利用する手順をメモしておきます。 目次 電子証明書の取得 証明書の発行 証明書の書き出し キーチェーンへ登録 BizSTATION ログイン まとめ macOS で BizSTATION を利用する方法 Mac で BizSTATION を利用するための手続きには Windows 環境(仮想環境でも可)が必須となります。 Windows がない方は、早々に諦めて、Windows 機を導入するか、BizSTATION から他社のネットバンキングに移行することをお勧めします。 環境 Safari(macOS) Windows 10(VMWare,VirtualBox等の仮想環境) + FireFox(Win) BizSTATION ワンタイムパスワードカード FireFox(Win) > 電子証明書の取得 画面の左下にある 電子証明書取得 ボタンからログイン ご契約者番号、利用者ID、初回ログインパスワード を入力しログイン FireFox(Win) > 証明書の発行 証明書取得用パスワード再発行 で取得したパスワードを入力後、証明書が発行される FireFox(Win) > 証明書の書き出し FireFox オプション > プライバシーとセキュリティ > 証明書を表示 取得した BizSTATION の証明書を選択し バックアップ で証明書ファイルを書き出す 書き出し時に、パスワードロックをかけるため、バックアップ用パスワードを入力し OK Win から Mac に、書き出した証明書ファイルを移動 すれば Windows での作業は完了 macOS > キーチェーンへ登録 証明書ファイルをダブルクリックでキーチェーンが起動するので、証明書書き出し時に設定した パスワードを入力 し、キーチェーンへ証明書を登録する Safari(macOS) > BizSTATION ログイン 各種 ログインボタン(円預金) よりログイン このブラウザは対応しておりません…画面が表示 Safari メニュー 開発 -> ユーザーエージェント -> InternetExplorer11 で UA を切り替える このブラウザは対応しておりません…画面が、ログイン画面に切り替わるので ログインパスワードを入力 しログイン まとめ 証明書は年に1度更新する必要があります。 今後も BizSTATION が Mac をサポートしないことを前提とした場合、時間的コスト面から BizSTATION 専用の安い Windows 機を購入するのが正解かもしれません。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。
Update!

WordPress: 投稿に自動挿入される p タグを無効化する方法

長らく WordPress を触っていなかったせいで、インストール直後のデフォルト状態で、投稿に自動挿入される pタグの存在を忘れていました。 今回はこの pタグが自動挿入されないようにする方法をメモしておきます。 目次 投稿に自動挿入される p タグを無効化する方法 まとめ 投稿に自動挿入される p タグを無効化する方法 おきまりの function.php にアクションとフィルタフックを以下のように定義します。 function.php まとめ 今回あらためて感じたのですが、WordPress はとてもよく出来ていますね。 WordPress を使えば、一般的なコーポレートサイトなら、学習コストを含めて2,3週間程度あればそこそこのものが完成してしまいます。 ホームページ制作はプロに任せるのも効率的ですが、WordPress 自体がプロの役割に相当しますので、Web に興味があれば、WordPress を使って自身で制作してみることをオススメします。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。