装飾のためにサイトを巡って得た素晴らしいサンプル

WordPressのバージョンが6.0にアップすると言うこともあり暫くの間フロントページや投稿記事の見直しをしていた。バージョンアップで問題が発生するかなとか、今後のTwentySeventeenの更新で何か不都合が生じるかと思ったけど両方とも心配することも無く今のところ快適な感じだ。

【サイトの装飾】

ボタン式コメント欄
コメント欄を開閉するスタイリッシュなボタンの設置                    

コメント欄が開閉式ボタンでマウスオーバーにてボタンが回転して「クリック」することでコメント欄が表示・非表示と切り替わるユニークなボタン。設定は子テーマの「comments.php」にボタンのコードを張り付けるだけで非常に簡単。
ボタンのCSSはコードをコピーし「style.css」に貼り付けてボタンの大きさや色など、各自の好みに変更可能で当サイトでは変更なく張り付けた。

スイッチ式検索フォーム
スイッチ式検索フォームをCSSで作る!               

このスイッチ式検索フォームは前々から利用させてもらおうとCSSコードをコビーして保存してた。何が素晴らしいかと言うとWordPressの検索フォームを虫眼鏡アイコンで開閉するように見せてること、サイドバーとフッターに貼り付けた。

バウンドアニメーション
文字や要素が弾むバウンドアニメーションのCSSサンプル集          

画像とか文字をバウンドする感じのアニメーションのサンプルをサイトで探していたところ見つけたボールをバウンドさせるアニメーションをカスタマイズした。画像は円形のPNG、ボールにも影を付けて立体的雰囲気を出したかったけど。。。まぁいいっか!

フロントページや投稿記事に装飾で変化を持たせるページ作りの楽しみが倍増かな?!だね。

クリックコメントを閉じる

コメントを残す

メールアドレスが公開されることはありません。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

TOP

Copyrighted Image