KITAMULABO

Ver:3.0

30代子育て世代の建築系サラリーマンによる苦悩と挑戦の日々

"85件"の投稿があります

WordPress おすすめプラグイン

2021.2.8

WordPressはプラグインでどんどん機能を追加できる!その反面、入れれば入れるほど遅くなる、そのせめぎ合いです。今回のサイト更新に合わせて見直したプラグインをご紹介します。

サイト全体の管理系

Site Kit by Google

アクセス統計やらSEO対策とかできるGoogleの公式プラグイン。

SiteGuard WP Plugin

サーバーによる自動インストール時にはじめから入ってたセキュリティソフト。ログインやコメント時に画像認証をつけるのでスパムが激減。

WP File Manager

サーバー上のファイル操作をWordPressの管理画面から行うツール。テーマ開発には必須。

WP Multibyte Patch

マルチバイト言語である日本語を使用するのに必須のプラグイン。

Jetpack

Jetpack

WordPress.comが出してるいろんな便利機能のパック品。重いって言われてるけど、一部の機能だけでも導入の価値はあると思うし、とりあえず入れてみて、不満がある機能は他を探せばいいと思います。

僕が使用している機能は、ギャラリー表示の上書きとSNSの共有機能だけです。SNSは記事更新時に自動投稿してくれるものと、記事に写真を貼り付けるときにGoogleフォトから引っ張ってこれる機能が手間がなくていいかなと思っています。

逆に外して、違うプラグインに変えたものは以下の2つです

AddToAny Share Buttons

SNSへの共有リンクを貼ってくれます。

WP ULike

いいね!機能を追加します。

やはり単体のプラグインのほうが機能的にはいい場合が多いですね。あと出力系は、テーマ内の自由な位置に自分で記述できる点も重要。

表示操作系

Urvanov Syntax Highlighter

記事内にコードタグでphpとかHTMLとかきれいに見せたい時のもの。入れるだけで既存のコードタグを上書きしてくれる。

WP External Links

記事内のURLに自動でリンクを貼ってくれる便利なやつ。

その他

codoc

投げ銭機能を簡単に追加できるプラグイン。

プラグインを選ぶときのポイント

ということで大体以上のようなものを導入していますが、自分なりのポイントは、プラグインに依存しなくてもいいプラグインがいいプラグインだと思います。例えば記事内でショートコードを書いて呼び出すタイプだと、そのプラグインを外したときに変な文字列が残ります。また、その機能を使うときに別の画面を開かないといけない、とかではなく、できるだけ標準の機能を上書きしてくれるタイプが手間もかからなくて好きです。

皆さんもおすすめのものがあったらぜひ教えて下さい!

この記事がよかったら
+1
:
:

FIAT500の通勤風景をVRで撮影

2021.2.6

愛車のFIAT500を買い換えることになったので、普段の通勤ルートをVR180で記録してみました。アクションカメラの設定をちゃんと見直してAdobe Premiere Proで編集したら、なかなかの画質になりました。WIFI・有線LAN環境でご確認ください。VRゴーグルをお持ちの方は立体視出来ます。撮影はフレキシブルアームの三脚を使って、助手席のヘッドレストに固定しています。車についての詳細な解説は下の記事をご確認ください。

この記事がよかったら
:
:

FIAT500を手放すに至った経緯

2021.2.6

FIAT500の紹介記事の続きです。後半ただの愚痴なので、不快な気分にさせたら申し訳ありません。子供が二人出来て、二人目もちょっとだけ大きくなって、後席に2つチャイルドシートが並ぶようになりました。上でも述べたように2ドア4シーターは子育て世帯には厳しい。この春2021年で車検だけど、次の車検ぐらいが限界かなと言う話は妻としてました。そんな中500にトラブル発生!

2度目に500が止まった日とその次の日。

2020年の10月末の夕方、仕事終わり、ちょっと出るのが遅くなったから早く帰らなくちゃ~と会社の駐車場に停めた500に乗る。キーを回す。そしたらこれ。

恐怖の警告灯全点灯

ハイ来ました!ディーラーは定休日。落ち着いてメーカーのコールセンターに電話。状況確認と対処方法を試してみるがかからず、レッカーの料金を聞いて、静かに電話を切って、JAFを呼ぶ。小1時間でJAF到着。世間話をしながら診てもらうとバッテリー上がり。しばらく交換してなかったのでそもそもの寿命と、寒くなってきたのでダブルパンチだったらしい。(ディーラーの半年点検は真面目に受けている)スターターにつないでもらうとエンジンがかかったので、その日はそのまま帰宅。

次の朝、またJAFにエンジンかけてもらってディーラーに向かう。バッテリーとついでの半年点検、消耗品交換諸々併せて13万の見積に、冬のボーナスのやりくりをシミュレーションしながら承諾。代車で一度会社に出て閉店時間近くに戻って受け取り。

余談だけどこの半年でディーラーが会社と逆方向に引っ越しており、会社と往復100km走ってたり、時間がなかったのでその間の高速代は自腹。仕事はほとんど進まない。昨日からの流れでちょっと疲れていた。

