Astro を学んでみる(4)
本記事は、書籍「Astro フロントエンド開発の教科書」によるAstroの勉強、4回目です。 記事内のコードは書籍のものではなく、独自に作成しています。 第3章 コンポーネント間連携 3.1 コンポーネントの埋め込み ま […]
Astro を学んでみる(3)
本記事は、書籍「Astro フロントエンド開発の教科書」によるAstroの勉強、3回目です。 記事内のコードは書籍のものではなく、独自に作成しています。 第2章 Astroコーディングの基本 2.1 Astroのコンポー […]
Astro を学んでみる(2)
本記事は、書籍「Astro フロントエンド開発の教科書」によるAstroの勉強、２回目（実質１回目）です。 第1章 Astroを初体験 1.1 Astroとは 1.2 Astroの環境構築 1.3 Astroプロジェクト […]
AHA Stack を試したい(9) Alpine.js編
前回に続いて、Alpine.js について試していきます。 今回のチュートリアルは少し複雑になっています。 完成形としては、入力欄に入力した文字列により下部の要素がフィルタリングされて表示される、というものです。 まずは […]
AHA Stack を試したい(8) Alpine.js編
前回のAlpine.jsのコードを元に、要素の範囲外をクリックした時にも非表示にするコードを試しました。 追加したのはpタグに 「@click.outside="expanded = false"」を追加したことです。 […]
Lightning 無料版 投稿者を非表示にする
WordPressテーマ「Lightning」の無料版で投稿者を非表示にする方法です。 投稿者を含む要素は下記のようになっています。投稿者名とアイコンをまとめて非表示にしています。
Lightning 無料版 copyrightを消す方法
Lightning 無料版 copyrightを消す方法です。 正確には非表示にしているだけです。 フッター部分のコードは下記のようになっていますので、外側の要素であるDIVタグを指定し、子要素であるPタグの次のPタグを […]
AHA Stack を試したい(7)
Alpine.jsのサンプルコードと組み合わせてみます。 以前試した、コンテンツの表示・非表示を切り替えるコードの中に、Increment, Decrementを入れてみます。 ブラウザで確認。 「Toggle Cont […]
AHA Stack を試したい(6)
AHA Stack チュートリアル チュートリアルの中で一番簡単な「A little example」を試してみます。 フロントエンド UIをコンポーネントとして作成しています。 コード上部の---で囲まれた箇所はAst […]