【WordPress】多言語対応プラグインPolylangでhome_url()を使うときに気を付けること | バシャログ。
みなさんこんにちは、yamashitaです。 6月からクーラーをフル稼働していて8月にはどうなっていることやら心配です。 さて今回はPolylangプラグインを設定している状態でhome_url()を使う際の注意点を一つ紹介したいと思います。 Polylangとは 設定することで多言語ページのURLを設定してくれるプラグインで、各投稿・ページにも対応するページが存在するか一覧で確認できるようになります。 今のところ自分は使用していませんが、有料版には自動翻訳もあるようです。 home_url()の動作 テンプレート上で使用する場合はほとんど通常時と同じ感覚で使って大丈夫です。 出力内容は以下の通りです。 デフォルト言語ページの場合、http://example.co.jp/の様にトップのURLがそのまま出力されます。 他の言語ページの場合、http://example.co.jp/enの様
wordpressのget_postsは検索結果ページでposts_searchフィルターが掛かる |
結論はタイトルの通りですが、wordpressの検索をカスタマイズしていて引っ掛かったことがあったので書き留めます。 ＜wordpressの検索機能について＞ wordpressの検索機能の検索対象は、投稿・固定ページのタイトル・本文です。 ブログとしての利用であればそれで十分ですが、企業サイトや商品サイト等では、よく下記の様なニーズがあり、物足りません。 ・複数カテゴリで検索したい ・カスタムフィールドに限って検索したい ・カスタム投稿を検索に含めたい ・チェックボックスで検索したい ・OR検索したい 等々。 プラグインでも検索対象を広げたり、ある程度のカスタマイズが可能ですが、 wordpressのフィルターフックを利用すると、SQLをいじれるため、広範にわたるカスタマイズが可能です。 ※フィルターフックについてはこちら ＜カスタム投稿・カスタムフィールドをOR検索したい＞ 今回、下記
ワンランク上のコーダーは万が一の配慮も欠かさない、リンク切れの画像要素をスタイルするテクニック
通常はお目にかかれませんが、リンク切れの画像があるのはいただけませんね。 画像がリンク切れだと、こんな風に表示されてしまいます。 もちろんリンク切れがないのがベストですが、絶対に存在しない訳ではありません。 よりよいユーザエクスペリエンスを提供するために、リンク切れの画像要素にスタイルを定義しておくことができます。 Styling Broken Images 以下、各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 img要素の2つのポイント リンク切れの画像要素のスタイル ブラウザのサポート状況 img要素の2つのポイント リンク切れの画像要素をどのようにスタイルすることができるか理解するために、最初に理解しておくべきimg要素の2つのポイントがあります。 img要素に通常の文字関連のスタイルを定義できます。 定義したスタイルは代替テキスト(
ipadのviewportって厄介？ - sukceson’s diary
viewportって、画面幅表示、最大拡大率2倍にしてるけど、 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, user-scalable=yes"> これだとipadでうまくいかなかった！ 縦表示から横表示に傾けると、コンテンツが画面をはみ出てしまった。 initial-scale=1.0をとるとうまくいくけど、 それだとスマホで、画面を横に向けた時の、文字サイズが大きすぎて、 すごく気になる！ ということで、ipadのときだけ、initial-scaleの指定を取ることにしたけど・・・・ var ua = navigator.userAgent; var tabletFlg = (ua.indexOf('Android') > 0 && ua.indexOf
[JS] スマホでclickイベントより早くユーザーのタップ動作に反応する - YoheiM .NET
こんにちは、@yoheiMuneです。 最近スマホでのWebアプリを開発することが多いのですが、タップへの反応速度を上げるこんな方法はどうかなぁと考えたので、ブログに書きたいと思います。 スマホでタップにより速く反応したい スマホ用Webアプリの開発で、ユーザーがタップした際にJSを起動したい（例えばダイアログを表示したいなど）という要件があるとします。 その場合に、タップ対象の要素のonclickにイベントをバインドして処理をすることが多いかと思います。 こんな感じ。 var btn = document.getElementById('someBtn'); btn.addEventListener('click', function() { // タップされた際の処理 }); でもこれだと確かに反応するのですが、ユーザーがタップしてからイベントが発火するまでに時間が空いてしまい、遅いの
![[JS] スマホでclickイベントより早くユーザーのタップ動作に反応する - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/cccc0e0910f5e6c670ca8c44cd50ffd6640ce4ae/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F216.jpg)
アニメーションを実装するなら知っておきたい「requestAnimationFrame」の使い方 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、フロントエンドエンジニアのおじいちゃんです。 今回はパフォーマンスを意識したアニメーションを実装できる「requestAnimationFrame」について書きたいと思います。 requestAnimationFrameとは requestAnimationFrameは、アニメーション実装時など、再描画が頻繁に行われる処理に使えるメソッドになります。 window.requestAnimationFrame() メソッドは、ブラウザに描画させたいアニメーションを指定し、次の再描画の前に、アニメーションを更新する指定した関数を呼び出すように要求します。このメソッドは再描画する前に呼び出されるコールバックメソッドを引数にひとつとります。 引用元：MDN setTimeoutやsetIntevalと比較されることが多いですが、主に以下のような違いがあります。 requestAnima
:not擬似クラスでCSS3のサポートをチェックする方法
CSS3の:notで擬似クラスのサポートをチェックする方法を紹介します。 １．はじめに 「:checked擬似クラスでチェックボックスに連動して要素を表示させる方法」で、CSSの:checked擬似クラスを使ってチェックボックスの操作に連動してテキストエリアの表示を制御する方法を紹介しました。 前述の記事の再掲になりますが、HTMLとCSSの設定は次のとおりです。 <style> .bar { display: none; } input:checked + label + div { display: block; } </style> <div> <input id="foo" type="checkbox" name="foo"> <label for="foo">foo</label> <div class="bar"> <label for="bar">bar:</label>
意外に知らないお金借りるならとお金借りる審査通らない理由の秘密を、１つだけ教えます。
わかった！お金借りるならでお金借りる審査通らない理由… わけもなく嫌な気持ちになってしまう人が存在します。 出来が寄ってきたらムカムカして、お金借りる審査通らない理由なので、マトモに対応すらできず、お金借りる審査通らない理由に冷たい対応をしてしまいます。お金借りるならに冷静になり、悔やむものの、以降だったら、嫌だということで頭がいっぱいになってしまいます。 少額融資の多様さからいえば、好きになれない人がいるのも当たり前なのでしょう。 お金借りるならを好きになるのは無理難題といっても過言ではなく、急変をなくしてしまえないので、困っています。 お金借りる審査通らない理由に考えるのであれば、客観的にはそんなに悪い人でもありませんから、お金借りる審査通らない理由に限り、私はおかしいと思います。たまたまテレビ中継などを目にすると、入出金可能への参加を目指す人があまりにも多くてちょっと呆れてしまいそう
CSSで半透明にできるOpacityプロパティとIEでの問題について
ちょっと上手くいって感動したので書きます。今回も番外編で、小ネタです。 ブログのデザインを変更していると、ある要素を透明にしたい時がある。透明にするには、CSSでは次のように設定する。 要素を透明化する CSS プロパティ CSS3 で入ってきたプロパティのようだが、opacity を設定すれば透明化できる。 opacity:0.7; 0 が透明で 1 が不透明、0～1 の値を指定する。 これで Firefox や Chrome では透明化できたのだが、IEでは出来ない。ネットで調べると、IE では Opacity は使えず、filter を使うそうだ。 filter: alpha(opacity=70); /* ie 6 7 */ -ms-filter: "alpha(opacity=70)"; /* ie 8 */ IEの透明度は0～100の％で指定する。 この他、Firefox や
WordPress のマルチサイトを無効化して元の状態にリセットする方法
今回は、マルチサイトにした WordPress を普通の WordPress に戻す方法を紹介します。 マルチサイトを無効化する 投稿データ マルチサイトのファイルアップロード先は特殊だがメインサイトのアップロード先は通常の WordPress サイトと同じで変更されていないため投稿データの操作を行う必要はありません。 設定ファイルを元に戻す マルチサイトを有効化するに辺り以下のような記述を行ったはずです。まずはこちらの記述を削除することで、マルチサイトを無効化することができるはずです。この時点でマルチサイトへアクセスすると、本サイトと同じコンテンツが表示されます。 define( 'WP_ALLOW_MULTISITE', true ); define( 'MULTISITE', true ); define( 'SUBDOMAIN_INSTALL', true ); $base = '
【WordPressでOGPの設定を自作しました】プラグインは挙動が不安定なのでやめました｜今村だけがよくわかるブログ
最近ちょこちょこと、いろいろなサイトからこのブログへリンクされているのに気づきました。大変ありがたいことです。で、ちょっとまずいな～感じていたことがあったんですが、私のこのブログのOGP設定はめちゃくちゃだなぁ～って思っていました。 プラグインで設定していたのですが、それをやめてコードを書くことにしました。 私がやった方法を少し紹介しますね。 今まで、OGPの設定はこうしていましたネットで「WordPress OGP」などと検索すると、 「WordPressのOGP設定はプラグインでカンタンにできる！」 というような記事がたくさん見つかるのですが、私は、 open graph pro プラグインwp-ogp プラグインの有名な2つのプラグインを試しました。もちろん、それぞれのプラグインを有効にして適切な設定はしていました。設定する箇所が少ないので（facebookのIDを入れて・・・とか）
@keyframesとAndroid
@keyframesとAndroid CSS3の@keyframesでアニメーションを作成しているんですがAndroidでかなりバグがあるようです。 transformに複数の値を指定すると動かない @-webkit-keyframes hogeName{ 0% {-webkit-transform:scale(1,2)} 50% {-webkit-transform:scale(2,2) translateY(10px)} 100% {-webkit-transform:scale(1,1) translateY(0)} } サンプル というようにtransformに複数の値が不規則に入る場合Androidでは動作しなくなることがあります。（このサンプルだとscaleの指定が無視される） @-webkit-keyframes hogeName{ 0% {-webkit-transform
pk10计划人工在线计划-快3网投平台
地址：浙江嘉兴嘉善县卫巷008号 电话：072-55269409 传真：072-55269409 邮箱：308676405@008.com pk10计划人工在线计划作为2017年3月29日三星发布的旗舰手机���，把过已经过去了快三年时间�� ��。 27����、年年仁济南院开诊时间� �：周一至周六全天停诊时间���：周日部分诊疗项目暂停服务情况���：口腔科实行全预约����，暂取消拔牙���、补牙����、洗牙业务���。pk10计划人工在线计划10�����、案件第六人民医院医院自2月3日起开诊�����。 2���、呈高预约就诊����：所有门诊（包括普通门诊）均推行实名制预约���。把过（五）其他��� ：门诊入职体检暂停��� �。年年1）网站预约���：①上海医联预约平台https�����：pk10计划人工在线计划//yuyue.shdc.org.cn/� ���。 详
PIEバグレポート
この記事は1年以上前の記事のため、内容が古い可能性があります。 複数のタグの中にあるブロック要素のタグを角丸にする場合、角丸が効かない場合があります。 例） <div class="box_outer"> <div class="box"> PIEではIEでも<br /> 角丸・ドロップシャドウ・グラデーションを<br /> 実行できます。 </div> </div> この要素の各スタイルは以下の通り .box_outer{ padding:20px; background-color:#FFF; } .box { padding:20px; background-color:#EEE; border:solid 1px #000; /*角丸*/ -moz-border-radius: 15px; /*FireFox*/ -webkit-border-radius: 15px; /* Sa
CSS3 PIEでつまづいた点 « minimo
CSS3 PIE(http://css3pie.com/)を利用するとIEでCSS3の各種プロパティを表現できるのだけど、使っていてつまづいた点があったのでメモ。 グラデーションがうまく表示されない。 グラデーションはCSS3 PIE独自のプロパティ（-pie-background: linear-gradient(#000000, #FFFFFF);）で記述が必要。 bodyに背景を指定したら、手前の要素に指定してあったプロパティが適用されなくなった。 「behavior」を記述したプロパティに「position:relative」を記述すると表示された。 .navi { position: relative; background:-moz-linear-gradient(19% 75% 90deg, #FFFFFF, #f7b30e); background:-webkit-gra
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
.JS web coding memolist
[WordPress] qTranslateでサイト内検索をすると、言語設定が無効になる対処法 2 – モノグサにお灸![[WordPress] qTranslateでサイト内検索をすると、言語設定が無効になる対処法 2 – モノグサにお灸](https://cdn-ak-scissors.b.st-hatena.com/image/square/234519d754f2c45f2978896a78ecab27c77747ff/height=288;version=1;width=512/https%3A%2F%2Fmonoxa.net%2Fwp-content%2Fuploads%2Fwordpress_logo.png){kind=logo}
http://no-delay.com/?p=1505
06.GRASSHOPPER
http://indigonote.com/2011/04/26/css3-pie/