イセンチュートリアルサイト
  • CSS
    • スクロールダウン
    • テキストナビゲーション
    • ボタン
    • メニュー
    • 動画
    • 検索
    • 画像リンクの動き
    • 背景の動き
  • Illustrator
  • JS
    • アコーディオンパネル
    • アニメーション
    • エリアの動き
    • ギャラリー
    • グラフ
    • スライド
    • テキストの動き
    • ニュースティッカー
    • ページトップリンク
    • ページ内リンク
    • メニュー
    • モーダルウィンドウ
    • ローディング
  • Photoshop
  • PHP
  • WordPress
    • プラグイン
    • リンク
  • お客様観覧用
    • WEB制作プラン
    • アニメーション
    • グローバルナビゲーション
    • スライド
  • サーバー
    • CPI
  • 未分類
  • 法律
    • 医療法
    • 柔道整復師法
TOP 未分類

未分類

カテゴリーページ

  • カテゴリーのスラッグをクラス名として追加する方法

    カテゴリー:未分類
    <div class="post_cat">
    	<?php $cat = get_the_category(); $cat = $cat[0]; { echo '<span class="'. $cat->category_nicename. '" />'; } ?>
    	<?php $cat = get_the_category(); $cat = $cat[0]; { echo $cat->cat_name; } ?>
    </div>
    

     

    上記コードはページ上では以下のようになります。

    <div class="post_cat"><span class="カテゴリースラッグ"/>カテゴリー名</span></div>
    
    投稿日:2022年05月13日
  • SSL設定

    カテゴリー:未分類

    CPI側

    1. データベースと公開サーバーのバックアップをする
    2. CPIのマイページからSSLをオプションとして申し込む。
      支払いは、後ほど「【重要 CPIより】請求書」というメールが届くので、内容を確認し、カード支払いの場合は、マイページログイン ⇒ 請求一覧 ⇒ 対象請求の[決済方法選択]から支払いを完了させる。
    3. 支払いを完了すると、SSL申込時に選択したメールアドレスに確認メールが届く「ブラウザメール」のログインIDになる。
      メールを確認するには、「メールコントロールパネル」⇒「メール」⇒「メールアカウント管理(管理者)」へいき「postmaster@*********」のパスワードを設定。(もともとあるメールアドレスでパスワードが設定されていないので設定する)
    4. CPIから「CPISSLサーバー証明書申請開始のお知らせ」というメールが届いたらCPIのユーザーポータルへいき認証手続きを行う。
    5. 認証手続きは、ログイン後「メール」⇒「ウェブメール」の「シングルタイプ」へいくと「ブラウザメール」ログイン画面になるので、先ほどの「postmaster@*********」のアドレスとパスワードを入力しログインし受信箱を確認。受信箱に「【CPI SSLサーバー証明書】ドメイン承認のお手続きをお願いします 」という件名のメールが届いているので、承認ページURLから認証を行う。

     

    WordPress側

    • WordPressのダッシュボード
      『設定』⇒『一般』アドレスをhttps://〜に変更する。
    • プラグイン『Really Simple SSL』をインストール・有効化
      『SSLを有効化します』をクリック
    • プラグイン『Search Regex』をインストール・有効化
      『ツール』⇒『Search Regex』でURLの置換を行う

     

    サーバー側

    • .htaccessに追記

     

    Options +SymLinksIfOwnerMatch の直下に

     

    <IfModule mod_rewrite.c>
    
    	RewriteEngine on
    
    	RewriteCond %{https} off
    
    	RewriteRule ^(.*)$ https://%{https_HOST}%{REQUEST_URI} [R=301,L]
    
    </IfModule>
    

     

    を追記する。

     

    Googlel等

    • GoogleAnalyticsの変更
      「https」から「https」に変更
    • Googleコンソールの変更
      サイトのURLが「https」から「https」に変わった場合は、サーチコンソールを新たに新規登録する必要がある。

     

    参考アドレス

    • https://zenlogic.jp/aossl/operation/wordpress-aossl/
    • https://www.soramane.com/sorairo/2017/10/cpi%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC%E3%81%A7%E3%81%AEwordpress%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E3%81%A8%E5%B8%B8%E6%99%82ssl%E5%8C%96/
    • https://sozoen.com/yuichiro/wordpress-https-https
    • https://re-means.com/search-regex-how-to-globally-replace-the-image-url-to-https-from-https/
    • https://tekito-style.me/columns/ssl-search-console

     

    CPIへのSSL申込から設置完了までの期間

    寝屋川市工業会の場合

    • SSL申込日時          3月28日(水) 午後5時頃
    • CPIからの設置完了連絡   3月30日(金) 午前11時頃
    投稿日:2022年04月01日
  • ホームページ移管の流れ

    カテゴリー:未分類

    他社 → イセン

    ドメインの移管

     

    1. 現在のドメイン管理がどうなっているのかの確認

    ○クリニックが管理している場合
     ⇒ドメイン移管手続きを進めてもらう。2へ。

    ○制作会社などが管理している場合
     ⇒クリニックから制作会社に連絡してもらい、移管の手続きを頼んでもらう。

     

    2. ドメイン別、手続きについて
    管理が制作会社の場合は、移管の手続きについて理解されていると思いますので、指示に従ってください。
    クリニックが管理している場合は、下記の手順でお願いします。

    ○【jp】ドメインの場合
    移管の了承のご連絡をいただき次第、ドメインの移管の申請をします。
    申請が完了すると承認要請メールが先方に届くこともありますので、その際は承認をお願いします。

    ○【com】ドメインの場合
    オースコードの発行をお願いして下さい。
    そのコードを元に移管作業を進めて行きます。
    コードがないと移管作業に進めません。

     

    ※ドメインの期限は31日以上必要です。30日以下の場合は移管ができません。

     

    サーバーデータ

    サーバーのアクセス情報(FTP情報)が提供してもらえるか確認。
    提供してもらえない場合はサーバー上にあるファイルとデータベースファイルをこちらへ提供してもらう。

     

    ワードプレスのログイン情報

    ワードプレスのログイン情報を提供してもらう。

     

    ドメイン新規取得の場合

    1. https://muumuu-domain.com/こちらのURLよりご希望のドメインの空きを確認してご提案してください。
    2. 提案書はバックログの中です。
    投稿日:2022年04月01日
  • 日本語ドメインのメリットとデメリット

    カテゴリー:未分類

    ■日本語ドメインのメリット

     

    ①視認性が高い

    ドメイン名が日本語であることによる最大のメリットは、「見た目のわかりやすさ」です。日本語を理解する人なら一目で読めるので、覚えられやすくなります。

     

    ②希望ドメイン名を取得しやすい

     

    ③サイト内容がわかりやすい

    日本語ドメインを一目見ればそのサイトがどんな情報を提供しているかがわかります。

     

    ■日本語ドメインのデメリット

     

    ①ブラウザ以外では文字列が変わってしまう

    例えば、先ほどの「https://学習塾比較サイト.com」という日本語ドメインは、

    https://xn--eckwd4c7c5976acvb2w6i.com

    という文字列に変換されます。

     

    わかりにくいだけでなく、一見スパムのようにも見え不信感を抱かせてしまう危険性もあります。

    また、メールアドレスにも日本語が使えないので、info@xn--eckwd4c7c5976acvb2w6iなどのように表記されてしまい、相手に誤解を与えるリスクがあります。

     

    ②海外では使いにくい

     

    ③使用できないサーバーがある

     

    ④メールアドレスが作れない

    〇〇〇@アップル鍼灸整骨院.com は使用できません

    どうしても使用したい場合は次のメールアドレスになります。

    〇〇〇@xn--eckwd4c7c5976acvb2w6i.com

    メールアドレスを使用する場合は、控えた方が良いと思います。

     

    ⑤QRコードにも不向き

    メールアドレス同様、読み込み後のアドレスが一般の人にはわかりずらい

    xn--eckwd4c7c5976acvb2w6i.com

     

    ⑥一般化され、注目が集まりにくくなった

    普及しだした当初は注目された日本語ドメインですが、今やその数は155万件以上と増え、もはや目新しさはなくなりました。見た目にわかりやすく覚えやすいのは確かですが、コンテンツやキーワードとの関連性が高くなければ、「日本語だから」という理由だけでアクセスを期待するのは難しいでしょう。

     

    ■日本語ドメインにSEO効果はある?

     

    ドメインは検索キーワードと一致しているほうがSEO効果は高いとされています。そのため、キーワードと関連性の高い日本語であれば若干の効果は見込めるでしょう。

     

    ただし、最近ではコンテンツの質やユーザビリティがもっとも重視されています。ドメインにキーワードが入っていたとしても、コンテンツの質がよくなければ上位表示は見込めません。

     

    つまり、日本語ドメインであること自体には、SEO効果はほとんど期待できないと考えてよいでしょう。

     

    投稿日:2022年04月01日
  • Googleフォントを高速で読み込む方法

    カテゴリー:未分類

    非同期で読み込む方法とpreload記述の方法

     

    @importでの読み込みは遅くなる

     

    @import url(‘https://fonts.googleapis.com/css?family=Montserrat:400,600&display=swap‘);

     

    この方法はCSSから、さらに上記URLに読み込みにいってしまうためページの読み込み速度を下げてしまいます。

    (参考:CSS @import を使用しない)

     

    非同期で読み込む方法

     

    Web Font Loaderを使ってフォントを非同期で読み込みます。

    Googleフォントは、フォント名を指定するだけで非同期で読み込めるんです。

     

    <footer>内にScript記述

     

    このコードを</body>タグの手前にコピペします。

     

    <script>
    
    window.WebFontConfig = {
    	google: { families: ['M+PLUS+Rounded+1c:400,600'] },
    	active: function() {
    		sessionStorage.fonts = true;
    	}
    };
    
    (function() {
    	var wf = document.createElement('script');
    	wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
    	wf.type = 'text/javascript';
    	wf.async = 'true';
    	var s = document.getElementsByTagName('script')[0];
    	s.parentNode.insertBefore(wf, s);
    })();
    
    </script>
    

     

    コード3行目の「families」に、フォントを指定します。

    ‘M+PLUS+Rounded+1c’のように指定

    複数指定する場合は、カンマで区切って指定

    ‘M+PLUS+Rounded+1c’, ‘Noto+Sans+JP’

     

    読み込み時のちらつきをなくす方法

     

    下記CSSを追加する

     

    html * {
    	visibility: hidden;
    }
    
    html.wf-active *{
    	visibility: visible;
    }
    

     

    Web Font Loaderを使用すると、自動で<html>にクラスが付与されます。そのクラスを利用して、読み込みが完了するまでは非表示のCSSを記載します。

     

    /* ダウンロード実行時 */
    <html lang="ja" class="wf-loading">
    

     

    /* ダウンロード完了時 */
    <html lang="ja" class="wf-active">
    

     

    投稿日:2022年04月01日
1 / 212Next

アーカイブ

  • CSS (117)
    • スクロールダウン (8)
    • テキストナビゲーション (11)
    • ボタン (52)
    • メニュー (1)
    • 動画 (2)
    • 検索 (3)
    • 画像リンクの動き (23)
    • 背景の動き (17)
  • Illustrator (8)
  • JS (93)
    • アコーディオンパネル (2)
    • アニメーション (1)
    • エリアの動き (7)
    • ギャラリー (6)
    • グラフ (7)
    • スライド (9)
    • テキストの動き (17)
    • ニュースティッカー (1)
    • ページトップリンク (9)
    • ページ内リンク (2)
    • メニュー (28)
    • モーダルウィンドウ (1)
    • ローディング (3)
  • Photoshop (1)
  • PHP (20)
  • WordPress (4)
    • プラグイン (2)
    • リンク (1)
  • お客様観覧用 (11)
    • WEB制作プラン (1)
    • アニメーション (8)
    • グローバルナビゲーション (1)
    • スライド (1)
  • サーバー (6)
    • CPI (1)
  • 未分類 (6)
  • 法律 (2)
    • 医療法 (1)
    • 柔道整復師法 (1)
TOP
  • CSS
    • スクロールダウン
    • テキストナビゲーション
    • ボタン
    • メニュー
    • 動画
    • 検索
    • 画像リンクの動き
    • 背景の動き
  • Illustrator
  • JS
    • アコーディオンパネル
    • アニメーション
    • エリアの動き
    • ギャラリー
    • グラフ
    • スライド
    • テキストの動き
    • ニュースティッカー
    • ページトップリンク
    • ページ内リンク
    • メニュー
    • モーダルウィンドウ
    • ローディング
  • Photoshop
  • PHP
  • WordPress
    • プラグイン
    • リンク
  • お客様観覧用
    • WEB制作プラン
    • アニメーション
    • グローバルナビゲーション
    • スライド
  • サーバー
    • CPI
  • 未分類
  • 法律
    • 医療法
    • 柔道整復師法
© 2022 isen-print.