コーディング
施工系会社リニューアルコーディング
ローディングアニメーションの実装
ページにアクセスしたときのローディングアニメーションを実装しました。
実際の案件で使用したローディングアニメーションのデモです。アクセスすると、ロゴのマークとロゴが表示され、ロゴのマークが2回転するアニメーションが発動します。その後、黒背景が剥がれるアニメーションが発動し、本文が表示されます。
スクロールボタンの実装
クライアント様からのご要望でスクロールを促すボタンをクリックしたくなるとのことだったのでJavaScriptで実装しました。このサイトのページ右下にも同じものを実装しているので、ぜひクリックしてみてください。クリックすると画面の高さ分スクロールします。画面の高さ分スクロールしていることは下記デモで確認ができます。またフッターエリアに入ると白色のページトップボタンに変化します。
スクロールを促すアニメーションにクライアント様からのご要望で「クリックをしたら画面の高さ分スクロールする機能」を実装しました。またフッターエリア内ではスクロールボタンがページトップボタンに変化します。
スクロールアニメーションの実装
ページをスクロールして画面に入ってきた要素をフェードインさせるアニメーションを実装しました。
ヘッダーにドロップダウンメニューの実装
ドロップダウンメニューのソースコードを紹介しています。この記事を参考にすれば、自身のWebサイトにドロップダウンメニューを追加したり、自身のオリジナルのドロップダウンメニューを作るヒントになります。
カスタマイズ・実装
週間・月間別ランキング機能の実装
WordPress Popular Postsプラグインで作成しました。
タブ切り替えの実装
実務経験で作成したタブ切り替えのデモです。HTML/CSS/JavaScriptを使用しています。
カスタム投稿タイプ「コラム」とコラムカテゴリー一覧ページの作成
functions.phpから作成しました。
コラム詳細記事サイドバー著者画像を管理画面から変更可能に
Smart Custom Fieldsプラグインを使用して、管理画面からカスタム投稿タイプコラム詳細ページのサイドバーに著者画像を設定できるようにしました。
GoogleフォームをWP MW Formプラグインのフォームで作り替えました。
比較サイトカスタマイズ
参考サイトに合わせてcssの調整をしました。
カスタムHTMLで管理画面から更新されていたものをPHPファイル化しました。
修正・その他
WordPressDiviテーマのエラーの修復
記事が更新できない、テーマエディタがローディング状態から戻らない状態を修復しました。テーマをバージョンアップしたら修正されました。
WordPressセキュリティ対策
ContactForm7のデザイン修正とメールの設定
横幅の修正、ヘッダーの修正、ハンバーガーメニューの作成。
不揃いになっている画像の大きさの修正。
スライダー不具合(勝手に動く、矢印のデザイン)修正
パンくずリストの不具合修正 など。
