WordPressでカテゴリを別の方法で分類しますか?
最も WordPressテーマ すべてのカテゴリ アーカイブ ページに同じスタイルを使用します。 ただし、コンテンツが豊富な Web サイトをお持ちの場合は、カテゴリごとに異なる表示を選択して、その可能性を最大限に引き出すことができます。
このチュートリアルでは、WordPressブログでカテゴリを異なる方法で表示する方法を示します。
それ以上の苦労なしに、私たちはあなたに私たちのリストを発見することを勧めます。 ただし、最初に、WordPressをインストールしたことがない場合は、 WordPressのブログ7の手順をインストールする方法 et あなたのブログにワードプレスのテーマを、見つけインストールしてアクティブにする方法
それから私たちがここにいる理由に戻りましょう。
WordPressのカテゴリに異なるスタイルを付ける理由
先に述べたように、ほとんどの場合、 WordPressテーマ 各カテゴリのアーカイブ ページに同じテンプレートを使用します。 これは、開発者が WordPressテーマ Web サイトでカテゴリをどのように使用するかわかりません。
また読みます: 唯一のWordPressの上のユーザにRSSコンテンツを表示する方法
ただし、コンテンツが豊富なWebサイトがある場合は、 アーカイブページのレイアウトを変更する カテゴリは、ユーザーがそのページのコンテンツをどのように利用するかに劇的な影響を与える可能性があります。
たとえば、ニュースや雑誌のWebサイトを管理している場合、ローカルニュースカテゴリにローカルアナウンスを表示できます。 天気情報を表示したり、このカテゴリで最も人気のある記事を表示したりできます。
とはいえ、WordPressで個々のカテゴリを簡単にカスタマイズする方法を見てみましょう。
カテゴリーにスタイルを与える方法
WordPressでカテゴリを分類するにはいくつかの方法があります。 カテゴリに異なるスタイルを与える2つの異なる方法を紹介し、ニーズとスキルレベルに最適な方法を選択できます。
WordPressテーマで単一のカテゴリテンプレートを使用する
WordPressテーマは標準のテンプレート階層に従います。 テンプレートファイル名に応じて、WordPressは自動的に適切なテンプレートを選択してページを表示できます。
たとえば、category.phpファイルを探して、カテゴリアーカイブページを表示します。
WordPressでは次のこともできます モデルを作成する 個々のカテゴリ。 カテゴリを分類するとします "Apple違う。 これを行うには、新しいテンプレートファイルをWordPressテーマに追加して名前を付けます。 カテゴリapple.php.
FTPクライアントを使用してWordPressWebサイトに接続し、に移動します。 / WP-コンテンツ/テーマ/あなたのテーマ/ そしてcategory-apple.phpという名前の新しいファイルを作成します。 「Apple」をカテゴリの名前に置き換えることを忘れないでください。
ファイルを使用できます " category.php 出発点としてのWordPressテーマの。 すべてのコンテンツを編集してコピーするだけです。 次に、新しいファイルの名前を「 カテゴリapple.php そして、その中にコードを貼り付けます。
その後、個々のカテゴリモデルに変更を加えることができます。 このカテゴリに別のサイドバーを作成して使用し、全幅のページにすることができます。 ウェルカムメッセージを追加する またはあなたが望むものは何でも。
CSSコードを使用してカテゴリにスタイルを与える
WordPressは、CSSクラスをWebサイトのさまざまな要素に自動的に追加します。 これらには、ボディクラスとパブリケーションクラスの両方が含まれます。
たとえば、カテゴリアーカイブページを表示してから検査ツールを使用すると、CSSクラスの「カテゴリ」と「body」タグ内のカテゴリの名前に気付くでしょう。
このCSSクラスは、個々のカテゴリごとに次の方法で使用できます。 カスタムCSSの追加.
出発点として使用できるCSSの例を次に示します。
body.categoryアップル{背景色:#EEE。 背景:URL(「http://example.com/wp-content/uploads/2017/background.jpg「)固定なしリピート; 色:#FFFFFF; } .category-リンゴ.site {背景:#232323。 } .categoryアップル{色:#CCCCCC。 }
CSSクラスのカテゴリ名をカテゴリの名前に変更することを忘れないでください。
WordPress にカスタム CSS コードを追加できるようになりました。 ただし、カスタム CSS コードを追加するためのプレミアム ソリューションが必要な場合は、以下の 2 つを提供します。 WordPressのプラグイン このタスクに役立つプレミアム。
1。 簡単なカスタムJSとCSS
Ce WordPressのプラグイン プレミアムは、強力な CSS および JavaScript コード エディターであり、Web サイトの任意のセクションに追加できます。 WordPress テーマを大幅に更新した後でも、カスタマイズを維持できます。
パーソナライズされたコードの使用フィールドを制限するオプションがあります。 たとえば、コードはビデオ形式の記事にのみ使用できます。
の記事をご覧ください WordPressの利用規約への同意を要求する方法
または、コードを特定のWordPressテーマに制限できます。 WordPressブログのテーマを現在変更している場合に便利です。
2.ページのカスタムJavaScriptとCSS!
おかげで WordPressのプラグイン、 あなたは付け加えられます CSSスタイル 特定のページのカスタムJavaScript。 また、複数のページのルールを定義することもできます。 このように、特定のセクションに対して事前定義済みまたは一意のスタイルを使用できます。
これが提供する他の機能と同様に WordPressのプラグイン、Web サイトのさまざまなページにさまざまなスクリプトを簡単に含めることができます。
推奨リソース
ウェブサイトの構築と管理に役立つ他の推奨リソースをご覧ください。
- ブログに翻訳システムを追加する8つのWordPressプラグイン
- ブログにカレンダーを作成する5つのWordPressプラグイン
- ブログを介して権限を構築するための4ステップのガイド
- リダイレクトするWordPressプラグイン
まとめ
ここに ! このチュートリアルは以上です。WordPressにカスタムCSSコードを追加できるようになることを願っています。 お気軽に お気に入りのソーシャルネットワークでこの記事を友達と共有する.
しかし、あなたも私たちに相談することができます ressources、インターネットサイトの作成プロジェクトを実行するためにより多くの要素が必要な場合は、 WordPressブログの作成。
提案や意見がある場合は、セクションに残してください commentaires.
...
この素晴らしくわかりやすいチュートリアルをありがとうございました。あなたの記事のおかげで、ページのデザインを変更することができました。
Salutの!
私はスモーキンだからあなたが私を助けることができるかどうか見てください '私の頭
diviとwoocommerceを使用してオンラインストアを行っていますが、カテゴリページをカスタマイズできないため、問題が発生します。
私はあなたが見るためにリンクを渡します:
https://chachocarp.com/product-category/los-mas-vendidos
私が変更したいのは:
1.このカテゴリには24の製品があり、12の製品の9ページに表示する代わりに、9、6、XNUMXのXNUMXページに表示しますが、致命的に明確です。
2.製品にカーソルを合わせたときに、ホバー構成を保持しませんでした。 メインページのストアモジュールのように、透明度を青にし、「商品をナラナジャにする」という文字をお願いします。
3.左側のサイドバーにすべてのカテゴリとサブカテゴリを表示したいと思います。
彼はどうやってそれをしましたか?
マーシーは、トンの補佐官を注ぎます
こんにちはミゲル、
WooCommerceまたはDiviに関する記事で質問してください。 そして、私があなたに答えるのは喜ばしいことです。 😉