受け取りの際に営業さんから頼んでないのに下取りの査定金額を聞かされる。(午前の見積中、小一時間暇だったのでパンダ試乗させてもらってた。)7年目、約7万kmの走行で70万だそうだ。演技のいい数字が並ぶがさっき13万という不吉な数字をカードで切ったばかりなので行って来いだ。ふ~ん。

行って来いで一旦真顔になった僕は、さらに不思議な質問を受ける。

「ホイール交換されているみたいですが、元のホイールはお持ちですか?」

はて、ホイールはここの整備工場(移転前)で換えてもらったし、その際に自宅では保管場所がないから引き取ってもらった。その後処分したかは知らないが、整備記録も見ずに査定したのだろうか。それとも記録してなかったのだろうか。

不思議に思いつつ事情を説明。不毛な会話に少しイラッとしたのは、好きで換えてるお気に入りの鉄チンホイールをスタッドレスのスペアだと勘違いされたような気がしたというのもあったかも知れない。

でもそんなことはどうでもいい。その時の僕は早く帰りたかった。2日連続で帰りが遅くなっている。その間妻はワンオペで二人の子供を相手しているのだ。腹も減ったが、帰って何よりも先に子供を風呂に入れなければならぬのだ。

と思って営業さんの話を適当にかわしつつ、洗車済みの自車に乗り込む。うん、代車のスカスカマーチとは違う。いい感じだ。しかし、エンジンを掛けたらふとあるものが目に入った。

写真は後日撮ったもの

オーディオのここのパーツが取れかけていた。触ったら外れた。

これが何かというと、このピースを4箇所外すことでオーディオデッキを取り外すためのジグを差し込むことができる。エアコンの吹出口を外すときもオーディオから外さないといけないので、エアコンフィルター交換時に爪を折ったなとすぐ気づいた。自分自身でもオーディオをいじる際に何回か取り外しているのでよくわかってるところだ。何ならその際に1個紛失してしまい、以前にこのディーラーのまさに今目の前にいる整備担当の人にパーツある?って聞いてみたことがあった。その時は取り寄せたら1万円(!)って聞いたので、諦めてヤフオクでジャンクのオーディオパネルを落として自分ではめたのだが、今その1/4、2500円が手の中にあった。

車を出しかけてもう一回止まって窓を開ける。これ取れたけど予備あります?

一旦そのパーツはどういうものか、から説明してくれる整備さん。それは知ってる。上で書いた。すでにこれ注文したら1万円だったよねってとこまで思い出している。がもちろん予備なんて無い。前もなかった。

とりあえずブサイクだから両面テープかなんかあります?って聞いたら。ジグを指すから貼れないって。それも知ってる。貼って剥がせる丁度いい強度の両面テープあるか?って意味だったんだが残念、通じなかったようだ。

前々から気づいていたが、あえて言おう。このディーラー、対応がイタリアンなのである。

たかがほんの小さいパーツなんだが、おしゃれなデザインの内装だけによく目立つ。テンションは下がる一方だが、急いでいたので「今度来た時ちょっとまけてね」ってその場を後にした。大人だ。パパは強い。

遅くなるという予定よりも更に遅くなって帰ったら妻はすでに不機嫌だ。そりゃそうだ。1才児と2才児のワンオペはなかなかきつい。妻も仕事上がりなのでなおさらだ。さっさと子供らを風呂に入れる。その後、事の顛末は一応報告して寝た。疲れてたのですぐ寝た。

買い替え宣言発令

次の日の夜、妻から買い替え宣言が発令された。もちろん安心と信頼の国産のファミリーカー縛りである。この時、僕はまだ乗り気ではなかった。500はまだ手放したくない。が、先のディーラーの対応を妻に言及されるとまあそうかと納得。その週末には気になってたあのメーカーの最寄りのディーラーに行ってみた。とんとん試乗、とんとん見積。気になるメーカーの気になるモデルは思った以上にいい車だった。僕もこの時点で完全に500と分かれることを決意した。

後日、会社で今回の件をおしゃべりしてたら、一旦買ってくれるという話になったり、それが取り消しになったりと1ヶ月ほどドタバタしたのだがそれはまた別の話。最終的になんとか年内生産に間に合うよう注文できた。

それくらいのタイミングでFIATの方のディーラーからお電話がかかってきた。内容は買い替えの営業だ。残念。こちらとしてもちょうどよかったので、買い替えの件を話し、約1ヶ月後、納車のタイミングで買取だけして欲しいとお話した。

納車の日 500とお別れの日

新年あけまして、いよいよ新車の納車日が決まった。会社近くのディーラーさんなので自宅からは離れているのだが、日曜に自宅まで持ってきてくれることに新鮮な感動を覚えた。

夕方持ってきてくれるらしいので、昼一で500をフィアットのディーラーに持っていく。もちろん事前に連絡して印鑑とか持って行った。連絡した際に言われたが、年をまたいでしまったので60万円の査定になりますということだ。しょうがない。こっちとしてはこの間13万払ったばっかなので実質47万だが、それでも国産車のディーラーの見積より若干高い。ありがたいと思おう。

