投稿のsingle記事の属するカテゴリー表示

single_cat_titleはカテゴリーページで使うもの ワードプレスはこのあたりのタグの使い分けが色々あって、うっかりすると「何故表示しないんだ?」みたいなことになるので(私はよく遭遇する)、覚書です。 投稿の個別記事(single.php)で記事の属しているカテゴリーを表示したいですよね。single_cat_title を使いたくなるのですが、この場合これは使えません。single_ca […]

jsで隠すべき要素が一瞬表示されてしまう場合

jQueryのプラグインなどで非表示にして、アニメーションで表示させるような処理をしているのに、サイトを開いた時一瞬要素が全部見えてしまうことがあります。クライアントはこういうのを結構指摘してきますし、私自身もなんかな、と思うので良い対処法を探したところ、様々な場面で使いやすい方法をアップしてくれている記事を見つけました。https://myscreate.com/textillate-fix/ […]

ワードプレスで500エラー、汗!の対処

ワードプレスの管理画面・サイトの双方で500エラー出された場合の対処法のひとつです。500エラーは、いくつもの理由が想定されますので、同じ方法で解決するかどうかは分かりません。今までも500エラーに出会ったことはありましたが、プラグインとの相性などで、外せば解決していまいしたが、今までの解決法と違ったためぱっとは浮かばなかったエラー原因でした。それは「ファイルのパーミッション」の問題です。 今回の […]

overflow:hiddenでsticky要素が動かない場合

使い所によって楽しい効果が簡単に出せるstickyですが、親要素にoverflow-x:hiddenを設定しているとうまく動かないことがあります。個別に親要素を指定するのは大変なので、jQueryのparentsでoverflow-x:visibleを使うと動くのですが、スマホの画面の左右が動いてしまう。というわけで、PCやタブレットのときだけ、親要素をvisibleにするときのメモです。

ワードプレスのプラグインを自分で翻訳する

フリーで使える便利なプラグインやテーマが豊富なことが、ワードプレスがWEB制作で使いやすい理由ですが、ほぼ英語圏の方の制作物のため、英語のままのものが多いのが現状です。自分で使うだけなら英語でもいいのですが、クライアントが触る可能性がある場合は、英語はちょっと・・・と敬遠されます。優れた機能を英語嫌悪だけで諦めるのは勿体ないので、自分で翻訳するか!という選択肢もあります。その時の作業の流れです。 […]

タブレットをPC表示の縮小で対応する

レスポンシブの解決策として、何がベストか日頃悩むところなのですが、その際に扱いが難しいのがタブレット。複雑なデザインの場合は、単純にPCの表示をそのまま縮小するのが一番楽ではあります。 まず前提として、レスポンシブでない場合、タブレット端末はPCの表示をそのまま適切なサイズに縮小して表示します。レスポンシブのあtめのviewportの設定はだいたい下記のタイプです。 スマホの場合、上記の devi […]

アンカーリンク(#)が出てくると途端に出てくる問題

昨今流行りの「ペライチ」(別に昨日今日の流行りではないのですが、クライアントでさえ、この言葉を注文時に使う今日この頃です)では、アンカーリンクが必要になる場面がほとんどですが、アンカーに対して、ぬるっとスクロールさせるJavascriptをかませると、必ずといっていいほど問題が2〜3出てきます。毎度悩まされて、似たような解決策をなんとなく使っているので、定義づけしておこう! 原因は、jQueryの […]

固定ヘッダーのある場合のアンカー位置ズレ問題

ヘッダーを上部に固定して表示しているときに、アンカーリンクを使うと、固定ヘッダーの高さ分、記事の頭が隠れてしまうため、アンカー位置がズレているように見えます。この問題、単純なようで結構厄介なのです。 有名な方法のひとつは、CSSでターゲットになるボックスにネガティブマージンを設定し、それと同じ数値のパディングを設定する。でもこの方法、ターゲット要素が重なった場合に、リンククリックが出来ない場面があ […]

contact form 7・WP MW Formのaction urlを動的に変更する

かなりニッチな市場、という感じの案件ですが、入力画面からクライアントが自分でフォームを作成し、フォームをsalesforceなどにつなぐ為、form actionをフォームごとに書き換える必要があり、さんざん悩んだ挙げ句、以外に簡単な方法で実現可能だったことに気がつきましたので、メモしておきます。 1.Contact Form 7を非Ajax送信にする 下記のURLを参照しました。https:// […]

wp_enqueue_styleにメディアクエリ指定をする

レスポンシブの効率的なスタイルシートには、いつまで立っても頭を悩まされている私ですが、functions.phpでwp_enqueue_style()関数を使ってCSSを読み込む際に、メディアクエリ指定したいケースがあり、調べてみました。簡単です。 エンキュースタイルの書式は<?php wp_enqueue_style( $handle, $src, $deps, $ver, $media […]