コーディングとWordPressでWeb制作

こんにちは！Web制作＆コーダーのじゅんぺい（@junpei_sugiyama）です！ 今回は、 使わなくなったWordPressサイトやMySQLデータベースを削除したいけどどうやるの？     といった方に対する記事となります。 通常のブログなどは削除する事はそうそうないと思いますが、Web制作ではテストサーバーを使う事が多く、作っただけではどんどん増えていってしまいます。 なのでWeb制作においては納品完了後にテストサーバーにインストールしたWordPressは削除しましょう。 ...

こんにちは！Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 テストサーバーってどうやって用意するの？   といった方に対する記事となります。 今回はエックスサーバーでテストサーバーを作成する方法について解説していきます。   テストサーバーとは？ まずテストサーバーについて簡単に解説しておきます。 通常Web制作は自分のPC上（ローカル環境）で作成し、それをテストサーバーという実際にインターネットに繋がっているサーバーにアップして、問題がなければ本番環境に移 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 記事一覧ページの2ページ目以降が表示されないんだけどどうして？     といった方に対する記事となります。 これは以前ハマったことがあり、また最近ハマって原因を思い出すのに時間かかったので備忘録として記しておきます。 1ページに表示する最大投稿数 これはWordPressの管理画面→設定→表示設定にある項目で、1ページに表示する最大投稿数を決める事が出来ます。 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 XDでカラーコードが8桁なんだけどどういう事？     といった方に対する記事となります。 カラーコードといえば通常6桁かRGBだと思いますが、XDのカンプでは8桁表示の時もあるので「？？」となる人もいるでしょう。 一般的なカラーコード まずは赤を通常のカラーコードで表したいと思います。 6桁（16進数） color: #ff0000; RGB color: ...

  こんにちは！Web制作＆コーダーのじゅんぺいです！ 実は今年9月ごろにタイに移住する計画を立てています。 現在タイの長期滞在ビザであるタイランドエリートの申し込みをしている所で、順調にいけば9月末ごろに移住予定です（ワクチン接種してから行きたいのですが、予約が取れない関係でズレる可能性ありますが・・・） という事で本格的に書いていくのはもう少し先になりますが、現在海外移住についてやっている事を少しずつ下書きしており、移住したらタイについてのブログを書いていきたいと思っています。 なぜ海外移住 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressで1つ前に戻るボタンってどうやって作るの？     といった方に対する記事となります。 記事一覧ページの個別記事ページの下には「前の記事」「次の記事」「一覧に戻る」などが一般的だと思いますが、たまに「戻る」というデザインもあります。 「前の記事」「次の記事」はページネーション、「一覧に戻る」は単純に記事一覧のリンクを設定すればいいのですが、戻 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 iPadのみ適用したい処理があるんだけどどうしたらいい？     といった方に対する記事となります。 画面幅によって処理を変えるのはレスポンシブ対応が出来れば簡単ですが、同じ画面幅でもiPadでは処理を変えたいという事があるかも知れません。 今回はその方法をご紹介します。 デモ まずはこちらも見て下さい。 See the Pen by junpei (@jun ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 slickのスライダーをスマホのみ無効にする方法ない？     といった方に対する記事となります。 スマホのみスライダーを無効にしたい場合もあると思います。 今回は両方の方法について解説していきますが、スマホの判断は画面幅で決めていきます。 スマホ時にはスライダー無効 まずはスマホ時にスライダーを無効にしてみます。 今回はこのブログをPCで見た時に確認が出来る ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 Googleフォームってデザインのカスタマイズ出来ない？     といった方に対する記事となります。 WordPressであればContact Form7などプラグインを使えば大丈夫ですが、静的サイトでは当然ながらWordPressのプラグインは使えません。 また、特に指定が無ければレスポンシブメールフォームなど使う事も可能です。 レスポンシブ対応の無料お問い ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 スクロールして表示領域に入ったら要素をフェードインさせる事出来ない？     といった方に対する記事となります。 以前「スクロールに応じてアニメーションが発生するwow.jsの使い方」で同じような物をご紹介しましたが、実務でよく使うのは圧倒的に今回のinview.jsの方になります。 正確に言えばフェードインだけではなく、スクロールして表示領域に入ったらcla ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 記事一覧ページの2ページ目以降が表示されないんだけどどうして？     といった方に対する記事となります。 これは以前ハマったことがあり、また最近ハマって原因を思い出すのに時間かかったので備忘録として記しておきます。 1ページに表示する最大投稿数 これはWordPressの管理画面→設定→表示設定にある項目で、1ページに表示する最大投稿数を決める事が出来ます。 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressで1つ前に戻るボタンってどうやって作るの？     といった方に対する記事となります。 記事一覧ページの個別記事ページの下には「前の記事」「次の記事」「一覧に戻る」などが一般的だと思いますが、たまに「戻る」というデザインもあります。 「前の記事」「次の記事」はページネーション、「一覧に戻る」は単純に記事一覧のリンクを設定すればいいのですが、戻 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 カスタム投稿で投稿者が表示されてないけど、どうやって表示させるの？     といった方に対する記事となります。 カスタム投稿はデフォルトでは投稿者は表示できない まず通常の投稿の場合ですが、表示オプションを開くと投稿者という項目があります。   しかしカスタム投稿の場合は項目がありません。   なので、ここに投稿者の項目を表示されるようにし ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressの管理画面に表示されてる「投稿」の名前って変更できない？     といった方に対する記事となります。 デフォルトの投稿は「投稿」という名前ですが、これを「ブログ」など変えたい事があると思います。 今回はその方法について解説していきます。 管理画面の「投稿」の名前を変える方法 まずはデフォルトの状態を見てみます。   この「投稿」の名 ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressのおすすめプラグインって何？     といった方に対する記事となります。 プラグインはたくさんあるので迷うと思いますが、実務で使う物は限られていると思います。 これまでの記事でご紹介してきたものを中心にまとめてみたので、ぜひ参考にしてみて下さい。 WordPress案件でよく使うおすすめプラグインまとめ これからご紹介するのは全て案件で使った事があるもので ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressのユーザー名ってどうやって変更するの？     といった方に対する記事となります。 WordPressのログインユーザー名はデフォルトでは変更できませんが、プラグインを使えば簡単に変更可能です。 今回はそのプラグインをご紹介します。 ユーザー名を変更する場所を確認 まずはどこでユーザー名を変更するか確認してみましょう。 管理画面左のメニューのユーザー→プロ ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressのプラグインWP Multibyte Patchって何？     といった方に対する記事となります。 WordPressのおすすめプラグインを調べていると目にすることがあるこのプラグイン。 これについて解説していきます。 WP Multibyte Patchとは？ WP Multibyte Patchとは、日本語版のWordPressで見られ ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 SSLって何？常時SSL化ってどうやるの？ といった方に対する記事となります。 SSLとは？ まずSSLについてですが、簡単に書くとインターネット上でのデータの通信（サイトとサイトを閲覧しているユーザーとのやり取り）を暗号化して、盗み見、盗聴、傍受、改ざんなどを防ぐ仕組みです。 SSL化していないとアドレスバーに「保護されていない通信」と表示されてしまい、一度は目にしたことがあるかと思います。 ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressで固定ページや投稿ページのURLを変更できない？ といった方に対する記事となります。 固定ページや投稿ページのパーマリンクは編集画面で変更できますが、URLをまるっと変える事は通常出来ません。 どういうケースで使うかイメージしにくいかも知れませんが、実務で何度か使った事があるので覚えておいて損はないと思います。   プラグイン「Page Links To」をインスト ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressでカテゴリーの順番って変更できない？     といった方に対する記事となります。 通常カテゴリーの順番を変える事は出来ませんが、プラグインを使えば簡単に変える事が可能です。 プラグイン「Category Order and Taxonomy Terms Order」をインストール まずはプラグインをインストールして有効化しましょう。 右上のキーワード入力欄 ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第10回】カスタム投稿編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 ブログカード作成 記事一覧ページ作成 パンくずリスト作成 個別記事ページ作成 カテゴリーページ作成 今回のWordPressオリジナルテーマの ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第9回】カテゴリーページ編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 ブログカード作成 記事一覧ページ作成 パンくずリスト作成 個別記事ページ作成 今回はカテゴリーページについて書いていきたいと思います。 まずこちらを見て下 ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第8回】個別記事ページ編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 ブログカード作成 記事一覧ページ作成 パンくずリスト作成 今回は個別記事ページについて書いていきたいと思います。 これはWordPressオリジナルテーマの ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第7回】パンくずリスト編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 ブログカード作成 記事一覧ページ作成 今回はパンくずリストについて書いていきたいと思います。 その前にパンくずリストとは何かということについて軽く説明してい ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第6回】記事一覧ページ編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 ブログカード作成 今回は記事一覧ページについて書いていきたいと思います。 記事一覧ページ用のテンプレートファイルを作成 まずはテンプレートファイルを作成しま ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第5回】ブログカード編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 固定ページ作成 今回はトップページに新着3件表示させるという設定で、ブログカードについて書いていきたいと思います。 ブログカードとは？ まずブログカードとは何かということです ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第4回】固定ページ編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 functions.phpからCSSやJavaScriptなどを読み込む 今回は固定ページの作り方について解説していきます。 固定ページの作り方は2つ 固定ページの作り方は2つあります。 テンプレートファイルで作成（page-〇〇.php） 固定ペー ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第3回】functions.php編となります。 前回までに以下の事をやってきました。 ファイルの準備 トップページ作成 前回の記事でトップページをパーツごとに分ける作業は完了しました。 今回はfunctions.phpというテーマファイルについて説明していきたいと思います。 functions.phpとは functions.phpとは各ページのコンテ ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWordPressオリジナルテーマの作り方【第2回】トップページ編となります。 オリジナルテーマを作るのに必要なテンプレートファイルの準備に関しては前回の記事をご参照下さい。 [blogcard url="https://junpei-sugiyama.com/wordpress-original-theme-1/"] front-page.phpにindex.htmlのコードをコピペ まずはトッ ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はhtmlやcssで静的ページの作成が完了し、これからそのファイルを使ってWordPressのオリジナルテーマを作成したい人向けの記事となります。 最初から最後まで書くとボリュームが半端ない事に成るので、何回かに分けて書いていきます。 ローカル環境を構築 まずはローカル環境を構築します。 通常オリジナルテーマを作成する時は自分のPC内でローカル環境を構築することが多いと思います。 ロー ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 コードをまとめてすぐ引き出せるようにしたいんだけど、いい方法ない？     といった方に対する記事となります。 コーディングのスピードを上げる為にはコードの管理が必須です。 その為にはよく使うコードは管理しておく必要があります。 今回は万能ツールNotionを使ってコード管理する方法について解説していきます。 またコーディングスピードを上げるには自作したコード ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 案件が複数あって管理するのが大変・・・何かいい管理方法ない？     といった方に対する記事となります。 1件や2件くらいであれば個別に対応していても問題ないかも知れませんが、4件5件となってくると混乱しそうになってきます。 今回は万能ツール Notion を使って案件管理する方法について解説していきます。 ※Notionは万能ツールと言われるだけあって出来る ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 ずっと営業し続けるのしんどい・・・何もせずに案件を請け続ける事って出来ない？     といった方に対する記事となります。 恐らくこの記事を見ている人は、自分と同じく営業に対して苦手意識を持っている人が多いと思います。 しかし自分は一般的な営業をほとんどせず、この1年間案件を請け続けています。 もちろん何もしてこなかった訳ではなく、一般的ではない営業スタイルだっ ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 コーディングだけで月収30万円くらい目指したいけど、なるべく無駄のない勉強したい・・・どうしたらいいの？     といった方に対する記事となります。 私は37歳になる手前からWeb制作の勉強を始め、現在ではWeb制作のみで生活出来るようになりました。 それまでの経緯については以下の記事に書いてあります。 30代後半未経験でもプログラミング独学で稼げるようになる ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回はWeb制作を始める人がブログも始めた方がいい理由について、書いていきたいと思います。 Web制作を始める人がブログも始めた方がいい理由 自分がブログを書き始めたのはWordPressの勉強を始めた時からですが、同時とは言いませんが出来れば早いうちからブログも始めた方がいいと思います。 ブログを進める6つの理由 知識が定着しやすい 実務で役に立つ 人の役に立つ WordPressに慣れ ...

  こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 WordPressでブログ始めたいけどどうしたらいい？     といった方に対する記事となります。 WordPressでブログを始めるにはまずレンタルサーバーを契約する必要があります。 レンタルサーバーといっても色々ありますが、今回は最もメジャーだと思われるエックスサーバーの契約方法について解説していきます。   エックスサーバーの契約方法 この記事 ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は営業力が0でもコーディングとWordPressのみで月収50万に到達するまでの記録を書いていきたいと思います。 また、この8か月間営業しなくても案件は途切れず受けており、その秘訣も書いてるのでぜひ参考にしてみて下さい。 この記事は営業しなくてもいい方法という内容ではなく、営業力がない人間がどうやって稼いで来れたのか、という内容になります。 ちなみに最高月収を記録したのは2020年11月になります。 ...

こんにちは！フォトグラファー&Web制作のじゅんぺい（@junpei_sugiyama）です！ 今回は、 30代後半からでもプログラミングやWeb制作を独学で勉強して稼げるようになるの？     という疑問をお持ちの方に対する記事となります。 結論から言えば稼げるようになりました。 今回は稼げるようになるまでのプロセスを書いていきたいと思います。 ただしこれが最短ルートとかベストな選択という事ではなく、1人の実体験として見て下さい。   36歳から勉強開始 まずWeb ...