ということで、さっさと査定書に銀行口座書いて実印押した。(押したのは妻、僕は運転手)もちろん、帰りは足がないので公共交通機関で帰る。最寄りのバス停に向かう途中で、500の中の忘れ物に気づいて一回戻るとバスが行ってしまった。次のバスがかなり待ちそうなので、タクシーを呼んでもらってディーラーの中で待たせてもらうことにした。その日は吹雪いていた。5分ぐらい経ったところで、受付のお姉さんに今タクシーを呼んでおりますのでって声をかけられた。今呼んだのかよ、あと何分ぐらいで着くかはわかんないのかよって心の中だけで突っ込んどいた。

その間、リアのユーロプレートの取り付け穴をボディ同色のキャップにするオプション品が目に入った。5000円って書いてあって「マジかよ」って言ったのは心の中だけじゃなかったかも知れない。

タクシーが来たのでディーラーを後にする。さらばFIAT。タクシー代4000円は僕持ちである。

買取金額振込みまでのゴタゴタ

次の1周間はドキドキだった。調子に乗って新車はMTにしたのだ。サイズも少し大きくなっている。何より500にはない今どきの便利機能、電気設備が盛りだくさんで、たくさんのスイッチにてんやわんやしてた。それもだいぶ慣れてきた次の週末、FIATの方の営業から電話がかかってきた。振り込んだよって連絡かと思って出たら、そこからまた一悶着あった。電話の内容はこんな感じ。

「査定会社の方に持ちこんだら、ホイールが交換されておりまして、査定金額が5万円下がります」

は? 注:はじめてドロップキャップを使ってみた

買い物ついでに妻と二人で久しぶりにお気に入りの店でランチしてたのが急にテンション下がる。

「ホイールの話は前もしたでしょう?」

「すみません」

「この間オーディオパネルのパーツ壊したよね 気持ちサービスしなさいよ」

掛け直し

「1万円みて4万円の差額になります」

「しかし査定書に実印も押したと思うけど、書類はどうすんの?」

「では もう一度査定書をお送りさせていただきます」

「面倒だから妻の職場まで持ってきてよ」

注:この車は僕が通勤車で使ってるけど、もともと妻が購入したものでオーナーは妻になっている。査定書に押してある実印も、振込口座も妻のものだ。そもそも僕に電話がかかってくることが謎である。

「わかりました」

妻も目の前にいるので、飯食いながら論点整理。

  1. そもそも判子押した後になんで値段が動くのかもわかんないし、そのディーラーと買取の契約してるからその後どこに持っていっていくらになったかなんてこちとら知る由もないし、そんな説明は受けていない。
  2. ホイールが揃っていなくて△5万円と言われてもその値段に根拠がない。査定書は一括手書きで60万としか書かれていない。建築で言う内訳書がないのだ。特に俺は積算だ。
  3. 書類に判子押したあとで口頭で値段変えようとされた。書類は?と聞いてから、じゃあってことだったので、ほんとに口約束で進めるつもりだったらしい。それなら振り込み後にこちらが100万って聞いたってごねることも可能になる。

話せば話すほど腹が立ってきて、美味しいランチも集中して楽しめなかった。

しばらくして妻の携帯にSMSで何時頃だったらいいかって連絡が入る。

妻もついでに怒りのメッセージを返信

次の日、僕にSMSでメッセージが

「このたび、こちらのミスだったので差額4万円はこちらで負担させていただきます」

は?なぜ変わった。負担できるならはじめから連絡するなよ。俺では請求しといて妻からのメッセージを受けてチャラになるってのも不服。こちらで負担させていただきます、って言い方はミスの反省になっていないような気がする、なんか半分こっちも悪いような言い草。大体、このやり取りによって時間を無駄にしたり、不快な気持ちになったりした分のフォローはない。

流石に腹たって、一日置いてみて気持ちを落ち着かせようと思ったけど、全然落ち着かなかったので人生初のクレームを入れることにした。

長文になりそうな気がしたのでPCメールで送ろうと思い、担当の営業さんの名刺を探したら無かった。そういえばもらってなかった。同じディーラーの他の人の名刺なら持ってた。見たら店舗共通のメルアドしか無かった。メルアドよくみたら独自ドメインですら無かった。プロバイダOCNなのね。ちょっと呆れて店舗に送るのは辞めた。

PCで小一時間、言葉を選びながら入力して、Gmailで自分宛てにメール。スマホで開いて、何個かに分けて営業さんのSMSに貼り付けた。

問題点の指摘とひどく不快かつ迷惑あるという感想。振り込み金額確認したら着信拒否にさせてもらうからそれで、って内容。オーディオのパーツ壊しやがってってまでは広げずに、査定後のやりとりのことだけに留めといた。

すぐに返事が帰ってきた。が到底全部読んでいるとは思えない感じだった。

数日後、振り込みたいが銀行の支店が書いていないと連絡が来た。

