WordPress

【WP】管理画面に独自のカスタムフィールドを設けるオプションページの設置について

オプションページ オプションページの実装方法を最近知って、すごく便利なのでこれからいろんなサイトで使っていこうと思うのですが、 以外とオプションページの機能って使われてないですよね。 おそらく、「いいプラグインがない」や「実装がや...
CSS

サイトの表示スピードを上げるのにやったこと

ファイルの圧縮・結合 CSS、JavaScriptファイルの圧縮は単純なコーポレートサイトなら工数をってまでやる必要はないかなと思います。タスクランナーで自動で圧縮の設定しているならそれはいいことだと思います。 結合は必ずやったほう...
NO IMAGE JavaScript

滑らかなスクロールを実現する3つの方法

マウスホイールでスクロールする際にデフォルトのスクロールでなく、滑らかなスクロールにする方法を紹介します。 最初の方法は実装は簡単なんですが、少しがたつきます。2つめに紹介するのはすごく実装は少しややこしいのですが、すごく滑らかなスクロー...
NO IMAGE JavaScript

Three.jsの使い方からアニメーションの実行までの手順まとめ

JavaScript

マウスの位置により目をくるくる回すプラグイン作った

最近作ったsvgのピカチュウを動かしたいなーってことでスクリプト書いてみました。 久しぶりに三角関数に触れたのでほとんど忘れてましたが、なんとか形になりました。 説明 現在のマウス座標より目の位置を移動させます。 改善点 ...
NO IMAGE JavaScript

snap.svgを使い方と簡単なデモ

pikachuCreated with Sketch.
NO IMAGE WordPress

【WordPress】投稿タイプ(post_type)を完璧に取得するコード

投稿タイプを取得する 以下の2点を補った形。 カスタム投稿で記事がない場合、get_postが機能しない。 get_query_var()では投稿一覧を固定ページに登録している場合は機能しない。 1行目:...
NO IMAGE CSS

【CSS3】transitionを使ったレスポンシブ対応のアコーディオンメニュー、height対応

transitionを使ったメニューを作るときのポイント まず、transitionを使ったアニメーションを実装する際に押さえておきたいポイントを紹介します。 display: noneで要素を非表示にしておくとアニメーションが適用...
NO IMAGE JavaScript

GoogleMapAPIでエラーMissingKeyMapErrorの情報

今日(正確には6月22日)からGoogleMapでGoogle Maps API error:MissingKeyMapError というエラーがでるようになりました。 対策の情報があったので共有します。
NO IMAGE その他

VCCW詰まった箇所メモ

"wordmove pull" was called with arguments site.ymlのdb_prefix: wp_を本番のDBと合わせる。 ssh-add -lで確認 ssh: Could not...
NO IMAGE JavaScript

nodebrewでnode.jsをインストールするまで in Mac

だいたい上記のサイトのやり方でいけました。 一点、node.jsをインストールしようとしたときにでた、 Warning: Failed to create the fileというエラーが出た時の対処方法 ついでにg...
NO IMAGE その他

【viewport】スマホ専用サイトの場合は固定幅かデバイス幅どちらがいいのか。

スマホ専用サイトのときのviewportの指定で悩んだのでまとめます。 固定幅のメリット・デメリット メリット どのデバイスでも同じ見え方になる。 全体を縮小して表示するので、1行あたりの文字数が変わることはない。(端末...
NO IMAGE その他

定番スライダー&カルーセルのプラグインを比較とちょっとしたカスタマイズ

スライダーとカルーセルの違い スライダーが1つ1つ画像(要素)を遷移するのに対し、まとまった画像で遷移するものをカルーセルとします。 Slick.js BxSliderとFlexSliderに比べ知名度は低いですが、豊富なオプシ...
NO IMAGE Chrome

スクリプトの試し書きに便利なjsfidle

ちょこっと試し書き、公開したいときに便利なjsfidle。 radioボタンで開閉 radioボタンで切り替え input要素は何となくchangeイベントを適用するもんだと思い込んでいたけど、tab切り替えと同様の仕...
NO IMAGE JavaScript

【jQuery】プラグインの様々な作り方(定義パターン)

「プラグインの作り方」と調べて出てくるのが大抵 $.fn.プラグイン名 = function(){全ての処理} この形でした。 ですが、配布されているプラグインのソースコードを確認すると上の形と違うことが多いです。 なので今回...
NO IMAGE JavaScript

【jQuery】ウィンドウサイズによってプラグインを切り替える

ウィンドウサイズによって実行するプラグインを切り替えるプラグインを作ってみました。 すごく単純なプラグインですがレスポンシブ対応のサイトでは以外と使う場面があるかもしれません。 またプラグインを作成するのは初めてなので、アドバイスを頂け...
NO IMAGE JavaScript

【Animsition】ページを表示する時にアニメーションを加えるプラグインを試してみた

ページを遷移する時にアニメーションを加えることができるjQueryのプラグイン"Animsition"です。 普通に使うだけなら以下のリンクを参照していただければ迷うことはないと思います。 今回はLoadingアニメーションの変更とロー...
CSS

WP Social Bookmarking Lightのボタンデザインを変更可能にしました。

WordPressのソーシャルボタンを設置するプラグインとして有名なWP Social Bookmarking Lightを改変してボタンのデザインをカスタマイズできるようにしました。
NO IMAGE その他

【GitHub】フォーク、作成したリポジトリを消す方法

検索したら消し方を書いた記事は出てくるのですが、UIが違っていたので個人用のメモ。 GitHubのリポジトリを消す方法
NO IMAGE Mac

SourceTreeからGitHubへログインする方法

SourceTreeからGitHubへログインする方法。 Bad credentialsと表示された場合は sshキーを設定する必要があります。