皆さんこんばんは(^o^)1週間が始まりましたね。 今日は制作現場でもよく使うjQueryの使い方をご紹介します。 jQueryはライブラリを読み込み利用しますが今回は割愛します。 ▼変数定義について 慣習上、変数の冒頭に$をつけます。 const $input = $("input")…
【JavaScript】ローカルストレージを使ってメールアドレスを保存しよう
皆さんこんばんは(^o^) 今日は夏を彷彿させる暑さでしたね・ω・ 体調を崩しやすい季節なので体調管理には気をつけていきましょう。 今日はお問い合わせフォームなどでよく使われているCookieえを保存する方法を ご紹介します。 先ずはindex.htmを用意します…
1週刊がやっと終わりましたね(^o^) 今週は忙しい日々でくたくたです(笑) さて今日はJavaScriptを用いてリストを生成する方法をお伝えします。 まずはindex.htmlを用意します。 index.html <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </meta></meta></meta></head></html>
最近仕事が忙しく今日もギリギリの更新になってしまいました。 これから寒くなっていくので体調には気をつけていきましょう! 今日は画面をロードするごとに画像が切り替わる仕組みをお伝えします。 まず画像を3枚用意してください。種類はなんでもOKです。 …
楽天ブックス こんばんは。今日も雨が振りましたね。 ただ秋に突入しだんだんと過ごしやすい気候になってきました。 さて、今日は少し難しいのですがAjax通信を用いたコードを展開します。 まず2つファイルを用意します。(コピペしてお試しください) cakes.j…
おまたせしました!今日はPug編の2回目です。 今日はPugを使った基礎的な記法をご紹介いたします\(^o^)/ 1回目では環境構築の記事を書いているのでまだの方はぜひ見ておいてください! frontendblog.hatenablog.com まずはフォルダにsrc/pug/というディレ…
こんばんは!今日は一日雨でジメジメした日が続きますね。 まだ週初めなので頑張っていきましょう! さて、今日は JSファイルをモジュールとして呼び出す方法を 紹介します。 まずは下記階層のフォルダを用意してください。 dist └index.html └js └script.js…
今日は簡単なタイマーを作ってみようと思います。 先ずはHTMLファイルをご用意ください。 <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>timer</title> <style></style> </head> <body> </body></html>
こんばんは!今日も雨で毎日ジメジメしてますね。 さて、今日はチェックボックスにチェックをいれたらボタンを押せる仕組みを作りたいと思います。 よく問い合わせの送信フォームにあるやつですね\(^o^)/ まずはHTMLを用意しましょう! <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> </meta></meta></head></html>
皆さんこんばんは(^^)今週ずっと雨で寒い日が続いてますね。 今日はHTMLを効率的に書く方法をお伝えします。2回に分けて紹介するのでぜひお試しください。 HTMLを効率的に書く方法としてPugという記法があります。 閉じタグを意識せずにかけるのでコーディン…
皆さんこんばんは。今日はずっと雨で肌寒い日が続いてますね。 今日はwordpressで共通のテンプレートファイルを作る方法をご紹介します。 wordpressで構築をしていると何度も同じ記述はナンセンスです。 そこで共通ファイルを作成するにあたり一つディレクト…
今日は実際にキーボードで打った文字を画面に出力するプログラミングをご紹介します。まずHTMLファイルをご用意ください\(^o^)/ ※コピペしてHTMLファイルに貼り付けてください。 <html> <head> <meta charset="utf-8" /> <title>タイピング</title> </head> <body> <div id="target"></div> </body> </html> これでHTMLファイルは完了です。 次にbodyの閉じタグ前…
今日は画像やURL設定時によく使うテンプレートタグの紹介です。 WordPressではディレクトリを明示するタグがあります。 ▼ページリンク設定 href = "/○○○/○○○" このようにタグの後ろにディレクトリを明示することでリンクの設定が可能です。 ▼画像の表示 src …
WordPressで投稿日時を表示させるテンプレートタグをご紹介します。 投稿日時を表示させるタグはいくつかありますが下記をよく利用します。 the_timeをよく利用します。 パラメータには引数を取りget_optionメソットで日付の表示形式を取得します。 詳しく…
皆さんこんにちは(^^)今日はWordPressでよく使う構文でループというものがありご紹介したいと思います。 ざっくり構文はこんな感じです。 <p></p> またここで重要なのが`the_post()`を必ず記述するということです。記述しないと無限ループとなりやがてブラウザが落…
WordPressでは投稿があるかないかを判別してあれば投稿をだすことができる構文がある。下記は基礎的な内容のため理解は必須。 投稿があればここが表示される投稿がないときはここが表示される お名前.com ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 月額968円からの…