技術情報 HTML5.1で導入されたmenuとmenuitemタグで独自のコンテキストメニューを作ってみた
右クリックで表示されるコンテキストメニューをHTML5.1で導入された<menu>と<menuitem>タグで独自に作れるという話を聞き、早速作ってみることにしました。独自のコンテキストメニューを表示する下記はFirefoxの最新版で確認す...
技術情報
技術情報 
技術情報 VagrantとVCCWでWindows10のローカルにWordPressの環境を構築してみた
VCCW - A WordPress development environment.今まではWordPressのローカル環境はXAMPPで行っていたのですが、VCCWというのが話題になっているようなので、導入してみることにしました。VCC...
技術情報 Facebookでのページ表示を高速化させる「Instant Articles」をWordPressに導入してみた
Instant Articles | Facebook以前から「Instant Articles」は気になっていたのですが、下記の「ICS MEDIA」さんの記事がとてもわかりやすく、よさそうだったので、参考にして当サイトでも導入することに...
技術情報 SVGとアイコンフォントを作ってWordPressテーマの「Simplicity」に表示してみた
以前、「Simplicity」で表示されるPCヘッダーとモバイルメニューのスクロール時に、固定表示/非表示する動作をボタンで切り替える方法をご紹介いたしました。そこで表示しているボタンをもう少しピンと来るようなものにしたいと思い、それらしい...
技術情報 WordPressテーマの「Simplicity」で表示されるモバイルメニューの、スクロール時に固定表示/非表示する動作をボタンで切り替えるようにしてみた
前回、「Simplicity」で表示されるPCヘッダーのスクロール時に、固定表示/非表示する動作をボタンで切り替える方法をご紹介いたしました。今回はモバイルでもボタンで切り替えられるようにしてみたのでご紹介いたします。js下記のjsを「sl...
技術情報 WordPressテーマの「Simplicity」で表示されるPCヘッダーの、スクロール時に固定表示/非表示する動作をボタンで切り替えるようにしてみた
以前、「Simplicity」のPCヘッダーをスクロールで固定表示/非表示する方法をご紹介いたしました。今回はそれらの動きを、ボタンで切り替えられるようにしてみたのでご紹介いたします。js下記のjsを「slide-header.js」などと...
技術情報 WordPressテーマのSimplicityで表示される、PCのブログ内検索をヘッダーに表示してみた
当サイトで採用しているWordPressテーマのSimplicityは、ブログ内検索の表示は基本的にウィジェットによってサイドバーに表示します。検索の利便性を向上させる場合、サイドバーのスクロール追従領域に「検索」のウィジェットを設置する必...
技術情報 WordPressテーマのSimplicityで表示されるタグクラウドをカスタマイズしてみた
Simplicityのウィジェットで表示されるタグクラウドは非常にシンプルで、カスタマイズする余地がたくさんあります。気分転換にでもと思い、タグクラウドの見た目を変えてみたのでご紹介いたします。functions.php表示順などを変えるた...
技術情報 WordPressテーマの「Simplicity」で表示されるPCのヘッダーを、スクロールで固定表示/非表示するようにしてみた
以前「Simplicity」の固定表示されるモバイルメニューを、スクロールで非表示する方法をご紹介いたしました。今回はPCのヘッダーをスクロールで固定、または非表示にしてみたのでご紹介いたします。js下記のjsを「slide-header....
技術情報 WordPressテーマのSimplicityに記事のタイトルとURLをコピーするボタンを設置してみた
Twitterを眺めているとTLに、「WEB企画LABO」というブログの「記事タイトルとURLをコピーする」だけのボタン、というツイートが流れてきました。記事を読むと、活用してもよいとのことでしたので、早速設置してみることにしてみました。j...
技術情報 WordPressテーマの「Simplicity」で固定表示されるモバイルのメニューを、スクロールで非表示するようにしてみた
当サイトで採用しているWordPressテーマの「Simplicity」は非常に高機能で、カスタマイズでモバイルのメニューをブラウザのトップに表示して固定する機能があります。ただ、モバイルのメニューをブラウザのトップに固定すると、コンテンツ...
技術情報 WordPressの記事内にある、imgのaltの中身が空の場合にエラーを表示するようにしてみた
記事内に画像を挿入した後、うっかりaltの中身を空(alt="")にして投稿してしまうことがあると思います。ある記事を見て出来そうだったので、altの中が空の場合に投稿画面でエラーを表示するようにしてみました。functions.php下記...
技術情報 WordPressテーマのSimplicityにナイトモードのようなものを実装してみた
少し前のiOSに画面を暗くして、ブルーライトを軽減するというNight Shift（ナイトシフト)という機能が実装されました。Night Shiftとはちょっと違いますが、当サイトでも夜間に色を変えるナイトモードのようなものを実装してみまし...
技術情報 ショートコードで一部のWordPressの内容を指定日時で表示する「datecontent-shortcode」プラグイン
WordPressの記事内にある一部の内容を、指定した日時で表示できないか考えていたところ、ちょうどよい方法を紹介しているサイトがありました。訪れてみると、プラグインとして動作するようにされており、ショートコードで利用できるようになっている...
技術情報 ignoreショートコードでWordPressの内容を非表示にする
WordPressで記事を書いてる時に、内容を非表示にしたいときがあると思います。非表示にもいろいろな方法がありますが、ショートコードを使った方法をご紹介いたします。ignoreショートコードWordPressのテーマにある「functio...
技術情報 WordPressテーマのSimplicityにローディング画面とAMPの遷移を促す要素を表示してみた
以前、WordPressテーマの「Simplicity」に「AMP」ページへの遷移を促す要素を表示する方法をご紹介いたしました。次はもっと自然に「AMP」ページへの遷移を促したいと思い、ローディング画面を表示してその範囲内に表示してみました...
技術情報 CSSでHTMLの記述順とは異なる並び順にする
今回はHTMLのソースの記述順とは異なる見た目の並び順にする方法をご紹介いたします。「float」、「position」使う方法サイドバーを左、メインを右の表示にする(2カラム)html<div class="main"> メイン</div...
技術情報 AMPページのバリデーションをWeb上で行える「The AMP Validator」を使ってみた
The AMP Validator通常、「AMP」ページのバリデーションを行う場合、検証したいページのURLの末尾に「#development=1」と入力して、Chromeブラウザのコンソール表示で確認する必要がありました。「#develo...
技術情報 AMPデザインテンプレートの「Simp」に、通常の「Web」ページへ遷移するボタンを表示させてみた
以前、WordPressの「Simplicity」テーマ内に、AMPデザインテンプレートの「Simp」を導入する方法をご紹介いたしました。WordPressの「Simplicity」テーマ内にAMPデザインテンプレートの「Simp」を導入し...
技術情報 WordPressテーマの「Simplicity」に、「AMP」ページへの遷移を促す要素を表示してみた
以前、WordPressの「Simplicity」テーマ内に、AMPデザインテンプレートの「Simp」を導入する方法や、「Google AdSense」を表示する方法などをご紹介いたしました。WordPressの「Simplicity」テー...