【WordPressプラグイン】Hello_Dollyを理想の上司に変えてみた話

WordPressを使っている皆様、Hello Dollyってプラグイン使ってますか?

プラグインを有効にするとHello Dollyって曲の歌詞がランダムに管理画面内の通知欄に表示されるってものなのですが、最近、自分好みの歌詞に書き換え出来る事に気づいてしまいました。

色々な歌詞にできるのはいいけれど、他になんかいいの無いかなーと思って、特に思いつかなかったので「理想の上司」がいいそうな言葉にしてみようと思い変更してみました。

続きを読む 【WordPressプラグイン】Hello_Dollyを理想の上司に変えてみた話

【IEバグ】游ゴシック・游明朝による謎の余白対策を考えてみた。

游明朝・游ゴシックのIEバグ

InternetExplore(IE)で游フォントを使う際、謎の余白が生まれてしまいます。
どうにかその修正作業が少しでも楽になるように、いろいろ検証してまとめてみました。

(Qiitaに書いてもよかったかもしれない)

続きを読む 【IEバグ】游ゴシック・游明朝による謎の余白対策を考えてみた。

photoshopの解像度が小さくなっていた時のメモ

Photoshopデータをデザイナーから頂いた際に、解像度を普通72でつくっていただくが、今回貰ったデータが23ぐらいになっていた。

(画像切り出した時にめっちゃサイズ大きくて、そこで気づきました)

予め、現状の縦横のサイズをメモしておき、

Photoshopの画像解像度の設定画面で、解像度72に変更してOK。

処理が終わってから再度、画像解像度の設定画面で縦横のサイズが大きくなっているので前のサイズを入れてあげて完了。

jQueryのモーダルウインドウを閉じた後動作しなくなった件

メモ書き。

下記サイトのjQueryモーダルウインドウを試したところ

モーダルオープンし、クローズ動作をした後、

Uncaught Error: Syntax error, unrecognized expression: <div class=”modal-wrap”></div>

というエラーが出て、サイト全部がクリックできない事がありました。

[ プログラミング ] jQueryでスクロールバーの出るモーダルウィンドウを作る方法

 

modal-wrapクラスの要素が原因のようで、JS確認してみると

$(modal).unwrap(“<div class=’modal-wrap’></div>”);

という記述がありましたので、これを

$(modal).unwrap();

にしたところ、無事動作しました。

もしかしたらjQueryバージョンで挙動が違うのかもしれませんね。(未確認)

【Photoshop】ペンタブでブラシが手のひらツールになる不具合

最近Photoshopでペンタブを使用していたらWindows10のアップデートのせいか、ブラシツールで描いているのに手のひらツールになってしまい、まともに使えなくなっていました。

続きを読む 【Photoshop】ペンタブでブラシが手のひらツールになる不具合

今年も撮りフェス in 室蘭 いってきます!

先ほど撮りフェス in 室蘭 2018が発表されました!

tori-fes.com

去年参加してみたのですが、結構楽しい。

実は、去年からWebサイトの構築に貢献させていただいております。

 

街の人とも仲良くなれるし、参加者同士の交流も結構あって面白い。

坂にある家が映えるんですよねー

工場地帯とか

海とか

船とか

白鳥大橋とか

雑貨屋で買ったたたら製鉄とか。

 

24時間で撮影も観光もいっぱいできてすごい楽しいです!

水族館も無料で入れたり

道の駅は景色すごいよかったり

クルージングで普段見れない景色も見れたり

夜の撮影も楽しい。

岩肌が見える海辺があったり

普段は入れない場所へ行けたり

普段は見れない光景が見れたり

街並みを楽しめたり

 

とても充実した2日間です!

今年も室蘭で会いましょう!

 

撮りフェス in 室蘭 2018

flexboxの使い方メモ

ulリスト、olリストの行列並び替え

リスト表示の際に、2列表示且つ縦に読ませる感じのパターン結構ありますよね。

  • 1
  • 5
  • 2
  • 6
  • 3
  • 7
  • 4
  • 8

こんな感じのを縦並びにすると

  • 1
  • 5
  • 2
  • 6
  • 3
  • 7
  • 4
  • 8

こうなる。
PCからスマホ表示の場合1列にするってなると、順番めちゃくちゃになる。
これをflex使える環境ならこれで並び替えしちゃおうぜって話です。

ul{
display:flex;
/*flexにしてから*/
}
ul li:nth-child(2n+1){
order:-1;
/*奇数番目を先頭に*/
}

奇数番目に来たものを順番に先頭にしていく仕組み。

  • 1
  • 5
  • 2
  • 6
  • 3
  • 7
  • 4
  • 8

するとこんな感じに行列が入れ替わります。

  • 1
  • 5
  • 2
  • 6
  • 3
  • 7
  • 4
  • 8

1列表示でスッキリ。

まとめ

逆のことできるのか試してみたが、キレイにいかない。
多分、html書き直したほうがいいレベル。
今回のパターンも本来htmlを別途スマホ用に準備すればいいだけの話なのだが、そのスマホ用のコード量があまりにも多かった場合はorderで並び替えしてしまった方がはるかに効率的ですよねってお話。