GSAPを使って、初心者でも簡単にウェブアニメーションを実装できます。左右に動かしたり、フェードイン、回転させたりするアニメーションを紹介しています。
WordPressを中心としたwebに関する情報を備忘録的に配信しております。
カササギ 40歳 男性 A型 東北地方在住の一児の父。 現ディレクター/webデザイナー アルバイトを経て正社員に昇格、その後デザイナー、ディレクター、統括などを経験。業界歴18年(アルバイト期間含む)
GSAPとは?初心者でも簡単に使えるウェブアニメーションの基本
GSAPを使って、初心者でも簡単にウェブアニメーションを実装できます。左右に動かしたり、フェードイン、回転させたりするアニメーションを紹介しています。
スクロールに合わせて背景が拡大するアニメーションをGSAPで簡単に作る方法
スクロールに合わせて背景が拡大するWebアニメーションを作ってみませんか?初心者でも簡単にできる、GSAPとScrollTriggerを使ったアニメーションの作り方を解説しています!
ウェブサイトの利便性を向上させる方法を解説します。スクロールに応じてヘッダーの表示/非表示を切り替え、ページ上部へ戻るボタンを実装することで、ユーザー体験を向上させましょう。
今回は、HTML、CSS、JavaScriptを使って、スクロールに応じて背景色と文字色を変更する簡単な方法を紹介します。
WEBサイトを彩るアニメーション!動く円や形が変わるアニメの作成方法
今回は、1つは水平と垂直のライン上で円が動くアニメーション、もう1つは形を変えるアニメーションです。
[JavaScript + CSS]ランダムな背景色と角丸を持つボックスを作る方法
今回の記事では、初心者の方でも簡単に理解できるように、HTML、CSS、JavaScriptを使って、ランダムな背景色と角丸を持つボックスを作成する方法を紹介します。
[JavaScript]ちょっと変わったテキストアニメーションを実装する方法[GSAP]
今回は、文字が一文字ずつ表示されるアニメーションを実装する方法について説明します。 この記事では、HTML、CSS、JavaScriptを使用して、文字がぼやけて拡大から縮小されるアニメーションを実装します。
[WordPress]投稿画面に予約投稿のURLを表示する方法
今回の記事は「パーマリンクの設定」が 違う場合、上手く稼働しないケースもございますのでご注意下さい。
[WordPress]予約投稿のURLを記事一覧ページに表示する方法
WordPressの予約投稿URLの確認が手間に感じることはありませんか?今回の記事では記事投稿一覧ページに表示させる方法をご紹介します。
今回の記事では、JavaScriptを使用して数字を0から9999までカウントアップするアニメーションを実装する方法について解説します。
魅力的なウェブデザインを実現!CSSとJavaScriptで動くボックスを作る方法
今回は、ウェブページに動くボックスを配置する方法を紹介します。 CSSとJavaScriptを使って楽しく学びながら、視覚的に魅力的なアニメーションを実現します。
JavaScriptで複数セクションの背景色をランダムに変えるアニメーションの作り方
前回の記事に引き続き、JavaScriptを使用して複数のセクションにランダムな背景色を適用する方法を紹介しま
JavaScriptで簡単!ランダムに変わる背景色アニメーションの作り方
今回はJavaScriptを使用して定期的に背景色をランダムに変更する方法を紹介します。少し変わったwebサイ
GSAPを使って横スクロールとセクションのアニメーションを実装する方法
近年、ウェブデザインにおいて動きやインタラクティブな要素を取り入れることが増えています。今回は、GSAP(Gr
今回はwebサイトの作成にはあまり役に立たないかも知れませんが、ちょっとおもしろいコードを作ってみましたので紹介したいと思います。 かなり簡単なコードで出来ているので、何かの約に立つかもしれませんので興味がある方は是非!
WordPressでファビコン(サイトアイコン)を設定する方法
WordPressでのファビコン(サイトアイコン)の設定は、サイトのブランディングとユーザーエクスペリエンス向上に不可欠です。この記事では、手順と重要性について詳しく解説します。初めての方でも簡単に設定できる方法を紹介しますので、ぜひ参考にしてください。
今回は、ウェブサイトに画像スライダーを追加する方法を紹介します。ここでは、人気のライブラリ「Swiper」を使用して、基本的なスライダーの設置手順を初心者向けに説明します。
テキストアニメーションでウェブサイトに動きと魅力を追加しましょう。この記事では、CSSで実装できる4つの基本的なテキストアニメーションを紹介します。興味がある方はぜひご覧ください!
スムーズスクロールとセクションナビゲーションの実装方法とその利点[CSS+javascript]
こちらは、ウェブサイトでのスムーズスクロールとセクションナビゲーションを実現するJavaScriptの実装方法を解説しています。ページ内のセクションごとに異なる背景色を設定し、直感的なページ内ナビゲーションを実現します。
CSSとJavaScriptを使った初心者向けスライドショーの作り方
今回はCSSとJavaScriptを使って、簡単にスライドショーを作成する方法をご紹介します。
スクロールインジケーターを使ってページ内ナビゲーションを実装しよう!
ファーストビューに「SCROLL↓」のインジケーターを設置して、下にコンテンツがあることをアピールする方法をご紹介!矢印がアニメーションで動き、視覚的にわかりやすいんです。さらに、ファーストビューを離れると自動的に消えるので、便利な機能になっています✨ #Webデザイン #UIUX #Web制作
テキストが円形に回転しながら点滅するアニメーションを作成しよう![CSS + JavaScript]
今回は、JavaScriptとCSSを使って、テキストが円形に回転しながらランダムに点滅するアニメーションを作成する方法をご紹介します。サイトのロード画面や、ちょっと目を引きたいところに設置すると面白いと思うので、興味のある方は是非!
こんにちは!今回は、CSSを使ってシンプルなアニメーションを作成する方法を紹介します。具体的には、回転するボッ
[超簡単]CSSだけでOK!テキストリンクにアニメーションを追加する方法
今回は私がサイトを作成する時によく使用するリンクのアニメーション2つを紹介したいと思います。 非常に簡単なコードでアニメーションできるので初心者の方でも簡単に設置できますし、カスタムすることも可能です!
今回はCSSを使っての横にスクロールするループアニメーションを作る方法をご紹介します。 HTMLとCSSのみ横スクロールするループアニメーションが簡単に作れますので、サイトに掲載したいとお考えの方はぜひご参照ください。
[CSS]ドロップダウンメニューを作る[CSS + JavaScript]
Webのドロップダウンメニューとは、ユーザーがクリックするかホバー(マウスを重ねる)すると表示される選択肢のリストを提供するインターフェース要素です。 このメニューは通常、ページのナビゲーションバーやフォームの入力フィールドに組み込まれており、限られたスペースで多くの選択肢を提供するために使用されます。
ハンバーガーメニューのアイコンが動くアニメーションを作りたい。[CSS+JavaScript]
今回はハンバーガーメニューが動くスタイルシートをご紹介したいと思います。 マウスオーバーのみのアニメーション、クリックをしてのアニメーションに加えて、スタイルシートとJavaScriptを使ったちょっとしたメニューを作ってみましたのでご参考ください。
備忘録 フォントサイズをウィンドウサイズに合わせて可変させるCSS
今回はスタイルシート(CSS)を利用してフォントサイズの最小値と最大値を指定し、ウィンドウサイズに合わせて自動で文字の大きさが変更される方法の紹介となっております。
以前、WordPressのREST APIの記事を紹介させていただきましたが、今回は少し特殊なREST APIの使い方を紹介いたします。 お試しの場合はREST APIを利用するので、必ずバックアップを取ってから対応してください。
ブロックエディターのみでアーカイブ(日付)一覧を固定ページ等に表示させる方法
今回は前回、前々回に引き続きブロックエディターの機能を利用しアーカイブ(日付)一覧を掲載していきたいと思います。 前回はタグ一覧の表示方法をご紹介させていただきましたが、今回はアーカイブ(日付)一覧を表示させる方法をご紹介したいと思います。
プラグイン「Jetpack」を利用してInstagramのタイムラインをサイトに表示させてみた。
今回は、Instagramのタイムラインをサイトに表示させる方法をご紹介させていただきます。 プラグイン「Jetpack」を利用しての方法となりますので、誰での比較的簡単に表示させることができると思いますのでInstagramのタイムライン表示でお悩みの方はご一読ください。
ブロックエディターのみでタグクラウド(タグ一覧)を固定ページ等に表示させる方法
今回は前回に引き続きブロックエディターの機能を利用していきたいと思います。 前回はカテゴリー一覧の表示方法をご紹介させていただきましたが、今回はタグ一覧を表示させる方法をご紹介したいと思います。
ブロックエディターのみで、カテゴリー一覧を固定ページ等に表示させる方法
今回はプラグインを利用せずに「カテゴリー一覧」を表示させる方法をご紹介します。 デフォルトの機能を使うため、あまり装飾などすることは出来ませんが、まずはプラグイン無しで表示させたいという初心者の方向けとなっております。
REST API へのアクセスを制限するためのソースで躓いた話[WordPress]
今回はWordPressのREST APIで躓いたので、今後同じようなことがないように備忘録として紹介させていただきます。
WordPressでbodyタグにクラスを追加、または削除する方法[備忘録]
WordPressサイトでのbodyタグにクラスを追加・削除する方法をご紹介します。便利な手法ですが、必要性は少ないかもしれません。しかし、特定のページのデザインを微調整したいときに役立ちます。ぜひ試してみてください!
Contact Form7を更にカスタムして管理を簡単にしよう!
今回は前回紹介させていただきました、Contact Form7とGoogleスプレッドシートと連携できる「CF7 Google Sheets Connector」と、以前ご紹介させて頂きました、お問い合わせ番号を連番で管理することができるプラグイン「Contact Form 7 Serial Numbers」を更に連携させたので、そちらの備忘録となります。
Contact Form7とGoogleスプレッドシートが連携できるプラグインが便利すぎた!
今回はContact Form7とGoogleスプレッドシートが連携できるプラグイン「CF7 Google Sheets Connector」を紹介させていただきました。 お問い合わせを管理するプラグインの中でもかなり便利な機能を持っていると思うので、お問い合わせの管理でお悩みの方は是非ご検討ください!
WordPressで人気の記事を掲載することができるプラグイン「WordPress Popular Posts」
WordPress Popular Postsは、WordPressサイトに導入することで、訪問者にとって興味深いコンテンツを素早く発見できるようにするための便利なプラグインです。この記事では、WordPress Popular Postsプラグインの概要、機能、そして導入方法について詳しく説明します。
ムームードメインから新サービスが登場。その名も「ムームーサーバー」
あのドメイン取得サービスで有名な企業が、ついにレンタルサーバー事業に参入しました。このニュースを聞いて、私は興味津々でサーバーの性能や機能を調査しました。今回は、私の個人的な感想を率直に述べたいと思います。
Contact Form 7に通し番号を追加する「Contact Form 7 Serial Numbers」が便利!
今回はContact Form7で通し番号(連番)やタイムスタンプを追加できるプラグイン「Contact Form 7 Serial Numbers」を導入させて頂きました。
サイトやブログを彩る写真やイラストは重要ですね。テキストだけではユーザーの興味を引き付けるのが難しいことも。そんな時に便利なのが無料のフリー素材サイトです!利用規約を確認して、魅力的なコンテンツを提供しましょう!
一部のテキストサイズを変更することができるプラグイン Snow Monkey Editor
今回はブロック内の一部のテキストの文字を大きくしたり装飾したりできるプラグイン「Snow Monkey Editor」を紹介。
BackWPupで「10秒間応答しません。」というエラーが出た時の対処法
BackWPupでバックアップを取ろうとしたところ「ジョブ"ファイルバックアップ"が開始されましたが、10秒間応答しません。インフォメーションを確認してください。」と表示されたので、その時に対処した方法を備忘録として紹介させていただきます。
Copilotに聞いてみた!WordPresに入れた方が良いプラグイン5選!!
Microsoftが開発したAI「Copilot」の助けを借りて、WordPressサイト構築におすすめのプラグイン5つを紹介。各プラグインの特徴と役立つ機能について解説しています。セキュリティ、バックアップ、スパム対策、機能拡張、SEO強化が可能です。 Xで投稿するための文字数にしてください。
Copilotで作ったAIイラストをブログのアイキャッチに利用してみよう!
Microsoftが開発したAIツール「Copilot」を使ってアイキャッチ用のイメージ画像を作成してもらったので、その方法などを紹介しております。
1つのサーバーで複数のサイトを運営する方法[エックスサーバー]
エックスサーバーを使って複数サイト運営する方法について紹介。マルチドメインとMySQLが無制限の場合、スペック等に注意しながら運営すれば、コストダウンにも繋がります!
[WordPress]ブロックエディター(Gutenberg)の上手な利用方法。
ブロックエディター(Gutenberg)に慣れない方のために、不要なブロックの非表示にする方法とパターン化により使い勝手を改善する方法をご紹介します。
本記事ではWordPress用の便利なプラグイン「Code Snippets」を紹介します。functions.phpを編集せずにコードを追加・管理でき、HTMLやCSS、JavaScriptの入力、ショートコード化も可能にします。実際のコード追加方法を示し、記事数表示コードのショートコード化も説明されています。WordPressのカスタマイズを容易にするこのプラグインは、特に初心者に適しています。
ユーザーのプロフィール情報が改行されないときに試した2つのこと。
ユーザーのプロフィール情報に改行を入れる2つの方法を紹介。1つ目はfunction.phpにコードを追加し、プロフィールに手動でを入れる方法。もう1つは、wpautop関数を含むテンプレートタグを使う方法で、これにより自動で改行される。環境に合わせた方法を選ぶことが推奨される。
WordPressでアップした画像が自動で縮小される問題を解決方法 – 備忘録
今回はWordPressにアップロードした画像がなざか縮小された。という相談を頂いたので備忘録として解決方法を紹介したいと思います。
Instagramのタイムラインをwebに表示させる方法 – Lightwidget編
今回はInstagramのタイムラインをWEBサイトに表示させる方法 第2弾のお話となります。 LightwidgetというWEBサービスを利用しての方法となりますので、初心者から中級者の方向けかと思います。 APIに困っている方は1度検討してみてはいかがでしょうか?
備忘録 CSSだけでSPの時はアコーディオン風でPCの時はタブ切り替えを実装する方法
CSSだけでSPの時はアコーディオン風になり、PCの特はタブ切り替え風になる方法をご紹介したいと思います。
RSSフィードの取得とWordPressでの表示方法について解説しています。BeRSS.comを利用し簡単にフィードのURLを取得することができ、プラグイン不要でWordPressにRSSブロックを追加して表示可能です。
Googleカレンダーをサイトに表示させる方法。-その1-デフォルトタイプ
今回はGoogleカレンダーをサイトに表示させたいというご要望を頂きましたので、マニュアル代わりに記事として公開させて頂きたいと思います。
一時的にサイトをメンテナンスモードにするプラグイン「LightStart」を使ってみた話。
今回はWordPressで運営しているサイトを一時的にメンテナンスモードにするプラグイン「LightStart」を紹介したいと思います。 関係者は現在作成している状態を表示し、関係者以外はメンテナンスモードで表示されるので、サイトを用意中だったりサイトをリニューアルする際にとても便利なプラグインです。
WordPressの外部リンクでnoreferrerを削除する方法[アフェリエイト]
今回はリンクで「新しいタブを開く」を設定した時にソース上に追加されてしまう「noreferrer」を削除する方法を備忘録として公開させていただきました。
今回はWordPressのサイトアドレス(URL)を変更しましたのでそちらの備忘録となります。 URLを変更したいってあまりないかもしれませんが、サブディレクトリにインストールしてしまった場合などに役立つかと思います。
WordPressでサイトを新規作成するときに注意している基本的な5つのこと[備忘録]
今回は私がWordPressを使用して、サイトを作成するときに注意している下記の5つを備忘録として記事にしたいと思います。
プラグイン「Broken Link Checker」でリンク切れをチェックした話
今回はリンク切れを一括でチェックしてくれる便利なプラグイン「Broken Link Checker」を導入しましたので、設定などの備忘録となります。
CSS(スタイルシート)を更新したときにキャッシュを自動で読み直すために対応した話
今回はCSSファイルを更新したときにだけ、最新のCSSを読み直させるための対策をご紹介したいと思います。
[WordPress]Contact Form 7で 条件を分岐させたかったのでプラグインを導入した話
Contact Form 7を使っていて、条件を分岐させたいことてありませんか? 今回紹介するプラグイン「Conditional Fields for Contact Form 7」はそんな条件分岐を簡単に行えるプラグインとなっております。
[セキュリティ対策]プラグインで、管理画面全体にBasic認証を設定した話[WordPress]
今回はプラグイン「HTTP Auth」を利用して、ログイン画面と管理画面にBasic認証を設定したのでそちらの備忘録となります。
[WordPress]BackWPupでジョブエラーが出たので、検証して対応した話
BackWPupで「ジョブが開始されましたが、10秒間応答しません。インフォメーションを確認してください。」というメーセージが表示されたので、調査して対応した備忘録となります。
Contact Form 7のインテグレーションを利用しreCAPTCHAを設定しよう
今回は前回に引き続き、Contact Form 7に関連の記事で、インテグレーションを利用し、Google reCAPTCHAを設定するお話となっております。
[WordPress]Contact Form 7を導入しよう[初心者向け]
今回の記事はお問い合わせフォームを簡単に追加できる「Contact Form 7(コンタクトフォーム7)」に関しての導入から初期設定までの流れをご紹介させていただきたいと思います。
[Elementor]シェアボタンを追加するプラグインAddToAny Share Buttons[WordPress]
私が運営している、姉妹サイト「wdbm(ウェブデザインブックマーク)」の方に、SNSへ共有されるシェアボタンを追加するためにプラグイン「AddToAny Share Buttons」を導入しました! 今回の記事はそちらの備忘録となっております。
[セキュリティ対策]WordPressのログインURLを変更した時の話[プラグイン]
今回は不正ログインの対策のためにWordPressのログインURLを変更した時のお話になります。
今回はTwitterが何故か英語で表示されるようになったので、日本語に戻した話となっております。もしお困りであればご参照ください!
少ないですが過去に2度ほど「ChatGPT」についての記事を公開させていただきました。 今回はそんな「ChatGPT」を利用するためのアカウント取得方法の記事となります。
今回はメディアクエリの中でも、デバイスの向きで指定できるコードを紹介。
ChatGPTでWordPressで画像挿入方法を聞いてみた
今回は前回の記事に続いてChatGPTを使って、「WordPressで画像を挿入する方法」を質問してみましたので、回答を元に記事を制作してみたいと思います。
今回は話題のChatGPTを使って記事を書いて見ました。 今後色々と記事を編集するにあたりお世話になりそうでしたので備忘録として公開させていただきたいと思います。
[WordPress]ブロック挿入ツールのパターンで不要な項目を非表示にした備忘録
今回は記事投稿の時に利用するブロックパターンで、利用していないデフォルトのパターンを非表示にしたので、その際の備忘録を公開させていただきます。
[WordPress]投稿記事数を表示させたいので、ショートコードを自作して埋め込んでみた話
今回は「公開済みの投稿の記事数を取得・表示」させるためにショートコードを自作して埋め込んだ時の備忘録となります。 覚えて置くと結構便利なので、興味がある方は参考にしてみてください。
今回は投稿画面の右側にあるタグにチェックボックス付きの一覧表示がされるようにカスタマイズしてみましたのでそちらの備忘録となります。
遅くなってしまいましたが、あけましておめでとうございます。今年もよろしくお願いいたします。 本年も記事としてW
[WordPress]画像圧縮プラグインで軽量化をしよう![EWWW Image Optimizer]
画像をたくさん掲載するコンテンツの悩みといえばページ容量だと思います。特にギャラリー系のサイトですと1ページあ
List category postsを使って、カテゴリーやタグの記事一覧を表示出来るようにした話
今回紹介する「List category posts」は、投稿・固定ページの記事またはサイドバーに指定したカテゴリー・タグの記事一覧を表示できるプラグインです。 前回はPHPの編集、プラグインを利用しないでの表示方法のご紹介でしたが、こちらの方がより簡単に設置出来るかと思うので、ご紹介させていただきます。
[WordPress]選択したカテゴリーだけを最新情報として表示させた話。
今回のお話は、「重要などの記事を常に上部に掲載させる方法」と「選択したカテゴリーのみ最新情報として掲載させる方法」をお知らせいたします。
RSSを表示させたいので「RSS Aggregator」プラグインをインストールした話
RSSをサムネイル付きで簡単に表示させることができるプラグイン「RSS Aggregator by Feedzy」のご紹介。 姉妹サイトの最新情報の掲載や、アンテナサイトの制作を検討している方いかがでしょうか?
Instagramをwebサイトに表示させる方法を色々試してみた話 その1[SNS]
今回はInstagramの写真を表示させる方法としてWord Pressのプラグイン「Smash Balloon Social Photo Feed」を紹介させていただきます。
Word PressサイトでTwitterのタイムラインやツイートを比較的簡単に表示させる方法
今回は簡単にですが、Word Pressの記事内にTwitterのタイムライン(またはツイート)を表示させる方法をご紹介いたします。プラグインなども必要なく表示させることができますので検討中の方は是非お試しください!
[Elementor] Elementor無料版を使ってサイトを作ろう[一旦終了]
Elementor無料版でサイト制作を作ろうシリーズは今回で一旦終了とさせていただきます。 初めて使用してみた感想などをつらつらと記載しましたのでお時間良ければお付き合いください。
ブロックを時間や画面サイズなどの条件で表示などができるプラグイン[Block Visibility]
「一時的に表示させたい」もしくは「時間が来たらここは非表示にしたい」などと思ったことはありませんか? イベントの申込みフォームや期間限定のアンケートなど様々なシーンで役立つブロックの表示/非表示を制御するプラグイン「Block Visibility」を今回は紹介したいと思います。
[Elementor]固定ページでカテゴリー、タグが一覧で表示されるページを作成しよう[その6]
Elementorのお話-その6でございます。 今回は固定ページをElementorとデフォルトのエディター双方を利用して作成してみましたのでご紹介いたします。Elementorでも「ブロック」ウィジェットを使えば色々できそうなので、今後も取り入れていきたいと思います。
プラグイン「reCaptcha by BestWebSoft」を使ってreCAPTCHAを設定した話。
Googleの認証システム「reCAPTCHA」をWord Pressサイトに設定するために「reCaptcha by BestWebSoft」を導入しました。
[Elementorでサイトを作ろう-その5]投稿(シングル)ページのレイアウトを修正した話
Elementorで新サイトを作るシリーズの第5弾。 今回は投稿ページ(シングルページ)のレイアウトを整えて行きたいと思います。 ElementorはPROを使っていないのでカスタマイズやプラグインでレイアウト修正をしていきます。
【Word Press】Custom Block Patternsを入れてみた話
今回はブロックパターンとして登録することが出来るプラグイン「Custom Block Patterns」をご紹介させていただきます。
【Word Press】記事投稿をもっと楽に!記事内容をテンプレート化する方法
今回はWord Pressのデフォルト機能「再利用ブロック」を使って見ましたので、そちらの備忘録となっております。記事をある程度テンプレート化したりもできるのでかなり便利な機能だと思いますよ!
[Elementorでサイトを作ろう-その4]Essential Addons for Elementorを使った話
Elementor無料版でアイキャッチ付きの記事一覧を表示したかったのでプラグイン「Essential Addons for Elementor」のウィジェットを使ってみました。制限は色々ありますが、なんとか形になったので記事としてご紹介させていただきます。
[Elementorを導入しサイトを作ろう-その3]フッターをデザインしてみた話[無料版]
Elementorを利用してのサイト作り「その3」です。今回はフッターを制作したのでそちらのご報告となります。
【Elementor】Word Pressでパンくずリストを表示させる方法【Word Press】
今回はAll in One SEOを使ってElementorにパンくずリストを表示させる方法をご紹介させていただきます。All in One SEOさえあれば特に設定する必要もありませんのですごく便利ですよ!
[雑談]アクセス数を前年同月の2倍以上にした話[お仕事の話]
今回は実際にあったお仕事のお話になります。 前年同月よりも2倍以上のアクセス数アップ!、それに伴いお問い合わせなどのレスポンスも1.5倍以上アップしたお話になります。
[Elementorを導入しサイトを作ろう-その2]ヘッダーをデザインしてみた話[無料版]
Elementorで製作中のサイトでオリジナルのヘッダーを作るためにElementor Header & Footer Builderというプラグインを導入しました。
Google AdSenseの再審査の時に私が対応した3つの方法[サイト収益化計画-その3]
AdSenseの再審査をするにあたって当サイトで対応した3つの内容をご紹介させていただきます。
[サイト収益化計画-その2]アフェリエイトに登録してみよう。[Google AdSense]
以前の記事でサイト収益化計画としてA8.netの記事を掲載致しましたが、引き続いてアフェリエイトに関しての記事を紹介します。
WordPressでSVGファイルがアップロード出来なかったので、プラグインで出来るようにした話
WordPressでSVGファイルをアップロードすると「このファイルはセキュリティ上の〜」というエラーメッセージが表示されて困ったことありませんか?今回はそんなSVGファイルのアップロード問題をプラグインで解決するお話です。
【Cocoon】ヘッダーにメニューとサブメニューを表示させる方法【WordPress】
ヘッダーにメニューを追加したいと思ったことありませんか? WordPressでは簡単にメニューを追加したり削除することが可能です。 今回は当ブログでお世話になっているテンプレートcocoonでのお話になりますが、他テーマにも通ずる部分もありますのでもしよければご一読ください。
ワンクリックで記事が複製できるプラグイン「Duplicate Post」を導入した話
投稿記事や固定ページを複製したいときってありませんか?今回はプラグインを利用して簡単に複製できる「Duplicate Post」を紹介致します。
Allow Multiple Accountsを使って1つのメールアドレスで複数のユーザー登録をした話
「1つのメールアドレスで複数のユーザー登録をしたい」方向けの記事となります。 ただし重複出来ない理由としてはWordPressの方で悪意あるユーザーから登録を防ぐためでもありますので、今回紹介するプラグイン「Allow Multiple Accounts」をもし導入するのであれば自己責任でお願い致します。
「ブログリーダー」を活用して、カササギさんをフォローしませんか?
GSAPを使って、初心者でも簡単にウェブアニメーションを実装できます。左右に動かしたり、フェードイン、回転させたりするアニメーションを紹介しています。
スクロールに合わせて背景が拡大するWebアニメーションを作ってみませんか?初心者でも簡単にできる、GSAPとScrollTriggerを使ったアニメーションの作り方を解説しています!
ウェブサイトの利便性を向上させる方法を解説します。スクロールに応じてヘッダーの表示/非表示を切り替え、ページ上部へ戻るボタンを実装することで、ユーザー体験を向上させましょう。
今回は、HTML、CSS、JavaScriptを使って、スクロールに応じて背景色と文字色を変更する簡単な方法を紹介します。
今回は、1つは水平と垂直のライン上で円が動くアニメーション、もう1つは形を変えるアニメーションです。
今回の記事では、初心者の方でも簡単に理解できるように、HTML、CSS、JavaScriptを使って、ランダムな背景色と角丸を持つボックスを作成する方法を紹介します。
今回は、文字が一文字ずつ表示されるアニメーションを実装する方法について説明します。 この記事では、HTML、CSS、JavaScriptを使用して、文字がぼやけて拡大から縮小されるアニメーションを実装します。
今回の記事は「パーマリンクの設定」が 違う場合、上手く稼働しないケースもございますのでご注意下さい。
WordPressの予約投稿URLの確認が手間に感じることはありませんか?今回の記事では記事投稿一覧ページに表示させる方法をご紹介します。
今回の記事では、JavaScriptを使用して数字を0から9999までカウントアップするアニメーションを実装する方法について解説します。
今回は、ウェブページに動くボックスを配置する方法を紹介します。 CSSとJavaScriptを使って楽しく学びながら、視覚的に魅力的なアニメーションを実現します。
前回の記事に引き続き、JavaScriptを使用して複数のセクションにランダムな背景色を適用する方法を紹介しま
今回はJavaScriptを使用して定期的に背景色をランダムに変更する方法を紹介します。少し変わったwebサイ
近年、ウェブデザインにおいて動きやインタラクティブな要素を取り入れることが増えています。今回は、GSAP(Gr
今回はwebサイトの作成にはあまり役に立たないかも知れませんが、ちょっとおもしろいコードを作ってみましたので紹介したいと思います。 かなり簡単なコードで出来ているので、何かの約に立つかもしれませんので興味がある方は是非!
WordPressでのファビコン(サイトアイコン)の設定は、サイトのブランディングとユーザーエクスペリエンス向上に不可欠です。この記事では、手順と重要性について詳しく解説します。初めての方でも簡単に設定できる方法を紹介しますので、ぜひ参考にしてください。
今回は、ウェブサイトに画像スライダーを追加する方法を紹介します。ここでは、人気のライブラリ「Swiper」を使用して、基本的なスライダーの設置手順を初心者向けに説明します。
テキストアニメーションでウェブサイトに動きと魅力を追加しましょう。この記事では、CSSで実装できる4つの基本的なテキストアニメーションを紹介します。興味がある方はぜひご覧ください!
こちらは、ウェブサイトでのスムーズスクロールとセクションナビゲーションを実現するJavaScriptの実装方法を解説しています。ページ内のセクションごとに異なる背景色を設定し、直感的なページ内ナビゲーションを実現します。
今回はCSSとJavaScriptを使って、簡単にスライドショーを作成する方法をご紹介します。
今回は私がWordPressを使用して、サイトを作成するときに注意している下記の5つを備忘録として記事にしたいと思います。
今回はリンク切れを一括でチェックしてくれる便利なプラグイン「Broken Link Checker」を導入しましたので、設定などの備忘録となります。
今回はCSSファイルを更新したときにだけ、最新のCSSを読み直させるための対策をご紹介したいと思います。