May 27, 2018
2679年7月28日

WordPress

CSSだけでモーダルメニューポップアップウィンドウ

これまで remodal.js を使ってハンバーガーメニューのモーダルメニューウィンドウが開いていたのを、CSSだけで動くようにした。header.php 内の3本線のハンバーガーメニューを表示したいところに次のように記述する。<div class="modal-css nav_btn"> <input id="modal-checkbox" type="checkbox"> <label id="drawer-icon" for="modal-checkbox"><span></span></label> <label id="modal-close" ...

... >> つづき
May 27, 2018
2679年7月27日

WordPress

CSSをPreload先読みしてレンダリングブロックしない方法

CSSを遅延読み込みするためには、preload を使えばよいのだが、Firefox 、IEブラウザーでは動作しない。それで、loadCSS cssrelpreload.js を併用する。全ブラウザ対応！preload で CSS を非同期で読み込み高速化ブラウザの対応を気にせず rel="preload" で CSS を非同期で読み込めるのが、 javascript ライブラリの loadCSS です。使い方は head タグにスクリプトを記述するだけと簡単です。 rel="preload" に対応しない IE を気にすることなく、レンダリングをブロックするスタイルシートを排除できサイトを高速化できます。First...

... >> つづき
May 27, 2018
2679年7月27日

WordPress

Webp 変換するとサイズが大きくなるのでQuorityを落とす

Jpeg 画像をWebp形式に変換するとサイズが30％も減少するなどと説明されていることがよくある。 Webp 変換後のサイズの方が大きくなったというのは見つからなかった。そこで、Webpに変換してくれるWordpressのプラグインを導入して、変換前と変換後のサイズを比べてみた。 Webp 変換サイズテスト WebpExpress WebP Converter for Media EWWW Image Optimizer Celtispack v4.1.0 以上の4つのプラグインは、上から順にサイズが小さくなった。しかしながら、どのプラグインも元画像 Fullの2560x1920 サイズではWebp 変換後のほうがサイズが大きくなっている。元画像をアップロードした時に...

... >> つづき
May 27, 2018
2679年7月26日

WordPress

wp コマンドラインでアイキャッチ画像のみサムネイル再生成する方法

画像のサムネイルを再作成する時には、Regenerate Thumbnails 等のプラグインを使用しがちであるが、サーバーにSSHでログインできるならば、コマンドラインで同じことができる。その方が、速いし、中断されることもなくなる。例えば、全記事のアイキャッチ画像のみに対してサムネイルを再生成したい場合は、 wp media regenerate $(wp eval 'foreach( get_posts( array( "post_status" => "publish", "posts_per_page" => -1 ) ) as $id ) { echo get_post_thumbnail_id( $id ) . " "; }' )特定...

... >> つづき
May 27, 2018
2679年7月25日

WordPress

画像のタグ・キーワードを表示する方法

画像をWordpressにアップロードした時に、予め登録しておいた画像のタグ、キーワードが表示されるようにしたい。 Lightroom で画像を整理する時に、キーワードを登録すると、Windows のエクスプローラーでは「タグ」として一覧表示される。これをWordpressにアップロードすると、このキーワードがどこにも表示されずに活用されていない。表示されてはいないが、データーベースには記録されている。テーブル: wp_postmeta meta_key: _wp_attachment_metadata meta_value: keywordsにある。これを attachment.php で表示する。<?php...

... >> つづき
May 27, 2018
2679年7月25日

sim

期限切れ直後のAISのSIMを復活させる方法

今朝、いつものようにPCにUSBデザリングで、スマホのAISのSIMから4Mbpsのネットワークに接続したつもりが、ネットに繋がらない。もしやと思い、AISからのSMSメッセージを見てみると、3日前に、昨日の24日までにトップアップしないとSIMの有効期限が切れるとの英語メッセージが来ていた。 SMSの通知はオフにしていて気づかなかった。 4Mbpsインターネット一年間の期限は来年1月まで残っているのに、それとは無関係にSIMカードの期限が設定されているようだ。この期限を伸ばすには、10฿でもトップアップすれば1ヶ月伸びるのだが、毎月やるのはめんどくさい。トップアップはスマホからオンラインでできるのだが、それにしても毎月やるのはめんどくさい。 10฿のトップアップを連続して何度も繰り返...

... >> つづき
May 27, 2018
2679年7月24日

