【ha-Basic】テーマを使ったサイト例　その２

今見ていただいているサイトはなるべく余分なものを追加せずに【ha-Basic】テーマのデフォルトに近い形にしておきたいので、私が管理している別のサイトで、【ha-Basic】を使ったサイト例を紹介します。

もともと【ha-Basic】は余分なものをそぎ落としたシンプルテーマですが、ちょっと手を加えるとまったく違ったイメージのサイトができます。

この記事の仕様を用いたサイトは

金魚・熱帯魚・海水魚を飼育しよう！

金魚・熱帯魚・海水魚を飼育しよう！

https://momosiri.nagoya/aqua/

金魚・熱帯魚・水草・海水魚など水槽飼育の方法をご紹介

※リンク先サイトの状態は2019年6月17日現在のものですので、ご覧いただいた時には変更している可能性があります

サイトで使用しているプラグイン

特別なコンテンツに使用しているプラグインのみ紹介します。

「Content Cards」

内部・外部リンクをカード表示するために使用しています。このプラグインを使ったカードのデザインはあらかじめ【ha-Basic】テーマに設定してありますので、URLをショートコードで囲むだけでカード表示できるようになります。

Knowledge Base

Wordpressで内部・外部リンクをカード化できるプラグイン「Content Cards」

https://www.momosiri.info/wppi/content-cards/

「Content Cards」は本当にオプション項目が少なく、ショートコードでリンクを作成するだけでカード表示されるという機能だけに絞ったプラグインで、リンクをカード化したいけどできるだけシンプルにし

Q2W3 Fixed Widget

サイドバーの一番下にある人気記事ウィジェットを追従表示（スクロールしてもずっと表示されるウィジェット）させるために使っています。

ひまあーとのWordpressサイト制作工房

ひまあーとのWordpressサイト制作工房

https://momosiri.com/1056/

Wordpressのテーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

Unlimited Background Slider

トップページ以外の背景スライダーに使用しています。

Knowledge Base

Wordpressで背景にフェードイン／アウトする複数の画像を表示できるプラグイン「Un...

https://www.momosiri.info/wppi/unlimited-background-slider/

「Unlimited Background Slider」はサイトの雰囲気を出す上で重要な背景画像を複数設定し、フェードイン／フェードアウトさせながら一定時間毎にどんどん入れ替えることができるプラグイ

【ha-Basic】テーマのカスタマイズ内容

【ha-Basic】テーマのカスタマイズ記事で紹介している方法をいろいろ使ってサイトのデザインやコンテンツをカスタマイズしています。各内容はリンク先ページをご覧ください。

全体の配色は

ひまあーとのWordpressサイト制作工房

ひまあーとのWordpressサイト制作工房

https://momosiri.com/1175/

Wordpressのテーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

本文とサイドバー、サイトタイトルを若干透過にして背景のスライダー画像が何となく背景に表示されるようにしています。

トップページ上のサイトイメージは視差効果のある画像ではなく、slick.jsを用いたスライダーにしています。

ひまあーとのWordpressサイト制作工房

ひまあーとのWordpressサイト制作工房

https://momosiri.com/701/

Wordpressのテーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

ナビゲーションメニューホーバー時にサブメニューをふわっと表示するようにしています。

ひまあーとのWordpressサイト制作工房

ひまあーとのWordpressサイト制作工房

https://momosiri.com/984/

Wordpressのテーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

広告についてはウィジェットへの挿入と、本文下のダブルレクタングル表示は

ひまあーとのWordpressサイト制作工房

ひまあーとのWordpressサイト制作工房

https://momosiri.com/912/

Wordpressのテーマ【ha-Basic】の配布、テーマカスタマイズの方法のご紹介など

その他細かい調整はしていますが、基本的に【ha-Basic】と数種のプラグイン、このサイトで紹介しているカスタマイズ方法を元にして作成していますので、【ha-Basic】テーマを使ったサイトのデザイン例として参考になれば幸いです。

いつでもご相談・お見積りの依頼を受け付けています

Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。

※一度もココナラを使ったことがない方はココナラへの無料登録が必要です。こちらから登録後、上のリンクをクリックする、またはココナラトップページから「ひまあーと」を検索してお問い合わせください。

関連記事

【ha-Basic】テーマを使ったサイト例

基本的に【ha-Basic】と数種のプラグイン、このサイトで紹介しているカスタマイズ方法を元にして作成したサイトの例を紹介します。【ha-Basic】テーマを使ったサイトのデザイン例として参考になれば幸いです。