Web制作 コーディング WordPress ノウハウ

【コピペで使える!】コーディング&WordPressメモまとめ集【無料特典あり🎁】

【コピペで使える】コーディング&WordPressメモまとめ集を発売!(無料特典あり)

みなさんこんにちは!コーダーのじゅんぺいです。

この度、知識共有プラットフォームBrainにて、

「コーディング&WordPressメモまとめ集」を発売しました!🎉

Brain販売ページの説明と重なる所もありますが、ここでもこの商品について説明させて頂きたいと思います。

現役コーダーが2年間の実務で実装したコード集、
見たくありませんか?

コード集があれば時間短縮になり、結果的に時給アップに繋がります⤴️

ちなみに人気ランキングで総合1位になりました!

こちらですね。

さらにBrain公式メディアよりインタビューを受け、記事にして頂きました!(画像クリックで記事に移動します)

Web制作で稼げない人の特徴と単価を上げる3つのコツ

もう買う気満々の人はこちらからBrainの商品ページにアクセス可能ですが、注意事項などもあるのでご購入前に商品説明などはしっかりとお読み下さい🙇‍♂️

今だけ!購入者特典あり🎁

コーディング&WordPressメモまとめ集

🎊569部突破🎉

コーディング&WordPressメモまとめ集とは?

まず商品を簡単に説明すると、

「2年間の実務で書き溜めたコーディングとWordPressに関するメモまとめ集」

となります。

そのメモとは、万能ツールNotionを使ったメモになります。

Notionを使ったコード管理に関してはこちらの記事を参照下さい。

Notionを使ってコード管理をする方法

基本的に実務で使った事があるものだけをまとめているので、ただのコード集ではなく、

「1人のコーダーが2年間の実務でどんな実装をしてきたのか」

が分かります。

 

レビューのご紹介

