あなたの日々のWEB制作に役立つTipsをお届けしますhttps://tips-web.net/jahttps://tips-web.net/search-multi-taxonomy/https://tips-web.net/search-multi-taxonomy/早速ですが、この記事では以下のようなタクソノミー(カテゴリー)が複数ある検索フォームの実装について紹介したいと思います。 👇今回実装する検索フォーム カスタム投稿を作成する まずはカスタム投稿を作成します。Sun, 08 Jan 2023 00:00:00 GMTWordpresshttps://tips-web.net/looking-back-to-2022/https://tips-web.net/looking-back-to-2022/今年も残すところあと1日。 2022年は色々ありすぎてあっというまに1年が経った感じがします。 今年あった出来事を簡単にまとめると以下の通りです。Fri, 30 Dec 2022 00:00:00 GMTその他https://tips-web.net/jobchange-to-webengineer/https://tips-web.net/jobchange-to-webengineer/2022年11月1日から東京のWebシステム開発を行う会社に転職が決まりました！ 主に扱う技術は、Laravel・Vueで、サーバーサイドエンジニアとして採用していただけました！ 自分は2019年4月から3年ほど東京のWMon, 31 Oct 2022 00:00:00 GMTその他https://tips-web.net/%e3%80%90wordpress%e3%80%91smart-custom-fields%e3%81%aewysiwyg%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf%e3%81%8c%e6%a9%9f%e8%83%bd%e3%81%97%e3%81%aa%e3%81%84%e6%99%82%e3%81%ae%e8%a7%a3%e6%b1%ba%e6%96%b9/https://tips-web.net/%e3%80%90wordpress%e3%80%91smart-custom-fields%e3%81%aewysiwyg%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf%e3%81%8c%e6%a9%9f%e8%83%bd%e3%81%97%e3%81%aa%e3%81%84%e6%99%82%e3%81%ae%e8%a7%a3%e6%b1%ba%e6%96%b9/現象 WordPresssのバージョン6.0.3にて、Smart Custom FieldsのWysiwygを、カスタム投稿で使おうと思ったところ、 Wysiwygエディタの以下の赤線部分をクリックしても何も反応がなく機Sun, 30 Oct 2022 00:00:00 GMTWordpresshttps://tips-web.net/swiper-slide-in-slide/https://tips-web.net/swiper-slide-in-slide/久しぶりの投稿です！ 先日、MENTAでとある方から「スライダーの中にスライダー」を実装したいです！とご相談いただきました。 今回は、その際にご提示したコードをご紹介したいと思います。Sat, 23 Jul 2022 00:00:00 GMTJavaScripthttps://tips-web.net/how-to-clickable-only-child-elements/https://tips-web.net/how-to-clickable-only-child-elements/結論 以下のようにすればOKです！！ 検証 試しにjsファイルに以下のように記述し、コンソールをチェックしてみました。Mon, 30 May 2022 00:00:00 GMTHTML/CSShttps://tips-web.net/wpdebug-in-function/https://tips-web.net/wpdebug-in-function/WordPress構築をしているときにデバッグは必要不可欠です。 print_rやvar_dumpを用いてデバッグしますよね。 例えば、taxnomony.phpで現在表示中のタームのスラッグを取得したいとき。Sun, 22 May 2022 00:00:00 GMTWordpresshttps://tips-web.net/custom-data-attr/https://tips-web.net/custom-data-attr/私は普段MENTAでフリーランスや初学者を教えているのですが、HTMLのカスタムデータ属性について知らない方が多いと感じました。Wed, 18 May 2022 00:00:00 GMTHTML/CSShttps://tips-web.net/move-post-content/https://tips-web.net/move-post-content/すでにWordPressを使用してサイトが公開され、運用フェーズに入ったとき、公開されている投稿データの一部内容を変更したいという要望は多いです。Tue, 17 May 2022 00:00:00 GMTWordpresshttps://tips-web.net/wordpress-search-like-title/https://tips-web.net/wordpress-search-like-title/WordPress(ワードプレス)のサイト内検索の仕組み まずは簡単に、search.phpを使ったサイト内検索の基本的な仕組みについて把握しておきましょう WordPress(ワードプレス)でサイト内検索する場合、GEThu, 25 Nov 2021 00:00:00 GMTWordpresshttps://tips-web.net/change-notfound-title/https://tips-web.net/change-notfound-title/2020年末以前のAll in One SEOだと404ページのタイトルが管理画面から設定できたのですが、最新のAll in One SEOだとそれができないようです。Sun, 21 Nov 2021 00:00:00 GMTWordpresshttps://tips-web.net/wp-lecture01/https://tips-web.net/wp-lecture01/やりたいこと メインビジュアルがスライダーになっていて、そのスライド１枚１枚の追加や各種設定を管理画面から行いたいケースはよくありますね。 例えば、以下のような仕様です。 実装方法 以下のような流れで実装を進めます。Sun, 31 Oct 2021 00:00:00 GMTWordpresshttps://tips-web.net/gmap-add-infowindow/https://tips-web.net/gmap-add-infowindow/前回の記事で、Google Maps APIの導入方法からマーカー画像変更までの流れを紹介しました。 この記事では、変更したマーカーをクリックしたら吹き出し（情報ウィンドウ）を表示する方法について紹介します。Sun, 24 Oct 2021 00:00:00 GMTJavaScripthttps://tips-web.net/howtouse-gmap-api/https://tips-web.net/howtouse-gmap-api/Google Maps APIを使うとGoogle マップを自由自在にカスタマイズできます。 以下がその例です。 ①の、「マップのマーカーを変更したい」という要望は結構多い気がします。Wed, 06 Oct 2021 00:00:00 GMTJavaScripthttps://tips-web.net/slick-slider-sample/https://tips-web.net/slick-slider-sample/この記事では、僕がこれまで案件で遭遇してきたスライダーを紹介します。 すべてslickを使用しています。 slickの基本的な使い方については上記サイトを参考にしてみてください。Sun, 26 Sep 2021 00:00:00 GMTJavaScripthttps://tips-web.net/five-ng-card-coding/https://tips-web.net/five-ng-card-coding/以下のような、よくあるカード型のコーディングは、簡単なようで実はとても奥が深いです。Thu, 23 Sep 2021 00:00:00 GMTHTML/CSShttps://tips-web.net/keep-ratio-changeimage/https://tips-web.net/keep-ratio-changeimage/画像の比率を保つ基本的なコーディング方法については以下をご覧ください。 比率を保ちながら画像を拡大縮小させる方法 ・・・ 「PCとSPで管理画面から画像を切り替えたい」 という要望は、WordPress構築をしていると良Thu, 16 Sep 2021 00:00:00 GMTHTML/CSShttps://tips-web.net/keep-ratio/https://tips-web.net/keep-ratio/この記事では以下のよくあるカード型デザインを例にコードを紹介します 結論 画像が動的に変わることを想定してコーディングした場合、以下の様にコーディングするといいでしょう 解説 まずはHTML構造やCSSの記述についてザッTue, 14 Sep 2021 00:00:00 GMTHTML/CSShttps://tips-web.net/smooth-scroll/https://tips-web.net/smooth-scroll/同じページ内のスムーズスクロールは簡単ですが、別ページからリンクをクリックしてそのリンクの箇所にスムーズスクロールするのは結構面倒です。 しかし、意外とよくある要望なので抑えておくといいでしょう。Thu, 09 Sep 2021 00:00:00 GMTJavaScripthttps://tips-web.net/wordpress-move/https://tips-web.net/wordpress-move/プラグインでお引越しする際のデメリット WordPressのお引越しを簡単にやるならAll-in-One WP Migrationですよね ただ、これにはいくつか問題があります まず、容量問題です 移行するデータ量が多いSun, 04 Apr 2021 00:00:00 GMTWordpresshttps://tips-web.net/gulp4-recommended-tasks/https://tips-web.net/gulp4-recommended-tasks/はじめに この記事はGulpの環境構築が完了していることが前提です まだ環境構築ができていない方は以下の記事を参考にしてみてください Windowsの方向け👇【テンプレートファイル付き】どこよりも詳しいGulp4環境構築Sun, 28 Mar 2021 00:00:00 GMT効率化https://tips-web.net/gulp4-mac/https://tips-web.net/gulp4-mac/はじめに 「Gulpってなに？」 「便利だと聞くけれどどうやって導入したらいいのかわからない」 そう悩まれているかた多いと思います 何故なら多くの記事が、古いGulpのバージョンの記述方法で書かれていたり、Node.jsWed, 24 Mar 2021 00:00:00 GMT効率化https://tips-web.net/gulp4-windows/https://tips-web.net/gulp4-windows/はじめに 「Gulpってなに？」 「便利だと聞くけれどどうやって導入したらいいのかわからない」 そう悩まれているかた多いと思います 何故なら多くの記事が、Gulpのバージョンが古い記述で書かれていたり、Node.jsのイSun, 21 Mar 2021 00:00:00 GMT効率化https://tips-web.net/my-five-things-for-building-wordpress/https://tips-web.net/my-five-things-for-building-wordpress/はじめに サイト制作でよく使うツールってありますよね毎回公式サイトにいってダウンロードしたり、ファイルを都度作成したりするのは時間の無駄です… なので僕は、よく使うツールを「案件ツール」などといったフォルダにTue, 16 Mar 2021 00:00:00 GMTWordpresshttps://tips-web.net/easy-responsive-coding/https://tips-web.net/easy-responsive-coding/はじめに レスポンシブコーディングって地味に難しいですよね そんなあなたのお悩みを一瞬で解決する方法を紹介します 結論 まずはreset.cssなどで、htmlに対して以下のように記述します これで完成です コーディングSat, 13 Mar 2021 00:00:00 GMTHTML/CSShttps://tips-web.net/usefulwebsite-for-making-documents/https://tips-web.net/usefulwebsite-for-making-documents/はじめに 素材探しって時間がかかりますよねお客様への資料作りの際に使用する画像や、ブログのアイキャッチ画像、サイトで使用するアイコン、ダミー画像、ダミー動画… どれもあまり時間をかけたくないところではありますWed, 10 Mar 2021 00:00:00 GMT効率化https://tips-web.net/find-sidescrolling/https://tips-web.net/find-sidescrolling/はじめに コーディングしているとき、予期せぬ謎の余白ができたり、横スクロールが発生してしまうことありますよね 例えば以下のようなときです このようなとき、どこが原因なのか特定しにくいものです この記事ではこの原因を一瞬でTue, 09 Mar 2021 00:00:00 GMTHTML/CSShttps://tips-web.net/without-no-plugin-animation/https://tips-web.net/without-no-plugin-animation/はじめに サイト制作で要望の多いアニメーション でも過度なアニメーションは嫌われがちそんなときちょうどいいアニメーションが「下からふわっと」です でもそのためにわざわざプラグインを導入するのは、不要な記述がたくさん含まれSat, 06 Mar 2021 00:00:00 GMTJavaScript