技術情報 WordPressテーマのSimplicityの記事内にあるh2をCSSの「position: sticky;」で表示位置を固定して追従させてみた
指定した要素の位置に移動した場合に、その要素の親の範囲まで固定する「position: sticky;」なる便利なCSSを知り、見出しに適用してみました。 style.css 子テーマの「style.css」で下記の記述をしました。 .ar...
技術情報
技術情報 
技術情報 Too many retries waiting for SSh to be avalable.と言われてLocal by Flywheelをインストールできない場合
以前、ローカルにWordPressを手軽に構築できるLocal by Flywheelをご紹介いたしました。 そのLocal by Flywheelでコマンド操作をしていると、「このソフトはこのPCで使用することができません」といったような...
技術情報 Local by Flywheelで構築したWordPressにGulpを適用する
先日はWordPressをローカルに手軽に構築できるLocal by Flywheelをご紹介いたしました。 今回はそのLocal by Flywheelで構築したWordPressに、Gulpを適用する方法をご紹介いたします。 開発するテ...
技術情報 WordPressをローカルに構築するならLocal by Flywheelが便利
Local by Flywheel | Local WordPress development made simple WordPressのローカル環境を手軽に構築できるLocal by Flywheelというツールの噂を聞き、試してみまし...
技術情報 mixhostでWordMoveを試してみた
以前、VCCWとWordMoveによるローカルと本番サーバー(エックスサーバー)を同期する方法をご紹介いたしました。 少し前にエックスサーバーからmixhostへサーバー移転を行ったのですが、mixhostがrsyncに対応していないという...
技術情報 XAMPPのuserdirで設定したサイトの作業更新をGulpのBrowsersyncで自動で確認する
以前、XAMPPのuserdirによるローカルでの開発環境の構築、ローカルにあるCMSへのGulpの導入などをご紹介いたしました。 今回はXAMPPのuserdirで設定したサイトの作業更新を、GulpのBrowsersyncによって自動で...
技術情報 Windowsに「Node.js」 と「Gulp.js」をインストールして、WordPressテーマのSimplicityの子テーマにあるCSSをMinify化して読み込んでみた
「Gulp」というタスクランナーが以前から気になっていたので、当サイトで採用しているWordPressテーマのSimplicityで適用してみることにしました。 今回は「Gulp」でCSSのMinify化(圧縮)を行ってみたのでご紹介いたし...
技術情報 WordPressのエディタで挿入する画像をプラグインを使わずに指定したサイズで挿入できるようにしてみた
WordPressの「メディアを追加」で挿入出来る画像サイズはデフォルトだと小、中、大の3つになります。一度画像を挿入した後にエディタのビジュアルモードで画像を選択すると、サイズを自由に編集することができます。ただ、それだと二度手間になって...
技術情報 VCCWとWordMoveで本番サーバー(エックスサーバー)とローカル環境を同期してみた
welaika/wordmove: Capistrano for Wordpress 前回はVagrantとVCCWでWindows10のローカルにWordPressの環境を構築する方法をご紹介いたしました。 今回はVCCWとWordMov...
技術情報 Twitterのツイート時の画面の違いを検証してみた
Twitterのボタンでツイートする時の画面に違いがあることを、以前から不思議に思っていたので検証してみることにしてみました。 検証方法 PC、またはTwitterアプリが入っているスマホであらかじめログインしておき、検証用の画面を作り、そ...
技術情報 HTML5.1で導入されたmenuとmenuitemタグで独自のコンテキストメニューを作ってみた
右クリックで表示されるコンテキストメニューをHTML5.1で導入された<menu>と<menuitem>タグで独自に作れるという話を聞き、早速作ってみることにしました。 独自のコンテキストメニューを表示する 下記はFirefoxの最新版で確...
技術情報 VagrantとVCCWでWindows10のローカルにWordPressの環境を構築してみた
VCCW - A WordPress development environment. 今まではWordPressのローカル環境はXAMPPで行っていたのですが、VCCWというのが話題になっているようなので、導入してみることにしました。 V...
技術情報 Facebookでのページ表示を高速化させる「Instant Articles」をWordPressに導入してみた
Instant Articles | Facebook 以前から「Instant Articles」は気になっていたのですが、下記の「ICS MEDIA」さんの記事がとてもわかりやすく、よさそうだったので、参考にして当サイトでも導入すること...
技術情報 SVGとアイコンフォントを作ってWordPressテーマの「Simplicity」に表示してみた
以前、「Simplicity」で表示されるPCヘッダーとモバイルメニューのスクロール時に、固定表示/非表示する動作をボタンで切り替える方法をご紹介いたしました。 そこで表示しているボタンをもう少しピンと来るようなものにしたいと思い、それらし...
技術情報 WordPressテーマの「Simplicity」で表示されるモバイルメニューの、スクロール時に固定表示/非表示する動作をボタンで切り替えるようにしてみた
前回、「Simplicity」で表示されるPCヘッダーのスクロール時に、固定表示/非表示する動作をボタンで切り替える方法をご紹介いたしました。 今回はモバイルでもボタンで切り替えられるようにしてみたのでご紹介いたします。 js 下記のjsを...
技術情報 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-head...
技術情報 WordPressテーマのSimplicityに記事のタイトルとURLをコピーするボタンを設置してみた
Twitterを眺めているとTLに、「WEB企画LABO」というブログの「記事タイトルとURLをコピーする」だけのボタン、というツイートが流れてきました。 記事を読むと、活用してもよいとのことでしたので、早速設置してみることにしてみました。...