控えの用紙を見てみると支店の記入欄はなかった。買取はじめてなのだろうか?というか妻の口座なのになぜ俺に連絡が来るのかも謎である。妻に連絡すると、新車購入時の口座と同じはずだと。

さらに数日たって、無事60万の振り込みがあった。6年と9ヶ月、約74000km走行の金額である。これが高いか安いかはわからないが、とにかくこれでやっと縁が切れた。多分、FIAT乗りたくなっても二度とあそこのディーラーに行くことはないだろう。

結論

基本的にディーラーで車選ぶのはナンセンスだってスタンスだったけど、信頼が置けないところには愛車預けたくないですよね。変な文章で不快にさせてしまったらすみません。前半の記事書いてて、トラブルの話からなんとなく書き始めたら、切れ目がわからなくなってしまいました。

長々と書いてしまいましたが、買い替えた理由をまとめると以下の2点です。

最後に500自体はいい車ですよ。特に新婚夫婦にはおすすめ!

パパはしばらく国産車で行きます。

ピカピカの新車のレビューはまた今度♪

この記事がよかったら
+3
:
:

5年乗ったFIAT500を語る

2021.2.6

5年乗った愛車を手放すことになったので、思い出のまとめと、買い替えに至った経緯を話します。

FIAT500とは?

イタリアのFIATというメーカーの2ドア4シーターの小型車です。500と書いてイタリア語で「チンクエチェント」って言います。実は3代目の歴史あるモデルで特に先代のNUOVAは大衆車として広く親しまれていました。そのリバイバルって感じで2007年に発売されたのがこのモデル。2016年に1回マイナーチェンジがあって若干デザインが変わっていますが、うちのは前期型の2014年式。TwinAirラウンジの赤。スペックは下記。

https://www.goo-net.com/catalog/FIAT/500/10087800/

「20代で真っ赤なイタリア車を日常的に乗ってる」

って自慢をしてた自慢の愛車。実は妻が結婚前に買ったもの。買って運転の練習しようと思ったけど一切できず、結婚後は僕の通勤車に。まだ付き合ってた頃に、ルパンの車じゃん!TwinAirいいよ!っておすすめした結果なので、僕としてはしめしめという感じ。ちなみに指定ナンバーの4桁は妻の誕生日+僕の誕生日になっている。順番は年功序列ではなく、オーナー(多くお金出した方)が先ってルールになっているので、しばらく逆転しないような気がする。

この車の思い出

結婚した年に夫婦二人で広島から九州までドライブ旅行しました。
広島→別府→由布院→阿蘇→高千穂→人吉鉄道→天草→熊本→唐津→太宰府→広島 約1300km4泊5日の旅

後から思うとまだ慣らしも終わってないし、僕もペーパードライバーだったのによく出来たなぁって思う。

中のいい友人とのドライブもいつもこの車。

家族で墓参りもこの車。(フェリーに乗らないといけないところ)

あいだで子供が生まれました。
得意げにバッチリ色合わせしたステッカーを制作。「赤ちゃんが生まれます!」は流石に貼り忘れました。ちなみに二人目のときにはステッカーの存在を忘れていた模様。

お仕事関係の知り合いに誘われて、オートテストに出たり。
インテリアプランナー協会に参加してみたら15人ぐらいの集まりの中、3人も500オーナーだという事がわかり、プチオフ会。

いい景色があると写真を撮りたくなる、絵になる車。
facebookのユーザーグループにもたまに投稿させて頂きました。

全く関係ないイベントで絵を書いてみたりもしました。

コーヒーでトートバックに描かれた500

この車に乗るメリット、デメリット

インテリア!
(超広角で撮ってるので広さ的なイメージは現実と異なる場合があります)

おしゃれなデザイン!

まず圧倒的におしゃれ。外もだけど見てこの内装!(カスタムしてるけど)
似たような選択肢の車で言うとMiniかビートルになると思うけど、デザインセンスは飛び抜けてる、と思う。今どき、このシンプルな内装はすごい!無さすぎってぐらい余計なものが一切ない。

自分が特に好きなところ。
ロックボタンと一体化されたドアノブ。

走って楽しい、それがイタリア車

機械的に見ても面白いです。

まずTwinAirという2気筒エンジン。ドコドコと独特のフィーリング。900ccもない小さなエンジンですが、それを2気筒で割っているのでシリンダはそんなに小さくないんです。高速で吹かせば嘘のような気持ちいい音を響かせます!(決して早くはない)なのでついつい回したくなる。

同心円上に配置されたシンプルなメーターもやる気を誘う・・・

さらにトランスミッションがデュアロジックという、マニュアルベースのオートマになっています。これはトルコンではなく機械的にクラッチが制御されているものらしいです。なので、マニュアル車のようなアクセルワークが必要とされますし、下手したら最悪エンストします。しかも早め早めにシフトアップしちゃってあまり面白くないので、たいていマニュアルモードにして、自分でシーケンシャルにギアチェンジをしています。(結構そういうオーナー多いらしい)