WordPress

HTMLソースの日本語リンクURLを日本語で表示する方法

サイトの頁ソースを見ると、日本語を含むURLリンクが全てエンコードされていて読めない状態なのが気になった。これはWordpressの仕様で、日本語で出力しようとしても、最後にはエンコードされて出力されてしまう。$the_content にフィルターをかけて、 $the_content = rawurldecode($the_content ); としてもだめだった。それで、全体の頁が出力される直前にフィルターを掛けるようにする。 functions.php に次を追記する。if(!is_admin()){ function call_back($buffer) { $buffer = rawurldecode($buffer); return...

More
May 27, 2018
2679年7月24日

WordPress

CSSでカルーセルスライダー

WordPressのテーマ、ストークではトップページにカルーセルスライダーを簡単に設置できる。 pickup というタグが付いている記事が、順に横に流れるように表示される。このスライダー機能には、Jquery が使用されている。このスライダーをjs なしでCSSだけで実現できないかと模索してみた。parts_homeheader.php 等のスライダーを表示したい場所に、次のように記述する。 <?php if ( is_front_page() || is_home() ) : ?> <?php $args = array( 'posts_per_page' => 13, 'offset' => 0, 'tag' => '...

... >> つづき
May 27, 2018
2679年7月23日

WordPress

ギャラリーの画像キャプションを検索対象にする方法

昔の記事でアイキャッチ画像が設定されていない記事が目について、麦に関する記事だから、確か麦畑の写真があったはず、と思い、サイト内検索したら、出てこない。ギャラリー内の画像のキャプションに確かに「麦」という語を使っていたはずであった。それが引っかからない。画像に説明文を付けても検索結果に含まれないのはおかしい。それで、検索対象に画像キャプションも含めるようにした。attachment, inherit を検索対象にする画像キャプションの文字列は、 wp_posts テーブル内の、post_excerpt カラム（行）に格納されている。 post_type は attachmentで、 post_status は、inherit...

... >> 続見
May 27, 2018
2679年7月21日

WordPress

スマホ用2回タップ式ドロップダウンメニューを設置する方法

スマホ画面でスライドダウン、ドロップダウン式のメニューの項目をタップすると、サブメニューがあるのに展開される時間が与えられないままジャンプしてしまう。トップメニューしか開くことができない。サブメニュー、サブサブメニューをクリック、タップすることができないという問題があった。サブメニューが隠れている場合に、一階目のタップをするとリンク先に飛んでしまわないで、まずはドロップダウンメニューを広げ、2回目のタップでリンク先に飛ぶようにしたい。doubletaptogo.js を利用する。Touch-Friendly & Responsive jQuery Dropdown Menu Plugin - doubletaptogo...

... >> つづき
May 27, 2018
2679年7月20日

WordPress

週間/月間/年間人気ランキングのタブ切替表示: Simple GA Ranking

人気記事をランキング表示するのにWPP、Wordpress Popular Posts を使っていたが、Simple GA Rankingに乗り換えた。 Simple GA Ranking は、Google Analytics の統計情報を利用しているので、データーベースへのアクセスが減り、高速化が期待できる。これで、週間・月間・年間ランキングをタブで切り替え表示できるようにしてみた。タブの作成、週間、月間、年間外観→ヰジェットで、サイドバーに「カスタムHTML」を作成し、次のコードを記述する。<div class="pop-tabs"> <ul> <li class="pop-tablist is-active">週...

... >> つづき
May 27, 2018
2679年7月15日

WordPress

Font Awesome を外部JS・CSSなしで表示する方法

Font Awesome 5 を使用するには通常、JSとCSSを読み込む必要がある。 footer.php の </body> タグの前に以下のように記述する。<script defer src="" data-search-pseudo-elements></script> <script> FontAwesomeConfig = { searchPseudoElements: true }; </script> <link rel="stylesheet" href="

... >> つづき
May 27, 2018
2679年7月12日

WordPress

ブログカードで日本語URLを日本語で表示する方法

Pz-LinkCard プラグインのブログカードでは、日本語を含むURLは日本語で表示されない。 urlencode された読解不可能な長い文字列になる。スラタニのドリアン農園花盛り2年前の4月にバイクでナコンシータマラートのKhao Luang 山の周りを周遊していた時のこと、ドリアン農園を通過した。ドリアンの木は花盛りで、実はまだまだできていない季節。スラタニの南60kmぐらいの山裾にある。本格的なドリアン果樹園。ドリアンの花ドリアンの木ここの農家とLine の交換までしたのだが、農薬販売。この写真を撮ると、いきなり機嫌が悪くなってパスポートを見せろなどと言い出した。なにか後ろめた...

... >> つづき
May 27, 2018
2679年7月11日

タイ

スラタニのドリアン農園花盛り

2年前の4月にバイクでナコンシータマラートのKhao Luang 山の周りを周遊していた時のこと、ドリアン農園を通過した。月別: 2677年4月の記事月別: 2677年4月の記事信旅ドリアンの木は花盛りで、実はまだまだできていない季節。スラタニの南60kmぐらいの山裾にある。本格的なドリアン果樹園。ここの農家とLine の交換までしたのだが、

... >> つづき
May 27, 2018
2679年7月11日

タイ

ドリアンとマンゴスチンの季節

ドリアンの季節がやって来た。旬にはこのように、20฿kg＝70円でも買える。これまでの最安値はクラビで50฿だったが、今回が最安値。色が茶色くなって彈けるように割れている。値段相応に、中身は崩れていて食べれない部分もあった。マンゴスチンも35～40฿で値ごろになってきた。日本でマンゴスチンがいくらなのか、調べてみると、楽天で送料込み3900円kgぐらい。タイで買えば現在40฿＝140円。27倍の価格差がある。タイ国政府貿易センタータイ国政府貿易センターは、タイ国政府商務省国際貿易振興局（DITP）の日本における出先事務所として東京、大阪、福岡、広島の4ヶ所に設立されております。日本とタイ国の貿易を活性化し、経済交流を促進するため、タイ...

... >> つづき

More 次頁

WordPress カテゴリ人気記事 Views most

731
MariaDB 10.1 から 10.4 にアップグレードする方法MariaDB 10.1.40 から、MariaDB 10.4.6 にアップグレードした。ひとつだけつまずいたが、簡単にできた。日本語のutf8bm4の Collation で、MySQL ... 2679.7.2 WordPress
581
GCE でHDDからSSDに移行する方法: Google Cloud PlatformGoogle Cloud Platform のGoogle Compute Engine のインスタンスを標準のHDD ハードディスクで作成してしまった。その後、SSDに変更したい場合はどうすれば ... 2679.5.20 Linux WordPress サーバー
378
Webp 変換するとサイズが大きくなるのでQuorityを落とすJpeg 画像をWebp形式に変換するとサイズが30％も減少するなどと説明されていることがよくある。Webp 変換後のサイズの方が大きくなったというのは見つからなかった。そこで、Webpに変換 ... 2679.7.27 WordPress
325
CSSをPreload先読みしてレンダリングブロックしない方法CSSを遅延読み込みするためには、preload を使えばよいのだが、Firefox 、IEブラウザーでは動作しない。それで、loadCSS cssrelpreload.js を併用する。 ... 2679.7.27 WordPress
223
週間/月間/年間人気ランキングのタブ切替表示: Simple GA Ranking人気記事をランキング表示するのにWPP、Wordpress Popular Posts を使っていたが、Simple GA Rankingに乗り換えた。Simple GA Ranking は、Go ... 2679.7.20 WordPress
210
Google Indexing API プラグイン WordPress by Rank MathGoogle の Indexing API を使うと、新しい投稿記事を瞬時にGoogleの検索エンジンに登録できる。Wordpress のプラグインとしてインデックスAPIが利用できる。使 ... 2679.9.3 WordPress
203
スマホ用2回タップ式ドロップダウンメニューを設置する方法スマホ画面でスライドダウン、ドロップダウン式のメニューの項目をタップすると、サブメニューがあるのに展開される時間が与えられないままジャンプしてしまう。トップメニューしか開くことができない。サブ ... 2679.7.21 WordPress スマホ
190
Pjax Blog テーマのカスタマイズ：非同期画面遷移WordPressPjax で非同期画面遷移するWordpress テーマ Pjax Blog に変えてみた。Pjax Blog テーマでは、Barba.js が使用されている。画面遷移した時にデザ ... 2679.8.15 WordPress

2679年7月(佛2562･切2019･令和元年) ～ 19件

WordPress カテゴリ人気記事 Views most

タグ関連記事

閲覧履歴