harada さんのアバター 128views

slickで最初の画像以外を遅延読み込みにする

slickではlazyLoadオプションが標準で用意されています。 slickのスライドですべての画像を一度に読み込むとページ表示完了までに時間がかかってしまいます。 そんなときこのlazyLoadオプションを利用することで、表示されていな 2016年12月6日
harada さんのアバター 16views

埋め込んだGoogle Mapのコントロールアイコンが崩れているとき

自サイトのCSS原因のようです。 参考したサイトでは以下のように指定すると直るとかいてありました。 mapField は表示するGoogle MapのIDに変更して下さい。 #mapField img { max-width: none; 2016年12月2日
harada さんのアバター 28views

jQueryで指定したclassが存在したら実行する分岐の書き方

以下のように記述することでclass="home"があるときだけ実行できます。 if($('.home').length) { //classが存在したら実行する } 参考:jQueryで特定の要素が存在するかどうかを判別する処理 clas 2016年12月1日
harada さんのアバター 86views

jQueryで動的に作成されたDOM要素にアクションを追加する

lightboxのウインドウで別のjQueryプラグインのアクションを実行したかったのですが、lightboxのウインドウは動的に作成されているため、普通の記述では効きませんでした。 以下の記述で無事実行できましたのでメモしておきます。 ( 2016年11月25日
harada さんのアバター 27views

jQueryでweb上の画像にPhotoshopのトーンカーブ設定を適用する方法

そんな魔法みたいなことが、jQuery filter.meというjQueryプラグインで実現できます。 サンプルはこちら 簡単さでは前回の読み込むだけで画像にInstagramのような加工ができるCSSライブラリ「CSSgram」にはかなわ 2016年11月25日
harada さんのアバター 77views

読み込むだけで画像にInstagramのような加工ができるCSSライブラリ「CSSgram」

利用方法 CSSライブラリをダウンロードします。 CSSgram フィルターをかけたい画像に該当のクラスを指定します。 <img src="" class="aden" /> 外側のクラスでも大丈夫です。 <figure 2016年11月24日
harada さんのアバター 43views

PHP&jQuery:URLにパラメータを付けてパラメータの内容をフォームで取得し値に挿入する

特定のIDを持つページでフォームへのリンクをクリックした場合にそのページのIDをURLで送信し、どのページからリンクを押したかをフォーム側で取得する方法です。 ※以下のjQuery記述はWordPressの管理画面用になっていますので適宜変 2016年11月17日
harada さんのアバター 56views

jQueryでformのselect要素を選択できない状態にして、かつ値を送信する

IDにselect_inputが設定されたセレクトボックスを選択できないようにdisabledを設定して、なおかつselectedで選択されている値がフォームで送信されるようにするには以下のように設定します。 disabledを設定するだけ 2016年11月15日
harada さんのアバター 31views

プラグインを使わないでWordPressで自動で挿入されるPタグを無効にする

HTMLで入力したい人にとっては邪魔以外の何物でもない自動で挿入されるPタグを無効にするには、以下をfunctions.phpに追加します。 remove_filter ( 'the_content', 'wpautop' ); remov 2016年11月14日
harada さんのアバター 14views

WordPressの投稿者のドロップダウンリストの表示名を変更する

WordPressの投稿者名リストはデフォルトだと「ブログ上の表示(ユーザーネーム)」という表示形式になっています。 これを「姓 名」にするためには、functions.phpに以下を追加します。 add_filter('wp_dropdo 2016年11月10日
harada さんのアバター 19views

WordPressでユーザーが氏名を更新した際にブログ上の表示名を変更する

functions.phpに以下を追加します。 add_filter('pre_user_display_name','default_display_name'); function default_display_name($name) 2016年11月10日
harada さんのアバター 51views

iCheck利用時のチェックの判定による動作の切り替え

たとえばWordPressの記事公開のボタンが押された際に、iCheck利用のチェックボックスにチェックが入っているかどうかを調べて、入っていない場合はjQuery Validateを動かすためにrequiredクラスを付与したい場合は以下 2016年11月9日
harada さんのアバター 18views

WordPress投稿一覧で下書き状態のものの背景色を変更する

もともとtrにはステータスによってオリジナルのクラスがつけられているので、それに対してCSSを設定すればいい話でした。 こちらは背景色を変更+下書きという帯を付ける例です。 .status-draft { background-color: 2016年11月7日
harada さんのアバター 7views

特定のカスタムポスト✕ユーザーの権限によって投稿がない場合も一覧に他の人の投稿を表示しないようにする

以下をfunctions.phpに追加してください。 add_filter('pre_get_posts', 'custom_pre_get_posts'); function custom_pre_get_posts($wp_query) 2016年11月4日
harada さんのアバター 34views

WordPressのプロフィール画面の名・姓の表示順序を逆にする

WordPressのプロフィールページでは名前の入力欄が「名→姓」の順で表示されています。 これが日本だと入れにくいと思いますので以下のようにfunctions.phpに追加することで、「姓→名」の順番で表示することができます。 add_a 2016年11月2日
harada さんのアバター 27views

WordPressの「メニュー」を出力させるときに要素のみにする

WordPress内のカスタムメニュー機能を利用させるためにはまず、functions.phpに以下を追加します。 function register_my_menu() { register_nav_menu('header-menu', 2016年11月1日
harada さんのアバター 47views

WordPressでMasonry+Infinite scrollを利用する2(手動&改善)

以前もかいたことがあるのですが、以前の方法では読み込み中のローディング表示にずれが生じていましたので変更しました。 また、自動ではなく手動で読み込むようにしてみました。 functions.php リンクボタンに特定のクラスを追加 add_ 2016年10月31日
harada さんのアバター 52views

next_posts_linkとprevious_posts_linkにclassを付ける

「次のページへ」と「前のページへ」を表示する’next_posts_link’と’previous_posts_link’タグ。 そのまま利用するとただのテキストリンクになります。 以下をfu 2016年10月27日
harada さんのアバター 21views

ログイン中のユーザーと同じタクソノミーを持つユーザー一覧を取得する

ログイン中のユーザーと同じタクソノミーを持つユーザー一覧を取得するための覚書です。 あらかじめユーザーとカスタムタクソノミーを紐付けるのには「LH User Taxonomies」を利用しています。 ex.areaというカスタムタクソノミー 2016年10月26日
harada さんのアバター 70views

Theme My Loginの日本語翻訳ファイルを更新する

Theme My Loginの日本語翻訳ファイルをすでに wp-content > languages > plugins に配置していたのに、一部翻訳漏れがあったのでなぜだろうと思ったところ、元の翻訳ファイル(.pot)が新しくなっていた 2016年10月24日
harada さんのアバター 104views

Chart.jsでツールチップを削除する

オプションで以下のように「tooltips」の「mode」を「false」にすることで、グラフに表示されるツールチップを削除できます。 var chart1 = new Chart(canvas, { type: "line", data: 2016年10月21日
harada さんのアバター 73views

「WebDriverError: Connection refused」というエラーが出てChromeでの自動テストができなくなったとき

Chromeのアップデートで何かが壊れてしまったようです。 最新のChromedriverを利用することでエラーが解消されて動くようになりました。 ダウンロード ChromeDriver – WebDriver for Chro 2016年10月20日
harada さんのアバター 65views

GitHub Desktop で修正中の内容を取り消す「Discard Changes…」

GitHub Desktopで何かを作業後でプッシュする前に、やっぱりこの修正は取りやめたい…!となったときには以下の方法で作業を取り消すことができます。 1ファイルずつ行いたい場合 「◯ Change」と表示されている部分のファイル名の部 2016年10月18日
harada さんのアバター 12views

ImageOptimを利用して画像を圧縮する(2)

これまでJPEG画像はJPEGminiを利用して圧縮していたのですが、「 ImageOptimを利用して画像を圧縮する」でインストールしたImageOptimでより簡単に圧縮することができるようになりました。 JPEG画像を圧縮する手順 I 2016年10月14日
harada さんのアバター 16views

ImageOptimを利用して画像を圧縮する

これが一番圧縮率が高いようでした。 ImageOptimをダウンロードしてインストールします。 起動します ツールバーの「ツール」から「PNGOUT」にもチェックを入れます。 圧縮したい画像をどんどんドラッグ・アンド・ドロップします。 チェ 2016年10月13日
harada さんのアバター 63views

macにOptiPNGをインストールしてpng画像を簡単に軽量化する(2)

以前「macにOptiPNGをインストールしてpng画像を簡単に軽量化する」という投稿をしました。 GoogleのPageSpeed Insightsの「画像を最適化する」の項目でも「PNG では OptiPNG または PNGOUT をお 2016年10月6日
harada さんのアバター 29views

Contact Form 7を利用しているページでだけJS/CSSファイルを読み込む

functions.phpに以下を追加してすべてのページでContact Form 7のJavaScriptとCSSファイルを読み込まないようにします。 add_filter( 'wpcf7_load_js', '__return_fals 2016年10月5日
harada さんのアバター 58views

WordPressのJavaScriptでtype属性を消してasyncを追加する

GoogleのPageSpeed Insightsを利用すると、「レンダリングを妨げる JavaScript を削除する」というメッセージが表示されます。 https://developers.google.com/speed/docs/i 2016年9月30日
harada さんのアバター 85views

CSS:背景の画像をぼかして表示する

今回はぼかし+半透明の色を重ねるということをやりたかったのですが、それはできませんでした。。 ひとまず背景の画像をぼかす方法のみメモしておきます。 HTML例 <div class="bg1"> <p>上に載せたいテ 2016年9月29日
harada さんのアバター 14views

WordPress:CSSの指定で新規追加画面と編集画面を分ける

WordPressの新規追加画面と編集画面ではbodyタグにさまざまなclassがついています。 bodyタグにつくclassは利用しているWordPressのバージョンや、入れているプラグイン、設定しているカスタムポストなどによっても異な 2016年9月20日