だから楽しい。

楽しいけど疲れる

楽しいの裏返し、疲れやすいです。この車エンジンを楽しむために、わざと静かにする努力を放棄しています。振動もしかり。長時間のドライブは体力ある時じゃないときついかも。日本車では今どき標準装備な便利機能は一切ありません。

またドライビングポジションが出ないのもつかれる原因です。シート自体はクッション性もホールド性も絶妙なバランスで好きなんですが、身長180cmの僕は最後まで決まらない感じでした。イタリア人ってジローラモさんみたいな人多いと思うけど、みんな猫背で運転してんのかな?飛ばすのに?

2ドア4シーター

4シーターですが基本的に2+2です。日常的に3人以上が乗ることは想定されていませんw 後部座席はかなり小型な人でないとまっすぐ座れませんし、たいがい前後で大きい人と小さい人の組み合わせを考えないといけません。

小さい子供二人ならスペース的にはぴったり納まりますが、乗りおろしやベルトの付け外し作業は毎度かなりの難作業。重い2ドアの間から身を捩らせて、子供を抑えながらベルトを確実に締める・・・。(またこの2ドア、ストップの角度の刻みが広いのよね。)さらに下の子が座れるまではチャイルドシートではなく更に場所を取るベビーシートだったので、その配置はまさにトレピウーノのコンセプトカーみたいになってました。

トランクも狭いです。ベビーシート+チャイルドシートでいっぱいいっぱいのトランク。(ISOFIXベースは含まれていません。)これは急に会社の人を同乗させないといけなくなった時。

ベビーカーならギリギリ一台。手荷物は間に押し込みます。

故障しやすい?

イタリア車だから壊れやすいのかと言うと、そんなには多くないです。でも来るときは突然きます。やはり電気系が弱いです。

イタリア人が設計してポーランドで製造されている500。日本人が設計して日本人が組み立てた日本車と比べてはいけません。そこに、日本車では絶対に販売されないであろう振動の多いエンジンをマウント。そりゃそうだろうなってぐらいの確率です。

ドナドナされる500

突然エンジンかからなくなるやつ~。5年間で2回ありました。1回目は原因不明、レッカー呼んでディーラー持ち込んだら、そっちではかかったって。
僕「思いっきり叩けばよかったんですかね?」

多分ですが、イタリア車のような外車と付き合うには、多少のことは自分でメンテできる環境が必要っぽいです。屋根付きの平面車庫がほしい。

カスタムしたところ

オーナー向け情報! 5年間通勤で使っていたので、気になるところをちょこちょこいじりました。

インテリア

まずはステアリング。テレスコがついてないので、シートを合わせるとステアリングが遠いという問題からやってみました。ナルディ系列「パーソナル」というブランドのシンプルなやつ。ボスと変換スペーサー、更にステアリング自体の形状から、70mm程前によりました。エアバックやスイッチ類がなくなって、見た目もかなりスッキリとした印象に。実際ハンドリングも軽くなります。ステアリングの色は特注です。購入したステアリングをロブソンレザーさんに送って、色指定で巻き直してもらいました。センターマークや、ステッチの形状、カラーも選べます。ホーンは友人が手に入れてくれたレトロなやつ。

シフトノブとルームミラーも交換。シフトノブはマニュアル用ですが問題ないです。ルームミラーは純正がでかくて野暮ったいので、小型のものにしています。

運転席の脇にこっそり仕込んでいるのはスロットコントローラー。アクセル感度がダイレクトになって気持ち吹け上がりが速くなります。一人で乗るときは基本レース(R)モード。他、小指しか乗らないフットレストを拡大したり、スマホ接続のためのBluetoothアダプターをグローブボックス上に仕込んでいます。

エクステリア

一番大きいのはホイールです。このラウンジにはアルミホイールがついていたのですが、これが重くてなんかもっさり。思い切って鉄チンに換えてみました。しかも15インチから14インチにインチダウン。アルミホイールって軽いイメージでしたが、これぐらいの大きさだと鉄製のほうが軽いみたいです。塗装もしようかと考えたんですが、この車ブレーキダストがすごいので黒のままで。なかなかやんちゃなイメージになりました。

併せて、タイヤも少し細くて硬めのタイプにしました。おかげでハンドリングはめちゃくちゃ軽くなりました。ちっこいのがキビキビ動くっていうイメージにピッタリです。ちなみ仮付感をなくすため、ボルトを黒メッキ仕様にし、純正ロゴ入のセンターキャップをつけたら、なかなかいい値段になっちゃいました。

鉄チンに交換しただけだとこうなる。最終的にマーキングをシンナーで落として、カウンターウエイトをタミヤマーカーペンでボディ同色に塗ったら完成!

ナンバープレート周り。フロントはナンバープレートとボディーの間の黒いベースプレートを撤去。取り付けボルトを低頭タイプに変更。リアのユーロナンバー用の取付穴についてる黒いキャップはプラバンとカッティングシートでボディと同色に。(このキャップ今はオプションで5000円するらしいです。)

