リオラボ
icon
【サンプル】WordPress自作テーマで目次を作る方法 階層化/ネスト【プラグインなし】

Posted on 2024-09-24 | Category: WordPress

この記事ではWordPress自作テーマで目次を作る方法を解説しています。 サンプルコードを紹介していますが、WordPressの投稿に目次を自動生成する機能です。見出しタグ(h2~h6)から目次を自動生成するようになっ […]

WordPress ブログカードの埋め込み(iframe)を無効化してカスタマイズする方法

Posted on 2024-09-21 | Category: WordPress

この記事では、WordPressブログカードの埋め込み(iframe)を無効化して、自分でブログカードをカスタマイズする方法について解説しています。 WordPress標準のブログカードは埋め込み(iframe)形式とな […]

【サンプル】WordPressギャラリースライダー作成方法【プラグインなし】

Posted on 2024-09-20 | Category: WordPress

この記事ではWordPressでギャラリースライダーを作成する方法を紹介しています。以下で実際の動作を確認できるサンプルがありますが、写真をギャラリーのようにスライダー形式で表示したく作成しました。テキストやリンクを入れ […]

【テンプレ集】WordPressフッター作成方法&サンプル【自作テーマ/Bootstrap】

Posted on 2024-09-20 | Category: WordPress

この記事ではBootstrapを使ったフッター(footer.php)の作成方法と、サンプルとしてテンプレート集を紹介しています。 WordPress自作テーマ全体の作成方法については以下の記事を参照ください。 【サンプ […]

【Bootstrap】 ヘッダー・フッターを固定、スクロール追従にする方法【サンプルコード】

Posted on 2024-09-20 | Category: WordPress

Bootstrapを使ってヘッダー(ナビゲーションバー)やフッターを固定したりスクロールに追従させる方法を紹介しています。Bootstrapでナビゲーションやフッターを作った際、デフォルトではその要素は固定や追従はされま […]

【テンプレ集】WordPressヘッダー作成方法&テンプレート集【自作テーマ/Bootstrap】

Posted on 2024-09-19 | Category: WordPress

この記事ではBootstrapを使ったヘッダーナビ(ナビゲーション)の作成方法と、サンプルとしてテンプレート集を紹介しています。 ヘッダーの構成は基本的にヘッダーナビゲーションとヒーローセクションから構成されます。ここで […]

【サンプルテーマ配布】WordPress自作テーマの作り方完全版【Bootstrap活用】

Posted on 2024-09-14 | Category: WordPress

この記事ではWordPress自作テーマの作り方完全版ということで、自作テーマの基本から実際の構築方法について詳しく解説しています。また、サンプルテーマを配布しているのでそれをベースに自分だけのテーマ作りに挑戦してみてく […]

Bootstrapの使い方&自作テーマで最低限必要な知識【WordPress】

Posted on 2024-09-12 | Category: WordPress

Bootstrapは、あらかじめ用意されたクラス名を利用するだけで、簡単にレイアウトやデザインを作成できる便利なフレームワークです。特に複雑なコードを書くことなく、直感的にボタンのデザインを整えたり、上下左右の余白を設定 […]

Bootstrapを使ってWordPressフッターを一瞬で作る方法【footer.php】

Posted on 2024-09-11 | Category: WordPress

自作テーマ作成中で、とりあえずサクッとフッターを作ってしまいたい場合、Bootstrapの活用をお勧めします。以下のコードではCSSを一切使わず、Bootstrapのユーティリティクラスをフル活用しています。 基本デザイ […]

【テンプレ】Bootstrapを使ったWordPressヘッダーナビの作成方法【自作テーマ/デザイン】

Posted on 2024-09-10 | Category: WordPress

この記事では、WordPress自作テーマにおけるヘッダーナビの作成方法を、実際のサンプルと併せて解説していきます。 記事のポイント 初心者向けに解説:コードをコピーして貼り付けるだけで基本的なヘッダーナビデザインが完成 […]