サイト制作

WEBサイトの作成方法やHTML,CSSなどの技術的な部分の記事を更新中。WEBデザイナー・フロントエンドエンジニア・HTMLコーダーを目指している方、既に仕事としてやっている方向けの記事を更新中!

スポンサーリンク
CSS

Sassで日本語入力でエラーが出た時の対処方法

Sassで日本語が入っているとエラーが出る問題の解決方法。font-familyの指定などで困るSassのコンパイルエラーを回避する方法を紹介。日本語入力時のSassエラーを解決しよう。
JS・jQuery

コピペで簡単にできるクリックしたら展開するアコーディオンメニュー【jQuery】

クリックしたら展開するアコーディオンメニューをコピペで簡単に実装できるjQueryを紹介。よくある質問などでよくあるクリックすると表示されるアコーディオンメニューを簡単に実装できます。
WordPress

html・CSS・PHPなどソースコードをワードプレスの記事で表示させる方法

WordPressで技術ブログをされている方必見。html・CSS・PHPなどソースコードを簡単いWordPressで出力できるプラグインを紹介。WordPressでエンジニアブログ・技術ブログを作ろう!
WordPress

レビューサイトに最適!評価の星を付けれるプラグイン「Shortcode Star Rating」

レビューサイトによくある星を簡単につけられるWordPressプラグイン「Shortcode Star Rating」。レビューサイトを運営したい人や評価を簡単に実装したい人は「Shortcode Star Rating」をぜひ試してみよう。
WordPress

【WP】セキュリティ強化!ログイン画面にベーシック認証を掛ける方法

WordPressは不正アクセスされやすいのでログイン画面にbasic認証を掛けセキュリティ強化を!WordPressの不正アクセスを事前に防ぐためログイン画面のセキュリティ強化を!今回はBasic認証を使用した方法を紹介。
CSS

セレクトボックスの矢印を消す方法【Chrome・IE・Firefox】

セレクトボックスで表示される矢印をCSSで非表示する方法。セレクトボックスをhrome・IE・FirefoxでCSSを使い非表示にする方法を紹介。セレクトボックスの矢印を簡単に消すことができるので試してみよう。
WordPress

【WP】カテゴリスラッグを取得し、classとして使う方法

WordPressでカテゴリスラッグを取得し、classに追加する方法。WordPressでカテゴリスラッグの取得方法、「get_the_category()」のいろいろな使い方を紹介しています。カテゴリスラッグでclassをつけよう。
CSS

PCのみ改行・SPのみ改行をCSSで実装する方法【レスポンシブデザイン】

レスポンシブデザインのサイト制作でPCのみ改行、SPのみ改行する方法を紹介。CSSだけでPCのみ改行、SPのみ改行が実装できます。レスポンシブサイトで改行を自由自在に使いこなそう。コンテンツをPCのみ表示、SPのみ表示にも使えます。
CSS

CSSをSASS/SCSSを一瞬で変換できるツール

CSSを簡単に一瞬でSASS/SCSSに変換できるツールを紹介。CSSをSASS/SCSSに変換することで効率よく制作することができます。CSSを一瞬で変換したい方はぜひ試してみてください。
WordPress

【WP】指定のカスタム投稿で記事のみに個別のCSSを適用する方法

WordPressで指定のカスタム投稿で記事のみに個別のCSSを適用する方法を紹介。single.phpで個別のCSSを割り当てる方法のメモ。WordPressで指定のカスタム投稿でも簡単に個別CSSを指定できます。
WordPress

【WP】一部のパーツ(PHP)を呼び出し楽に管理する方法

WordPressで共通の部分を関数で簡単に呼び出す方法。Wpでは一部の共通のパーツを簡単に呼び出したり変更することができます。「get_template_part」を使用して共通部分をWordPressの関数で呼び出そう。
CSS

スクロール途中から固定・解除する方法【CSSのみ】

CSSだけでスクロール途中でコンテンツを固定・解除する方法を紹介。jQueryを使用せずCSSだけでコンテンツを固定・解除する方法です。CSSで簡単にコンテンツを固定表示させてみよう。
2019.06.09
WordPress

【WP】タイトル表示するいろいろな方法(字数制限・htmlタグ削除)

WordPressでタイトルを字数制限・htmlタグ削除し表示させる方法。記事のタイトルを表示させたいときWordPressでは様々な記述でタイトル出力ができます。タイトルを自由自在にカスタマイズできるようになろう。
PHP

サイトの共通部分を簡単に管理する方法【PHP】

PHPを使ってサイトの共通部分を簡単に管理作成する方法。PHPでインクルードさせることで共通部分を楽に管理するうことができます。webサイトをより簡単に作成するためにPHPで共通部分をインクルードさせよう!
サイト制作

webサイト高速化!簡単にできるページ速度の向上のためのあれこれ

webサイトが遅いと感じたときに試してみるべきページ速度高速化の方法まとめ。webサイトの表示が遅くてお困りの方は各項目毎の改善方法を実践しよりページ速度の早いwebサイトを作ろう。
WordPress

【WP】固定ページの画像リンク(パス)を短くする方法

WordPressの画像パスを短く短縮する方法。固定ページでFTPから画像をリンクさせる場合の画像パスを短縮する方法を紹介。WordPressの固定ページに画像を配置する場合は画像パスを短縮して使用しよう。
CSS

上下・左右・中央に要素を配置するCSSテクニック

CSSで上下・左右・中央に要素を配置するテクニック。CSSで簡単に上下左右中央に要素を移動させることができます。CSSで中央に要素を移動させたい方是非参考にしてみてください。
CSS

CSSのみでリンクのボタンにアニメーション付きホバーエフェクトを付けてみた

リンクボタンにCSSのみでアニメーションホバーエフェクトを付けてみました。リンクボタンに動きのあるホバーエフェクトをCSSのみで簡単につけることができるのでwebサイトに動きを付けたいときやもっと華やかにしたいときにホバーアニメーションを試してみよう。
CSS

ホバー(hover)時に動きのある下線を入れる方法【CSSのみ】

CSSだけでホバー時の下線アニメーションを付ける方法。CSS3を使用しjQueryなしで簡単にホバーアニメーションを付けることができます。リンクにいろいろなホバーエフェクトを付けて動きのあるサイトを作ろう。
CSS

リンクや画像などのホバーをCSSのみで光ったように見せる方法【JS不要】

CSSのみで光るホバーエフェクトを実装する。JSを使用せずに簡単に画像や文字を光ったように見せることができます。CSSのみでできるホバーエフェクトでサイトに動きをつけよう!
2018.09.24
HTML

「レスポンシブルデザイン」もしかして「レスポンシブデザイン」??

レスポンシブルデザイン?間違って覚えていませんか?レスポンシブルデザインではなくレスポンシブデザインです!レスポンシブルデザインとレスポンシブデザインについて意味を調べてみました。レスポンシブルデザインと覚えてしまっている人は気をつけよう!
2018.09.23
WordPress

【WP】SEOに強い無料WordPressテーマ紹介【2018】

オススメ無料SEOに強いWordPressテーマ紹介。無料でなおかつSEOに強いWordPressテーマを紹介しています。SEOに強いWordPressテーマを使って上位ブロガーを目指そう!
2018.09.24
タイトルとURLをコピーしました