他、テールライトを縁無しの社外品に変更しています。赤いボディとシームレスでいい感じ。ラジオアンテナは普段ラジオを聞かないのと、毎日機械式駐車場に入れるので、適当な蝶ネジでアクセントにしています。

この車を手放すに至った経緯

子供が二人出来て、二人目もちょっとだけ大きくなって、後席に2つチャイルドシートが並ぶようになりました。上でも述べたように2ドア4シーターは子育て世帯には厳しい。この春2021年で車検だけど、次の車検ぐらいが限界かなと言う話は妻としてました。そんな中500にトラブル発生!それをきっかけに・・・事の顛末を書いてたらなかなかなボリュームになったので、続きは別記事で!

この記事がよかったら
+1
:
:

スーパーコンピュータ「京」のCPU

2021.2.5

世界最高峰のスーパーコンピュータを有する日本の理科科学研究所。公式サイトから「Society 5.0に向けた高性能計算科学研究支援及び研究者育成支援に関する寄附金」を5万円以上送るともらえる記念品が、解体したスーパーコンピュータ「京」のCPU。去年申し込んでから半年以上立ちましたが、やっと手元に届いたのでご紹介。寄付金は2021年3月まで受け付けていますが、記念品は2020年内で定員に達したようです。

https://www.riken.jp/support/solicited/#society

桐箱を開けるとこんな感じ。自分の名前がKeiだから「K computer」の表記がなんだか嬉しい。宝物が一つ増えました。

ちなみに5万円も払ってジャンクのCPU買ったのかよって妻から怒られそうですが、寄付金控除で48000円戻ってきます。これがサラリーマンの僕が今年確定申告をしないといけない理由です。

この記事がよかったら
:
:

WordPressの標準ギャラリーをCSSでレスポンシブルな横スライダーに変更する

2021.2.5

WordPress標準のギャラリーは見た目パットしないですが、記事内から画像を追加できるのが非常に楽です。プラグインでギャラリー系を探しても、殆どの場合は管理画面で一度アルバムを作成してから記事にショートコードを埋め込むのでひと手間面倒。ということでプラグインを使わずにCSSだけでレスポンシブルなギャラリーを作ってみました。

実例

早速出来たものがこちら↑(画像は牧場です。意味はありません。)

ブラウザの幅によって表示の仕方が変わります。

PC等では4枚横1列で、スマホ等のモバイルでは1枚表示になって横スクロールになります。PCの方はぜひ、ブラウザの横幅を縮めてみてください。スマホの方も横にするとPC表示になるかも。

この動きCSSだけで上書きしています。

CSS

基本的には標準ギャラリーの書き出すクラスを調べて適宜!importantで上書きし、Flexboxでコントロールします。

@media screen and (max-width: 720px) {}でモバイル表示を指定。

個々の画像を .blocks-gallery-item{width:100vw!important;height:auto!important;}で画面幅いっぱいにし、大枠を.wp-block-gallery{overflow-x:auto;}でX方向のみスクロールバーが出るようにしています。

もともとはよくあるギャラリーのように進む、戻るの三角マークをポチポチ押すように考えていたのですが、今のブラウザってスマートスクロールが標準なんで、1回のフリップですい~っと進むこっちの方がタップが少なくて済むなとこのような形に落ち着きました。

なのでスマホでこのサイトを見る場合、ページのスクロールは縦方向に、ギャリーは横方向のフリップ操作となります。ちょっと気持ちよくないですか?

更に今回は思い切って、ページ全体のスクロールバーの表示をなくしています。PCの方はホイールボタン付きのマウスの使用、もしくはキーボードのカーソルキーを使用してください。

クリック時の動作

画像をクリックすると大きなスライド表示なりますが、こちらは素直にプラグインに頼っています。散々ためして結局落ち着いたのがJetpackの標準機能です。なかなか丁度いいんですよね。コメントをつけることも出来ますが、それはオプションでオフにしています。

まとめ

重いプラグインを導入しなくても、標準ギャラリー+CSSで個性的なギャラリーを作ることが出来ました。標準のパーツを活かすやり方は一番汎用性が高く、過去の記事にも反映しやすくておすすめです。

これで写真も見やすくなったので、しっかりカメラ撮っていこうと思います。

この記事がよかったら
:
:

レンズ交換式カメラで画角の比較

2021.2.4

建築を撮るための広角レンズを買い替えたので、焦点距離が変わるとどんな感じになるのか比較してみました。対象物は広島平和記念資料館。(丹下健三のインターナショナル・スタイルは広角の撮影テストにぴったり。)カメラはSONYのAPS-Cセンサーカメラ、α6400です。

撮影結果

焦点距離は35mm換算値です。(APS-Cなので1.5倍)
建築撮るには24mmじゃ狭いイメージですね。
APS-Cセンサーだと13.5mmが現状最広角のようですが、これでちょうど視界いっぱいの感覚です。

レンズ比較

実際に使用したレンズです。上の画像の番号が対応しています。それぞれのレンズの大まかな使用は下記。

SONY SEL1018 ①

