チェックボックスをカウントできるようにしたい

Question

ワードプレスでチェックボックスのカウントを作りたいのですが、上手くできません。

こちらの記事のサンプル1をデザインに、選択したチェックボックスをカウントするようにしたいのです。

CSS、HTML、Javascript、すべて素人なので、他サイトも調べながら参考にして作るのですが、なかなか上手くできませんでした。
利用しているワードプレスのテーマはCocoonです。

恐縮ですが、制作していただけると助かります。

詳しい方、よろしくお願いします。

Comments

[m.ts10806]

「全く分からない」だと得たアドバイスをもとに解決できない、もしくはアドバイスを理解できない、ことになりますので、回答得られにくいかと思います。
分からないなりにやってみたこと調べたことがあるならそれらを提示し、現在起きてる問題を提示した上で0から1，1から2へと一歩ずつ進んでいくのが良いですし、作業依頼でないならそうするしかありません。

[退会済みユーザー]

語弊がありました。申し訳ございません。

[mai1210]

とりあえず現在のコードを質問内に記載してみませんか。※質問は編集可能です。

チェックボックス自体もうまく実装できていない／チェックボックスはできたけどJSはさっぱり／JSも書いてみたけどエラーが出てる

どの状況なのかによって回答が変わってきます。

「制作お願いします」だと丸投げとみなされてしまうので・・・

[退会済みユーザー]

申し訳ありません。このteratailというサービスを誤解して利用していたところがあるかもしれません。改めて自力でやってみたいと思います。

[m.ts10806]

「質問サイト」なので。

[m.ts10806]

そこで退会という手段をとるのは謎。

Answer 1

チェックされたチェックボックスの数を数えたいなら

const len=document.querySelectorAll('[type=checkbox]:checked').length;
console.log(len);