【CSS】横並びメニューの区切り線を「隣接セレクタ」と「疑似要素」を使って実装する方法

グローバルメニューやフッタメニューで利用することの多い区切り線(罫線)。皆さんはどのように実装していますか。CSSの[border]を使えば簡単に作ることができますが、縦線の長さや位置を自由変えれないので思ったようにデザインできません。そんな時は「隣接セレクタ」と「疑似要素」を使うとスマートに実装…
続きを読む

【FileZilla】サイトマネージャーに登録しているFTPパスワードを確認する方法

FTPソフト「Filezilla」はホスト名・ユーザー名・パスワード等をサイトマネージャーに登録してサーバーに接続します。登録したアカウント情報はサイトマネージャーで確認できますが、パスワードはマスクされていて見ることができません。今回は、Filezillaでサイトマネージャーに登録しているFTP…
続きを読む

メールの取りこぼしを防ごう!DNS切替に伴うメールサーバー移行方法と注意点

ホームページで利用しているレンタルサーバー(ホスティング会社)を変更する場合、メールサーバーの移行作業が発生します。プライベートならまだしも、ビジネスメールの送受信に不具合があったら大事です。メールサーバーの移行は慎重かつミスなく行わなければなりません。今回はDNSの変更にともなうメールサーバー…
続きを読む

【テンプレート】システムメンテナンスのお知らせのサンプル雛形

運用しているホームページのサーバーやプログラムを入れ替える場合、一時的にサイトを停止することになります。突発的なトラブルなどでない限り、事前にホームページ内のお知らせなどでメンテナンスを告知すると思いますが、文章はだいたい同じような形になります。それをメンテナンスのたびに書き直すのは効率が悪いです…
続きを読む

【jQuery】外部リンクに自動でFont Awesomeアイコンを表示する方法

外部リンク(新しいウィンドウで開くリンク)に自動で外部リンク用のアイコンを表示する方法を紹介。直接HTMLに書き込むこともできますが、その都度コードを打ち込むのは面倒ですしスマートではないですよね。そこで、今回はjQueryを利用して[target='_blank']の入っているリンクに自動で付与…
続きを読む

【CSS】Font Awesome 5を疑似要素で指定するとアイコンが表示されない時の解決方法

FontAwesome5で、CSSの疑似要素(::before,::after)でcontent指定をした際、アイコンが表示されない場合の解決方法です。これ、かなり罠な感じなのでハマる人も多いんじゃないでしょうか…関連記事:FontAwesomeのリンクホバーの下線をテキストだけにする方法…
続きを読む