SONY SEL16F28 ②③

LAOWA 9mm F2.8 ZERO-D ④

何を買い替えた?

ってことなんですが、2年ぐらい使ってたSONY SEL1018LAOWA 9mm F2.8 ZERO-Dに変えました。前者は便利なズームレンズでオートフォーカスも優秀なんですが、画質がそんなにいいわけでもなく、振り切れた超広角でもないのでちょっと飽きちゃったなとマニュアルの最広角にしました。中国製と侮るなかれ、13.5mmの超広角でゼロディストーションは気持ちいい!まさに建築向き。F2.8なので暗くても行けるんじゃないかと期待してます。SONY SEL16F28はついでのお遊びようですが、ジンバルでも行けるかもと目論んでいます。

レンズ交換式のカメラ、楽しいですよ!

この記事がよかったら
:
:

CSSだけで作るタブメニューとウィジェット

2021.2.4

スペース的に最初から表示はしたくないけど、必要に応じて見せたいときに便利なタブメニュー。こちらをCSSだけで実装し、更にウィジェットと組み合わせて自由度の高いメニューを作ってみる方法を解説します。

ちなみに探してみましたが、スマートに導入できる既存のプラグインは見つけられませんでした。面倒なのでjavascript系も入れたくないという方にもおすすめです。

CSSでタブメニュー

わかりやすいのはこちらのサイト。

https://web.monogusa-note.com/flexible-tabs-only-css

仕組みとしてはHTMLでinputタグのラジオボタンを使っています。ラジオボタンは選択肢の中から1個だけ選べるタイプのフォームツール。選択されると<input>タグの中にcheckedがつくので、それをCSSで拾って表示/非表示を切り替えるというもの。CSSは隣接セレクタを使用していることが中々秀逸。

一番外側のラップは<nav>タグでも<div>タグでもいいです。<input>タグは隠して<label>タグの隣接要素を表示するようにしています。CSSで最低限必要なのはこんな感じでしょうか。この場合はインプットとラベル、その中身が交互に来ていますが、<label>タグに{order:-1;}を指定することでラベルだけ先に表示します。後はマウスオーバー時の装飾だったり、必要なものを追加します。

こちらは別パターン。ラベルを先に並べて、その中身を後に並べています。こちらの場合はタブの中身に1つずつ固有のIDかクラスをふっておかないと指定しにくいですが、一応これでも対応可能。

ちなみにこの表示の切り替え、visibility:hidden;でも同じようなことが出来ますし、そちらの方がアニメーション(Transition)も付けることが出来ますが、多めの折りたたみでは余計な余白がページ下部にできてしまうようで、今回はdisplay:none;としています。

ウィジェット化する

タブメニューができたら中身をウィジェットにしたいなと欲が出てきました。

やってみたのは3パターン。

①テーマ内でウィジェットエリアの記述の前にインプットとラベルを並べる

これは最終的な出力が上のコードで言うと下のパターンになるやり方です。とりあえずならこれが一番手っ取り早いですが、ウィジェットを設置するたびに、ウィジェットのはき出すタグを見て、CSSのIDかクラスを変更しないといけないので柔軟性が低いです。

②functions.php内でウィジェットのタグの出し方を指定

functions.php内でウィジェットエリアを定義するregister_sidebar()ではウィジェットの前後にはき出すタグをしてすることが出来ます。ここで<input>と<label>をくっつけてもOKです。これだと配置したウィジェットを自動的に指定するので、管理が現実的になります。ただし、1タブに1ウィジェットしか配置出来ません。1タブに更に複数のウィジェットを配置したい場合は次のパターンになります。

③タブごとにウィジェットエリアを指定する

ウィジェットじゃなくてウィジェットエリアを設定します。これでもっと使いやすくなりました。只今サイトのトップではこのような形で実装しています。

まとめ

ということでCSSだけでウィジェットエリアをタブメニュー化することが出来ました。意外と何でも出来ちゃいますね。ぜひお試しを。

この記事がよかったら
:
:

WordPressテーマで記事リストの出力をコントロールする

2021.2.3

WordPressではトップページやアーカイブページ等、記事リストの一覧を表示しますが、その表示の仕方をもっと柔軟に出力できるよう、色々試してみました。

よくある2つのパターン

配布されているテーマでもよく見かける一般的なやり方は次の2種類です。

どちらもメインループ内に記述するWordPressのテンプレート関数です。上のthe_excerpt()は抜粋を設定していればそれを表示、なければ本文を指定された文字数分だけカットして表示します。ただこれは本文中の文字情報だけを取得するので、画像とか他のタグも一覧内で表示させておきたいと言うときは使えません。

そんなときは下のthe_content()を使用します。こちらは単純に本文を表示させる関数ですが、本文中にmoreタグ(続きを読む)があればそこで切ってくれます。これなら文字情報だけに限らず任意の場所で切り出すことが可能です。ただしmoreタグを設定してない記事では全ての内容を表示してしまうことになります。今から新しいホームページを始めるならいいかもしれませんが、過去にさかのぼって全ての記事にmoreタグを入れ直すのは正直面倒くさいです。

