WordPressのログイン画面のURLをデフォルトのままにしておくと、セキュリティ面で少々心配になりますね。 そこで今回は『Login rebuilder』というプラグインを使って、URLの変更をしましょう。 目次1 まずはインストール2 設定をしていこう2.1 無効なリクエスト時の応答2.2 ログインファイルキーワード2.3 新しいログインファイル2.4 第2ログインファイル2.5 新しいログインファイル2.6 ログ保存まわり2.7 著者ページへのアクセス2.8 oEmb […]
WordPressサイトのセキュリティを強化するにあたって、「ログインページのURLを変更する」というのはよくある手法ですが、その他にもできることを忘備録として一覧にしました。 目次1 SSLによる ログインと管理画面へのアクセスを強制する2 クリックジャッキング対策3 Dos攻撃を防止する4 REST APIを停止する5 WordPressのバージョン情報を削除する6 author IDの取得を制限する7 YoutubeChannelのご紹介 SSLによる ログインと管理画 […]
私が初めてAMP対応に着手しようとした時、複数のサイトを渡り歩いて情報を集めながら進めていかなければならない状態でした。「で、結局どうすればいいの」となったので、忘備録も兼ねてまとめていきたいと思います。速くなる仕組みなどは今回は省略します。 目次1 作る前に知っておいてほしい仕様1.1 AMPの公式仕様に沿ってタグを記述する必要がある1.2 AMPは現在進行形で許可されるタグが増えている1.3 レスポンシブ対応が必須1.4 JSを使ってはいけない？1.5 styleはhea […]
サイトを作るとパンくずが必要になってくることが多いですね。 カスタム投稿などを使うと自作だとややこしくなってしまうこともあるので、プラグインを使うと便利です。 今回は『Breadcrumb NavXT』というプラグインを使っていきます。 目次1 インストールしよう2 コードを入れて表示させよう3 設定をしよう3.1 一般3.2 投稿タイプ3.3 タクソノミー3.4 その他 インストールしよう 『プラグイン＞新規追加』から『Breadcrumb NavXT』を検索して追加、『有 […]
昨今、SEOで絶対に無視できないのがAMP。 表示速度を爆速にする分、様々な制約が設けられていますが、Google Chartsなどの部分的なものであれば同ページ内に表示が可能です。 目次1 部分的なJS表現をiframeで追加する2 導入方法 部分的なJS表現をiframeで追加する 分かってしまえばやり方は単純。AMP非対応の箇所のみiframeを使用します。 下記は弊社で運営している飲み会マッチングサービスのノミトモ。飲み会の募集が下にするする流れていくようなアニメーシ […]
株式会社8bitでは「ノミトモ」「Grmo」などのWebサービスを運営していますが、近年はスマホアプリへの対応も行っています。 その際、Webからアプリを起動させたい時があると思います。 具体的には「メールアドレスの有効性チェックを行い、URLを叩くとWebページにアクセスして アプリを起動」など･･･ AndroidやiOS両方とも比較的低コストで導入できるので、特にWebサービスと連動するアプリの場合は導入していきたいですね。 Androidの場合 Androidでは「カ […]
ページのbackgroundにふわふわと泡が漂うような表現ができる「bubbly-bg.js」を紹介します。 公式デモサイト 使用してみたところ、仕様は以下のようです。 ・背景は固定。スクロールのある縦長のページでも、100vw、100vhでfixed。 ・スマートフォン端末でも動作。（とりあえず手元のiPhoneXとiPadで動作確認しました。） ・泡の個数、色、向き、速さ、大きさ、ぼかし具合、アルファ値、背景グラデーションなど細かなカスタマイズが可能 ・背景のグラデーショ […]
通常の投稿は10件ずつ表示したいけど、とあるカスタム投稿の一覧ページはデザインを変えて8件ずつ表示したい…そんな時、以外と簡単に件数の調整が可能です。 functions.phpに記述 下記をfunctions.phpに追記してください。 これだけです。投稿タイプや件数は変更してください。 あとは一覧のPHPファイルや、CSSを修正調整すれば完成です。
WordPressでデフォルトで読み込んでいるjQueryですが、どうにもバージョンが古いということがあります。 そんな時はfunction.phpにコードを記述して古いjQueryを読み込ませないようにしましょう。 その後新しいjQueryを読み込ませます。 ※function.phpは必ずバックアップを取りながら作業してください ※古いプラグインを使用していると影響がある場合があるので、都度確認をしてください 記述するコード 管理画面で動作がしなくなる可能性があるため、『 […]
関連記事を表示するプラグインを使用することもできますが、あまり融通が利かなかったり、CSSの調整が面倒だったりなので、制作に慣れている方であれば、自分でゼロから設定してしまった方が早い場合があります。 今回は、カスタムフィールドを追加するプラグインを使用して、各投稿ごとに関連記事を設定できるようにします。関連記事という使い方ですが、記事は手動の選択制で、1つめが未設定であればランダム表示するだけなので厳密に言えば関連記事ではありませんが、サイト内を周回させたいだけであれば […]
WordPressでは管理画面の『外観＞メニュー』でメニューの管理ができます。 ここで新しいメニュー自体の追加はできるのですが、メニューの表示位置は追加できません。 例えばフッターで左右に項目を分けてメニューを表示したい…ということがあっても現状だと実現ができないです。 そんな時はfunctions.phpにコードを追加してメニューの位置を追加しましょう。 functions.phpにコードを追加 functions.phpに以下のコードを追加します。 ※functions. […]
WordPressではデフォルトで画像などのファイルを置換する機能がありません。地味に面倒です。 そこで『Enable Media Replace』というプラグインを使ってファイルの置換ができるようになります。 ※画像やpdfの置換には向いていますが、その他のファイルには不向きです。 目次1 ダウンロードする2 実際に使ってみよう ダウンロードする プラグインのページからzipをダウンロードするか、管理画面のプラグインの『新規追加』から『Enable Media Replac […]
目次1 AMPとは？1.1 高速化のための厳しい制約2 劇的に改善！Google PageSpeed Insightでの評価Before／After2.1 AMP対応前2.2 AMP対応後 AMPとは？ 近年、Googleが推奨しているAMPをご存じでしょうか。 AMP対応しているページを事前にGoogleがキャッシュしておくことによって、閲覧者がページリクエストした際に、Googleが持っているキャッシュを表示するため、素早く表示できるという仕組みです。 通常、ページの表示 […]
WordPressで記事を書いていると、タイトルやテーブル組みなど決まった型のHTMLコードを呼び出したいという時がありませんか？ そんな時に使えるプラグインが『AddQuicktag』です。 こんな感じでエディタ部分にボタンで表示されて、クリックをしたらコードをすぐに呼び出すことができます。 ちなみに『AddQuicktag』を使用するときは新しいエディタの『Gutenberg』の時はクラシックモードにして使用したり、『Classic Editor』等のプラグインを使用して […]
『PageSpeed Insights』を使用するとよく出てくる画像フォーマット『WebP』。 Photoshopでは書き出しなどができません。 が、今回紹介する『WebPShop』を使用することで書き出しが可能になります。 今回はインストールの方法をご紹介します。 目次1 使い方1.1 ダウンロード1.2 インストール 使い方 ダウンロード まずはGitHubからプラグインをダウンロードします。 インストール 『bin』のフォルダを開きます。 Macの方は『WebPShop […]
受託案件でWordPressを使用したサイトを構築する際、そのまま納品すると管理画面が分かりにくいことがあります。 慣れない方が更新されることも考慮して、細やかな部分ですが、配慮してあげると更新時のストレスがぐっと減ります。 例えばイベント情報を投稿するサイトを作成した場合、メインループの「投稿」の表記を「イベント情報」に変えておくと、一目見てどこを更新すればいいのか分かります。 目次1 やり方2 アイコンを変更する やり方 テーマの function.php に、以下の記述 […]
目次1 キャンセルの方法2 デモ3 サンプルソース3.1 HTML3.2 JS3.3 CSS キャンセルの方法 スマホやタブレットなどのタッチデバイスで、ソフトウェアキーボードが立ち上がるのをキャンセルしたい場合、inputに「readonly=”readonly”」属性を追加すると、キーボードが非表示になります。 利用シーンとしては、iPadでツールを作成したい場合などに使えると思います。 予約システムなどであれば、電話番号の入力や電卓機能を独自のテ […]
マウスホバーするとフキダシでテキストが表示される「jquery.balloon.js」。 シンプルで大変使い勝手の良いJSですが、単純に呼び出しただけではタブレットやスマートフォンなどのタッチデバイスで動作がうまくいきません。 書き方を少し工夫して、スマートフォンやタブレットのタッチデバイスに対応させます。PCではマウスホバー、タッチデバイスではタップで表示非表示するようにします。 [ 公式JSファイルのDLはこちらから ] [ 私が作った簡単なデモはこちら ] 目次1 使い […]
今時小学校ではプログラミングが必修になっているようですね。すごいです…。 なかなか一人だと初めのうちは勉強するにも難しいプログラミングですが、WEBサービスを使えば気軽に始めることができます。 目次1 SCRATCH2 Hour of Code3 プログラミングゼミ4 ドットインストール5 Progate SCRATCH メディアでもよく取り上げられている『SCRATCH』です。 難しいコードなどはなく、ブロックのようなものを積み重ねてキャラクターなどに対してプログラミングを […]
2020年4月現在、リモートワーク/テレワークでお仕事されている方も多いのではないでしょうか。 そんな時役立ちそうなツールをまとめてみました。参考になったらうれしいです。 ※料金は人数の規模によって異なりますので、公式サイトをご確認ください。 ※会社によってはセキュリティの関係上ツールの使用が難しい場合もあるので、ご確認いただいた上で導入してください。 目次1 コミュニケーションツール系1.1 ChatWork1.2 Slack1.3 Skype1.4 ZOOM1.5 Mic […]
WordPressで規模の大きいサイトを作るには投稿画面が複数必要になる場合もあり、内容によっては固定ページなどで管理が難しいため投稿画面を新しく作成したときがあります。 そんな時新しく追加する投稿画面のことを『カスタム投稿タイプ』といいます。 基本的にfunction.phpにコードを追記していけば作成もできるのですが、正直初心者だしfunction触りたくない…という人もいるかと思います。 そんな時活躍してくれるプラグインが『Custom Post Type UI』です。 […]
WordPressが5.0になってから、エディタががらっと変わりました。『Gutenberg』という名前がついているみたいです。 慣れたらそんなに問題ないかな…と思うのですが、ボックス（例えばカテゴリーをチェック入れる領域みたいなの）を増やしたいときに何となくごちゃごちゃした感じになってしまうんですよね。 今回はエディタを旧エディタのように表示できるプラグイン『Classic Editor』を紹介します。 『Classic Editor』をインストールしよう ひとまずプラグイ […]
WordPressで入れた記事は基本的に並び替えはできません。 デフォルトの方法で直すとすると日付を修正していき…となり、複数の記事を入れ替えたい場合は現実的ではないです。 そんなときに役に立つのが『Intuitive Custom Post Order』というプラグインです。 目次1 Intuitive Custom Post Orderをダウンロードしよう2 設定をしよう3 実際に移動させてみよう Intuitive Custom Post Orderをダウンロードしよう […]
WordPressで特定のページにのみベーシック認証をかけたい時ってありませんか？ 全体にかけるプラグインはありますが、特定ページだと見当たらなかったりします。 今回はベーシック認証をかけて、管理画面からでも簡単に設定できる方法をご紹介します。 目次1 ベーシック認証のかけ方1.1 ①function.phpにコードを記述する1.2 ②header.phpにコードを記述する1.3 【応用】管理画面からIDとパスワードを設定できるようにする ベーシック認証のかけ方 ①funct […]
WordPressのログイン画面は、デフォルトの状態ではログイン画面のURLが全て同じです。 以下の2つのアドレス、ドメイン部分を変更してブラウザでたたくと、ログイン画面にアクセスできてしまいます。 https://ドメイン.com/wp-login.php https://ドメイン.com/wp-admin/ WordPressの乗っ取りやスパムを防ぐため、ログイン画面のURLを変更して、セキュリティの対策を行いましょう。 目次1 [手順1]wp-login.phpの代わり […]
運営会社:株式会社8bit
制作サービス
運営サービス