累計569部販売
クチコミ292件(平均スコア

レビューの数が多すぎて全部はご紹介出来ませんが、ここで一部をご紹介します。

全部見たい方は商品ページでご確認下さい🙇‍♂️

実務で使った2年分のコーディング&WordPressメモまとめ集

 

またTwitterでのレビューはこちらの記事を参照下さい。

【メモまとめ集】Brain購入者レビューまとめ

 

 

Brainで販売しようと思った経緯

今から1年前、このようなツイートをして結構反響を頂きました。

以前はBoost Noteというツールを使ってコード管理をしていたのですが、全てNotionに移行してからはずっとNotionを使っています。

そしてこのNotionにまとめたコードスニペット集をある方に見せたら、

インフルエンサー

じゅんぺいさん、それ売れますよ。

マジですか

というやり取りがあったのもちょうど1年前になります。

それから販売まで1年以上かかった理由は、

  • 自分が分かればOKという感じで人に見せられた物ではなかったから

  • そしてボリュームが膨大すぎて整理するのがめんどうだったから

となります。

そして整理するのが大変過ぎるので目を背けていたのですが、2ヶ月前に恐る恐るこちらのツイートをした所、これまた結構な反響を頂きました。

 

以前実装した物をまた何時間もググった経験ありませんか?

Web制作においてググるという行為は必須で、ググらない人は皆無だと思います。

しかし、以前実装した物をまたググるのは時間の無駄です。

とは言っても、簡単な物以外は覚えていられないと思います。

そこで多くの人は参考になったブログをブックマークしたり、実装したコードをまとめておき、次に同じ物が出てきたらすぐ実装出来るようにしています。

しかし今度は、

大量のブックマークから探すのがしんどい

という経験もあると思います。

もう「ブックマークから探すよりググった方が早いんじゃないか」と思うほど。

 

ググるのが大変な理由

なぜ同じ事をググるのが大変かというと、欲しい情報が見つかったブログでも細かすぎて必要のない情報も沢山含まれているから。

というのが1つの理由になります。

もちろんブログの場合は「実装するコードだけ」では不親切なので、細かい解説や付随する情報があった方がいいですが、時には

コードだけ分かればいいんよ

という事もあると思います。

しかし、逆に「情報が省略されていて参考にならない」という事も多々あります。

これらを解消するには、

  • 自分が欲しい情報だけまとめたメモを作る
  • 足りない情報を追加してコピペ出来るようにする
  • そのメモをすぐ探せるように整理しておく

というのが必要になります。

もちろん他人のメモではなく自分でまとめたメモがベストですが、先ほどのツイートのリプにも、

と言ってくれる方が思いのほか多かったので「自分だけ分かればいいや」と思って書き溜めた2年分のメモを、他の人が見ても分かるように整理しました。

 

Brainの内容について

それでは本題に入ります。

以下の4点について書いていきます。

  1. この商品の対象者
  2. Web制作で単価を上げる方法
  3. 活用方法
  4. 注意点

 

この商品の対象者

このコーディング&WordPressメモまとめ集は、私と同様にコーディングやWordPressのオリジナルテーマ制作をしている方を対象としています。

なのでWordPressでもSnow monkeyなどの有料テーマでノーコード、ローコード中心に制作している人は存分に活用する事は出来ないかと思います。

またWordPressはオリジナルテーマ化をしたことが無く、カスタム投稿やカスタムタクソノミー、タームなどが全く分からない状態だと使い方が分からないと思うので、

実務経験はあるけど何度も同じこと調べるのがしんどい
何となくは理解出来るけどもっと楽したい

という方向けになっています。

極力コピペで済むようにまとめてありますが、使う場所と意味が分からないと活用出来ないので、ある程度は自分で考える必要はあります。

当然デザイン通りにするにはカスタマイズする必要もありますからね。

なので以下に該当する方にはおすすめしません。

おすすめしない人

  • コーディングの勉強を始めたばかりの方
  • WordPressオリジナルテーマ制作をする予定のない方
  • コピペだけで何も考えず実装出来ると思っている方

ただ今はノーコード制作しかしていなくても、今後オリジナルテーマで制作をしたいと思っている方は役に立てられるかと思います。

また、見出しやボタン、アニメーションのサンプル集を見て、

CSSだけでこんな事できるんだ!

と感動するかも知れませんが、

実務ではほぼ使いません

ポートフォリオなどで凝った装飾をしたい場合は参考になるかも知れませんが、実務で使うことはほぼありません。

なので実務ではまず使わないようなマニアックな実装はあまりなく、各セクション上から順に使う頻度が高い物を書いています。

なので、

実務でどんな実装するのか分からなくて、いつまでも勉強が終われない。
頻出する実装を知りたい。

という方にもおすすめです。

内容の一部を書くと、

  • コピペで使えるWordPressの各テンプレート
  • 実務でよく使う見出し一覧
  • 実務でよく使うテキストのhoverアニメーション
  • 実務でよく使うボタン内の矢印9種類
  • Contact Form7の色々・・・

などなど、実務で役立つものが沢山あります。

 

Web制作で単価を上げる方法

方法は大きく分けて2つあります。

  1. 単価を上げる
  2. 時給を上げる

ここの時給を上げるというのは、時給制の単価を上げるという意味ではなく、作業時間を短くすることです。

2000円の仕事を2時間で終わらせれば時給1000円ですが、1時間で終われば時給2000円になりますよね?

コーディングで作業時間を短くするには作業効率を上げる必要があります。

そして作業効率を上げる方法は大きく分けて2つ。

  1. コーディング速度を上げる(Emmetやスニペットを使う)
  2. コピペ出来るコード集を使う

今回販売するのはに該当します。

この教材が約1万円で仮にあなたの時給が1000円だとすると、10時間節約しただけで元が取れます。

ただ時給1000円だと東京都の最低賃金を下回るので、時給2000円くらいだとすれば5時間節約しただけで元が取れます。

そしてそれ以降節約できた分は、単純に収入アップになります。

実装方法が分からなくて何時間もググったことありませんか?

もし実装に1時間かかった物が数分で終わっていたとしたら・・・

その積み重ねが収入アップや時間を作る事に繋がります。

 

活用方法

コードは「なるべく自分が楽できるように」をモットーにまとめているので、コピペで実装出来る物が多いです。

全部書くと長くなるものについては省略しているので、詳細はCodePenやブログでご確認下さい。

そして主な活用方法は以下の2つになるかと思います。

  1. 参考になったコードを自分のNotionなどにまとめる
  2. コードのまとめ方自体を真似する

人によって使う物は全然違うと思うので、このメモまとめ集を参考に自分だけのメモを作っていきましょう!

 

注意点

このメモまとめ集はコーディングやWordPressを完全網羅!という物ではなく、あくまでも私個人が2年間の実務の中で実装したコードを集めた物になります。

なので、

これ1つでコーディングとWordPressは完璧!

という訳ではなく、

実務で実際に使ったコードが知りたい

という方が主な対象になります。

また、このメモまとめ集には当ブログで詳しく解説しているものもあります。

しかしブログには技術記事以外も結構あり、大量の記事から探すのが面倒だったり、

説明はいらないからとりあえずコードを見たい

という人も多いと思います。

先に結論を言って欲しいタイプですね(私もそうです)

特にWordPressに関しては、ブログには書いてないけど非常によく使うコードも多いです。

トップページに新着一覧、カスタム投稿の新着一覧

→カテゴリーの指定方法、タームの指定方法

→PCでの表示数指定方法、SPでの表示数指定方法

固定ページでページネーションを実装する方法

ACF、SCFの出力方法

などなど。

なので、

  • ブログにしか書いていない物
  • Notionにしか書いていない物
  • 両方に書いている物

と混在しています。

なのでメモまとめ集を見て、

ブログのリンク貼ってるだけじゃん

と思う方はご購入をお控え下さい(リンク貼ってるだけの項目もあります)

逆にいずれブログに書く項目もあると思いますが、その時に「ブログに書くなら買わなければ良かった」と思う方もご購入をお控え下さい。

ちなみに書きたい事が大型連休最終日の高速道路の如く渋滞しているので、書けるのはいつになるか分かりません。。。

またブログから探すより、実装するコードがまとまっているだけでも価値があると思います。

こちらが実際の画面↓

もちろん階層になっている項目もあるので、実際はもっとあります。

 

このメモまとめ集は「未完成」です

このコーディング&WordPressメモまとめ集は未完成です。

未完成というより、私がWeb制作をやめない限り随時増えていく予定です。

いつまでも完成しないサグラダファミリアみたいな物です。

実はこの2年間で実装したものも全て載せられている訳ではないので、まだ整理し切れていない物も含め不定期に更新していきます。

もちろん一度購入すれば追加料金はかからないのでご安心ください。

 

Brainの紹介料(アフィリエイト)について

Brainには紹介料といういわゆるアフィリエイト制度があります。

多くの人が紹介料50%で購入者じゃなくても紹介料を貰える設定にしていますが、このBrainは紹介料20%、紹介料が貰えるのは購入者のみに設定しました。

その理由としては、

  • 紹介料目当てで購入する人がいるかも知れない
  • 紹介料の為に過剰なレビューをする人がいるかも知れない

でも純粋に内容に惹かれて購入した上で紹介してくれた人には紹介料をゲットして欲しい、という気持ちの間を取った感じです。

また、紹介料はずっと20%に設定するので、ご自身のブログなどでご紹介してそこから購入されれば紹介料をゲット出来ます(私もこのブログでBrainを紹介して何度か紹介料を頂いています)

もしご自身のブログなどでご紹介頂ける場合は、この記事のサムネイルは特別にDLして使って頂いて構いません。

DLしたサムネイルについて

・紹介以外の用途では使用しないで下さい(紹介以外の用途はないと思いますが)
・他の記事の画像は当然DL禁止です
・画像の加工はしないで下さい
・紹介用に使用して頂くのに特にご連絡は不要です

 

【期間限定】購入者無料特典 🎁

最後に購入者特典についてです。

Notionはコード管理以外にも色々な使い道があります。

今回の特典は以下になります。

🎁 Notionを使ったポートフォリオのサンプル
🎁 WordPress案件の見積もり方法
🎁 案件管理表 / 課題・修正管理表
🎁 デザインカンプを貰って最初に確認する事リスト
🎁 お役立ちブックマーク集

 

Notionを使ったポートフォリオのサンプル

初案件前に一生懸命作成したポートフォリオ、使ってますか?

私は初案件の頃以降は一切使っていません。

正直実績がたまってきたらNotionに実績を並べておくだけでいいと思っているので、Notionを使ったポートフォリオのサンプルをお付けします(すごく簡単な物です)

 

WordPress案件の見積もり方法

このくらいの案件ならいくら位にしますか?

とよく相談されますが、いくらになるか分からないのは自分の料金表を持っていないからです。

以前見積もりを提出した際、

じゅんぺいさんの見積りはいつも詳細まで書かれていますので、非常に参考になります!

と言われたことがあります。

見積もりは全体で「◯◯万円です」とざっくり言うのではなく、細かく伝える事で相手も納得しやすくなります。

と言うことで、これはNotionの新しい使い方と言う訳ではありませんが、知りたい方も多いかと思います。

 

案件管理表 / 課題・修正管理表

これは進捗管理などになります。

複数の案件を同時進行していると、どの案件がどういう状況なのか把握出来なくなってきます。

そこでNotionを使えば簡単に整理する事が出来ます。

作り込めば色んな事が出来るNotionですが、今回は非常にシンプルな管理表をお付けします(2つ表がありますが、基本的な使い方は同じで項目が少し違います)

サンプルでいくつか項目が書いてありますが、もちろんご自身の環境に合わせてカスタマイズして頂ければと思います。

 

デザインカンプを貰って最初に確認する事リスト

これはデザインカンプを貰ってコーディングを始める前に確認する事のリストです。

事前に確認しておかないと自分が困る事になるものが多いので、最初にしっかり確認しておきましょう。

 

お役立ちブックマーク集

参考になるサイトを全部載せたらキリがないので、主にジェネレーターなどのツール系をまとめました。

恐らくご存じのサイトもあるかと思いますが、参考になればと思います。

 

注意事項

※ 購入者特典の受け取り方法は、購入後の本編に記載しています(この記事には書いていません)

※ 購入者特典は予告なく終了する場合があります。

 

購入する前の注意点⚠️

注意点がいくつかあります。

⚠️ 年に1回も使う機会がない項目も恐らくあります
⚠️ 何も考えずにコピペするだけでは活用出来ません
⚠️ ググればすぐ分かるものもあります
⚠️ 既にご自身でコードをまとめている方は不要かと思います

もう一度書きますが、これは「2年間の実務で実装したことがあるコード」がほとんどで、使う頻度が高い物から順に書いています。

なので、使った事もないマニアックな実装は載せていません。

また、WordPressの項目は全て販売を決めた後に十分な動作確認をしていますが、メモ通りに書いたのに動作しなかったといった場合などのサポート対応はしていません。

もし上手く実装出来ない場合は、

  • 変なスペースが入っていないか
  • パスが間違っていないか
  • テンプレートファイル名が間違っていないか

などご確認下さい。

カンマ1つ抜けただけで動作しない所もあります。

CodePenがある物に関しては、もしうまく実装出来ない場合は、

  • jQuery本体を読み込んでいない
  • 必要なプラグインを読み込んでいない
  • スペルミス、閉じタグ抜け

などご確認下さい。

その辺をご理解頂いた上でのご購入をお願い致します🙇‍♂️

最後に

ここまでお読み頂き誠にありがとうございました😊

販売部数によって少しずつ値上げするかも知れませんが、LPのコーディングが安くても3万円と考えればすぐ回収出来るはずです。

それでは冒頭にもありましたが、こちらからBrainの販売ページへどうぞ!

今だけ!購入者特典あり🎁

コーディング&WordPressメモまとめ集

🎊569部突破🎉

 

おまけ

私と同時にBrainを発売した方がいまして、もし以下の悩みがある方は・・・

  • 低単価に苦しんでいる
  • 案件が獲得出来ない
  • フリーランスになったけど心配

こちらの教材がおすすめです。

ここあの1ヶ月ココナラチャレンジ ココナラ 0→1 スタート1ヶ月で77万円 2ヶ月で165万円納品した全てを公開します!!

個人的にも仲良くさせて貰ってる方なんですが、低単価という印象が強いクラウドソーシングの1つ、ココナラで凄い成果を出した秘訣が全て書かれています。

しかも自ら提案する事はなく、全て受身で受注していたというのが驚き。

教材としてはちょっと高いと感じるかも知れませんが、

  • 低単価から抜け出せる
  • 営業で消耗しなくなる

この2つがずっと解消されるなら、一瞬で回収出来ると思いませんか?

ココナラ0→1スタートで1ヶ月で77万円。2ヶ月で165万円納品した全てを公開します

-Web制作, コーディング, WordPress, ノウハウ