PHPで条件分岐

ということで、どちらでも対応できない場合は自分で条件分けをするしかありません。改めて今回の更新でやりたかった動作をまとめてみます。

①moreタグがある場合はmoreタグでカットして表示
②短い記事は全文表
③長い記事は適当なところでカットして表示
④リストではなく単一ページの場合は全文表示

まずはメインループの中で本文全体を取得します。通常ならget_the_content()を使用するところですが、今回は$post->post_contentで呼び出したものをget_extended()に入れています。get_extended()はmoreタグの前後で本文をカットしてくれる関数で、moreタグ前を[‘main’]に後を[‘extended’]に入れられます。moreタグがなければ[‘extended’]は空になるので、$more_contentがあればmoreタグがあるよっていう条件分岐ができます。

次に本文が短いかどうかの判断はタグを除いた本文の文字数を数えます。

strip_tags()でタグを外し、mb_strlen()でマルチバイト換算で文字数をカウントします。短ければ切らずに出力します。しかしここで問題になるのが、この指定した文字数を超えた場合にどこで切るのかと言うことです。文字だけじゃないので単純に文字数で切ってしまうとレイアウトが崩壊します。色々悩んでこんな感じにしました。

多少長くなっていますが、ざっくりいうと2回めのpタグ、“<p”の位置を検索してそこで分けるという処理を行っています。

これでHTML的な構文が途切れずにきれいに本文を分けることが可能になりました。最終的に単一ページかどうかの判定も加えて出来たのが以下。

続きを読む~後半部分をアコーディオンにして、その場で展開

最後に、続きがある場合のみページリンクを出力、してもいいのですが、スマホで続けて読みやすいように、アコーディオンのようにその場で続きを展開できるようにしました。inputタグ+labelをCSSだけで非表示から表示に切り替えられます。CSSも合わせたこの動作については別記事で解説します。

まとめ

条件さえはっきり定義できれば、投稿リストもPHPで自由に出力することが出来ます。ぜひお試しを。

この記事がよかったら
:
:

WordPressテーマの自作におけるCSSのコツ

2021.2.2

テーマの自作で半分はCSSの調整だったりします。WordPressにおけるCSSのコツや最近取り入れてみたトレンド等をご紹介します。

テーマに関する記述を明記

インストールしているテーマ一覧でオリジナルなのにちゃんと解説があるとなんかテンション上がります。これはstyle.cssの冒頭に上の記述をするだけ。画像はテーマフォルダに「screenshot」という名前の画像ファイルを上げておけば読み込んでくれます。拡張子はjpgでもphpでもいいみたいです。

横並びに詰めて記述

CSSの記述の仕方ですが、僕はこうやって詰めて横並びに記述することが多いです。邪道なのはわかってるんですが、こうすることでページ全体が少なくすむので全体をまとめるのが早いような気がします。

!importantが重要

CSSで同じセレクタの優先度は原則、後に書いてあるほうが優先です。しかし、プログラムでいろんなCSSが読み込まれているWordPressでは、強制的に上書きしたい場合、以下のように!importantを付けておきます。

こうすることで既存のタグなど、はじめからWordPressがスタイルを指定しているものに対してもオリジナルのデザインにすることができます。上の例では既存のギャラリーのマージンを0に変更しています。

モバイル対応の記述

スマホやタブレット等のモバイルに対応してスタイルを変更したい場合は、画面サイズの最大値によって切り替えます。下記ではmax-widthが720pxまでの画面では以下のスタイルでって記述です。

最近はスマホでの閲覧が半分以上になってきているのでモバイル対応は必須。逆にPCでの閲覧を少数派として、〇〇以上の画面サイズに対して以下のスタイルを適用としてもいいです。どっちのスタイルの記述が少ないかで判断します。またこの記述はCSSの最後の方に書いておくほうがトラブルが少ないです。

Flexboxが今どきで便利

上記のモバイル対応等、ウィンドウ幅によってレイアウトを柔軟に変更するレスポンシブルデザインがトレンドです。レスポンシブルデザインに対応しやすいスタイル、Flexboxを導入してみました。フロートデザインはもう古いみたいですね。Flexboxかなり便利です。使い方、解説は下記のサイトがわかりやすいです。

セレクタを使いこなせ

CSSのセレクタはidやclassだけじゃない。最初の子要素、何番目の子要素、兄弟等、色んなセレクタがあって柔軟な指定が可能です。下記のサイト勉強なります。

疑似要素がおもしろい

::before と::after 2種類の疑似要素ってのがあって、セレクタの前後に任意の文字列を追加できるっていうスタイルがあるんですが、さらにaタグ等に::afterを合わせるとtitleとかを引っ張り出すことができるっていう。以下参考。

まとめ

CSSは知れば知るほど自由度がまして、色んな事ができるようになります。1年ぐらい経つとまた新しいトレンドも出てくるので面白いです。ぜひご活用ください。

この記事がよかったら
:
:

このページのトップへ戻る