Monthly Archives: July 2018

Apple: Numbers のテーブルを Illustrator で使用する方法

Mac で Excel ライクな作業を行おうとした時、まず思い浮かぶのが Numbers です。 これまで、Numbers は仕事で共有している Excel ファイルを開くためだけに利用していましたが、ゼロベースで表計算のため Numbers を使用してみると、Excel よりもシンプルで、明確な UI になっているため、目的を達成するためのコストが Excel より低く、使っていてとても気持ちがいいアプリケーションです。 今回は、その Numbers で作成したテーブル等のデータを、Adobe Illustrator でも使いたかったので、そのための方法を説明したいと思います。 目次 Numbers のテーブルを Illustrator で使用する方法 まとめ Numbers のテーブルを Illustrator で使用する方法 以下のような Numbers のサンプルデータを、Illustrator で利用したい場合の説明をします。 メニューから ファイル -> 書き出す -> PDF を選択します。 そのまま 次へ… をクリックします。 書き出す をクリックすれば PDF ファイルとして書き出されます。 書き出した PDF ファイルを Illustrator で開くと、ベクターデータのテーブルやグラフが AI オブジェクトとして利用できます。 まとめ ビジネス用途とするなら、高度なマクロが利用できる Excel に軍配が上がりますが、Apple らしいビジュアライズされたテンプレートを利用したプレゼン資料作成や、個人利用目的であれば Numbers は Excel 以上のパフォーマンスを発揮します。 Numbers と Excel はコンセプトが全くことなる表計算ソフトですので、Excel のあれが使えないといった問題がある場合、そもそも必要ない事をやろうとしている可能性がないか?を考えながら、両者を使い分けるといいかと思います。 この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

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で共有していただければ幸いです。

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で共有していただければ幸いです。

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

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