SSL化についてのまとめ

自動車のページは以外にスムーズに言った

ブログコンテンツもなかったし

 

静的ページは 昔のCGIでハマった

そのメモ

postmailを使っていたが

入力フォームのhtmlに文字コードの宣言がないと、アップした際に勝手に変わっていたのだろう。 utf-8 と掲載したらうまく言った

まずhtmlの文字コードを変更するには mi か MultiTextConverterにドラッグアンドドロップするかだ(これはエラーになるようなファイルが出来上がるぐらい 強引に変更するのでmiがよいかも 今回はmiでいけた)

 

春日井ナビ

コンテンツの画像はsslも文句言わないみたい最近

しかし、

js の http:// が2箇所 googlemapを出している箇所のコードが3箇所程度あったので変更

 

あとはアヴァター アヴァタ アバター

これは関数をフィルターして対応でOK

上はありもの

したは自作 どうやら アバター登録は2つ使っているようで

通常のメールアドレに釘づいてあるアバターがあれば出るのが1つ

もう一個はSimple Local Avatars

//ssl化後Simple Local Avatars ssl化
function ssl_simple_local_avatar( $avatar ) {
$avatar = str_replace( 'http:', '', $avatar );
return $avatar;
}
add_filter( 'simple_local_avatar', 'ssl_simple_local_avatar' );



//フックやってみる
//自作関数 
function ssl_simple_local_avatar2( $avatar ) {
    
$avatar = str_replace( 'http:', '', $avatar );
return $avatar;  
    
}
add_action('get_avatar','ssl_simple_local_avatar2' );
or
add_filter  どっちでもうごいたぞ?

上のを参考に 下を作成した。

get_avatar って関数にフィルターする

関数内の$avatarの文字を置き換える ということ

管理画面もOK!

 

フィルター アクション 覚えたいな〜 基本を

::before ::after を使っていこう

擬似要素タグbeforeとafterを活用しよう!基礎知識と使い方を解説!

CSSの疑似要素とは?beforeとafterの使い方まとめ

アイコンフォントを使う例

◯:before {
  font-family: FontAwesome;
  content: '\f1e2';
}

引用ボックスを作る

 

手順リストを作る

.flow li:not(:last-child):after{
  font-family: 'FontAwesome';
  content: '\f0a7';
  display: block;/*前後に改行*/
  font-size: 2em;/*アイコンサイズ*/
  color: skyblue;/*色*/
  padding: 0.3em;/*余白*/
}
ブラウザ表示例

 

 

 

【CSS】content内で改行やスペースを入力する方法

 

white-space: pre-wrap;
  content: 'ウェーイウェーイウェーイウェーイ\Aフゥー!';
  font-size: 2em;
}

white-space: pre-wrap;
  content: 'ウェーイ    フゥー!';

 

【CSS】疑似要素の画像サイズを変更する方法

 

背景画像として表示させれば変更可能に

.example:before {
  content: '';/*何も入れない*/
  display: inline-block;/*忘れずに!*/
  width: 50px;/*画像の幅*/
  height: 50px;/*画像の高さ*/
  background-image: url(../img/face.png);
  background-size: contain;
  vertical-align: middle;
}

【参考】背景画像をレスポンシブにする方法

.example {
  position: relative;/*相対配置*/
}

.example:before {/*スペースを作る*/
  content: '';
  top: 0;
  left: 0;
  width: 100%;/*指定したい幅*/
  padding-top: 90%;/*画像の幅に対する高さ比率*/
  display: block;
}

.example:after {/*画像を絶対配置*/
  position: absolute;
  content: '';
  top: 0;
  left:0;
  display: block;
  width: 100%;/*幅*/
  height: 800px;/*どれだけデカくなってもはみ出ないであろう高さを指定*/
  background-image: url(../img/face.png);
  background-size: contain;
  background-repeat: no-repeat;/*画像を繰り返さない*/
  }

 

メールサーバー 引っ越しメモ

 

さくら219.94.155.217

 

■結論

1時間でかわる が念の為2個設定

POPアカウントを作成 ipアドレスで設定

POPアカウントを作成 mail.ドメインで設定

引っ越し準備が整ったら、ネームサーバーを切り替える

切り替えが済んだら、HPの切り替えが確認出来次第、

mail.ドメインで設定したほうのサーバーを 新しいサーバーに IP(IPだとリセットされないかも) or 初期設定(こちらがおすすめ)

古い方にメールが来なくなればok

注意点は、古い方のサーバーと同じサーバーのメールでテストしない。

(さくらで、メールを使用しないに設定できるが、完全に移行が完了してからね)

最初IMAPだった場合、それをIPに変えて

新規でPOPでIPで作成

後に、POPをサーバー名に

 

■試し

サンダーバード

現状IMAPになっていたので、POPのIP版を追加してみた

手動設定にて

受信 サーバーに IPを入れて あとは自動で再テストでOK

サーバーにあるメールがDLされる

IMAPのサーバーを IPに偏光

ーーーー

memo gold

d-makring.com

を引っ越し

ーーーー

その後サーバー切り替え

 

サンダー最終

POPの場合はサーバーを新規サーバーの初期ドメインに変更でOK 送信サーバーはssl もう一個ともに暗号化された認証は非対応 で 通常の認証で

取りこぼし防止用には

同じく2のアカウントにて対応すればよい

 

 

■切り替えたら

サンダーバード

imap mail.ドメイン
pop ipアドレス

これを移管後

imap 旧IP
pop 新ipアドレス

としたらサンダーバードおかしくなった
なんかかわらない??

imap 初期ドメインgoldsource.sakura.ne.jp
pop 新サーバー sv10887.xserver.jp

としたら変更がつたわりできた

 

ネットオウルだと 1時間で変更される

サブドメインの場合,www有りなしチェック

マルチサイトはwp-config に設定がかいてあるので注意

2箇所

define(‘WP_ALLOW_MULTISITE’, true);

/*音楽サイト用*/
define(‘MULTISITE’, true);
define(‘SUBDOMAIN_INSTALL’, false);
define(‘DOMAIN_CURRENT_SITE’, ‘www.memo.d-marking.com’);
define(‘PATH_CURRENT_SITE’, ‘/’);
define(‘SITE_ID_CURRENT_SITE’, 1);
define(‘BLOG_ID_CURRENT_SITE’, 1);

 

 

 

 

 

 

メールの移動を行う。

まずiphone

ではpop imap と同じアドレスを2個作成できます。

また受信サーバーにはmail.domein と ipアドレスと2つ作成できます。

つまりimap pop ともに 2つづつさくせい可能

POPの場合退避フォルダの作成ができない。(しかしPOP2個作成できるので、退避必要ないか、POP自体、設定買えても消えないし

見分けやすいように説明のらんに
POPメールアドレス IMAPメールアドレス としましょう。

また試しにIMAPのメール内にメールフォルダを作成しました。そして、そこにメールを選択して、移動させてみましたが、最初は、全部移動できなかった。

後に、もう一度移動させると、

パソコンのサンダーバードで確認すると、

新しくフォルダが出来、そこに移動してありました、すべて。。

一度iphone内で、過去のメールをスクロールして、読み込ませると、移動できるのか、軽く不明確ですが、必ず、すべてのメールが移動できたか確認下さい。

僕は、一度IMAPで退避させましたが、POPが全件取得していなかったので、もう一度もどしました、。すると、POPで再度メール受信できました。

IMAPでメールフォルダから避難させると、メールが受信フォルダからなくなる

別のアカウントだとどうなるのかは不明。

フォントファミリー webフォント等

こど7を見てて思った

Hiragino Sans とは?font-weight: bolder;とは

あとWEBフォントで代表は

google で Noto Sans Japanes とうしゅんでんきでつかってた

 

うちの課題は

CSSでの装飾の作り込み

レイアウトパターンの保持

装飾パターンなどがまず挙げられる

他、フォントなど

 

年1はそういう進歩をしないとな、、。

コンタクトフォームで送信完了ページに移管しない

結果はフッターカレンダーによるものだったので

ふったーに分岐でカレンダー表示させない

<div class="calender top_cal">
    
    <?php if(is_page('お問い合わせ')): ?>
    
    <div class=""> </div>
    
    <?php else: ?>
        
        <h3 class="calender_title">
    <i class="icon-calendar
"></i>営業日カレンダー
    </h3>
        
        
<?php 
   
    echo do_shortcode( '[business-calendar num=1 past=true future=true event=true]' ); 
       endif;
    ?>
    </div>

 

モバイルメニュー sidr.js でページ内リンクで移管の際 メニューが閉じない件

今すぐ覚えられる!HTMLでJavaScriptを読み込む(呼び出す)方法を現役エンジニアが解説【初心者向け】

Sidrでページ内リンクをクリック時、メニューを閉じる方法

 

<script>
       function js_alert() {
           $(".simple-menu").click();
           //alert("Pushed!");
       }
   </script>
<a <?php if($mega_url): ?>href="<?php echo  $url2 . $kousuke['mega_menu_a']; //リンク先?>" <?php endif; ?>   onclick="js_alert()" >

 

 

blogブログカテゴリか welcartカテゴリ商品カテゴリか分岐

elseif ( is_category() ):
    
        //welcartのカテゴリをすべて取得
    $wel_chilz = get_term_children($welcart_cat,'category');
    //現在のカテゴリを取得
    $this_cat_id= get_query_var('cat');
    //welcartのカテゴリに属するかチェック
    $welcat_yes = in_array($this_cat_id ,$wel_chilz);
    
    if($welcat_yes)://welcartか
    
        echo trim(wp_title('',false));//こうするとスペース消える
     echo '|商品カテゴリ|';
    
    else://ブログか
    echo trim(wp_title('',false));//こうするとスペース消える
     echo '|BLOGカテゴリ|';
    endif;//wel or blog end
・・・

https://www.javadrive.jp/phpfunc/array/index5.html

https://tenman.info/labo/snip/archives/7741

https://niwakasoft.jp/column/get_of_category/

スムーズスクロール #を除外させる方法 scroll.php

除外させるというより限定させる

<script>
$(function(){
   // #で始まるアンカーをクリックした場合に処理
   $('.d_navi_main_in a[href^=#]').click(function() {
      // スクロールの速度
      var speed = 400; // ミリ秒
      // アンカーの値取得
      var href= $(this).attr("href");
      // 移動先を取得
      var target = $(href == "#" || href == "" ? 'html' : href);
      // 移動先を数値で取得
      var position = target.offset().top;
      // スムーススクロール
      $('body,html').animate({scrollTop:position}, speed, 'swing');
      return false;
   });
});
</script>

 

フリックスライダーとフェイドアップコンテンツ 解決  window.onload = function

window.onload = functionは一度だけしかつかえないので

window.addEventListener(‘load’, function(){})

に変更することでいくつも使える

 

//これはローディング画像を出すスクリプト後入れ
window.addEventListener('load', function(){
    $(function() {
        $("#loading").fadeOut(0);
        $(".flickSlider").fadeIn(500);
    });
})

 

 

window.onloadに複数コールバック登録は不可!代わりの2つの方法

ie11 旧テンプレートのスライダーが遅れて表示される件 検証中

ieでプライベートブラウズにて。

同じスライダーを利用していても 新サイトはOK 古いのはだめ

= worpdress の バージョンの可能性がある  未検証

プラグイン必要ないものは切ってみたが変わらなかった

 

ヘッダーをみてみても、表示されるものと対して変わらない。。

アイオートらへんからもう表示されていない

1カラムはすべてOK??

整理したかの可能性もあったので ワードプレスのデバックオンにしてエラー直したが同じ

やはりバージョン化?

 

ちなみに フリックスライダーに ロードのjsが書いてあるが、実際機能していないので再検証

 

画面全体のローディングだが、ユナイテッドアスレみたいなのは¥かっこいいかも ロゴとかなら くるくるはいらつく topのみな 最初だけ少し遅いから

 

他の種類のスライダーもすべておかしい??

製作者が同じ? でも 以1カラムはおk

 

js場所とか?かと思ったが、、

 

バージョンアップにて、wpのJSファイルが変わって治るかもかも

bing 検索結果 おかしい まとめ

まず、bing も googleもほうとうは大差ない

ビシュウさんの結果は

webmaster に登録して調べたところ、

pcの検索結果のみ表示されていない。

スマホは大丈夫だった不燃木材で1P目。

 

なので桜の国外IPアドレス制限がもんだいだったようだ。

 

https://pc-pier.com/blog/2017/02/23/bing-out/

 

只今変更後、サイドURLを送信して反映待ちです。

さくらのもんだいかな 48時間?24h?

 

https://www.bing.com/search?q=%E4%B8%8D%E7%87%83%E6%9C%A8%E6%9D%90&go=%E6%A4%9C%E7%B4%A2&qs=ds&form=QBRE

順番にフェードアップ js cssで表現まとめ

https://littlethings.jp/blog/web/css-effect-scrollhttps://littlethings.jp/blog/web/css-effect-scroll

海外のウェブサイトでよくみる「要素が画面内に入ったらふわっとフェードインするあれ」の実装方法

 

【CSS/JS】スクロールして到達したときにUIをフワッと出す最低限のコード

 

https://arts-factory.net/user_agent/

サーバーが遅い MAMP その対処法

まず、ローカルがめっちゃ遅い そう思ったら、

クロームのパフォーマンスツールで ネットワーク

https://qiita.com/usagi-f/items/10f35969f08dd01fa635

 

それをミルト、まず呼び込みが遅いので、サーバーの問題や、

MAMP PRO で WORDPRESSが遅い! MAMPを高速化する4つのTips

これでmemory limit を 2048にすべてかえたった。

 

そして、ローカルの状態で パフォーマンスツールをやると、リンク切れの背景画像が 以外に何秒とかかかってるみたい まじか。しらんかった。 それを切ったらはやくなった。

 

あと、一応MAMPのキャッシュも使ったが、どうだっk経っけど いいのか??

 

やっぱりキャッシュjはだめだ。ローカルファイルの修正がすぐはんえいされない

 

また自宅の PCでチェックしたら、また遅い

 

TTFBがすごく遅い

今度はあすきみっとを停止したらなおった

参考記事

https://ygkb.jp/5608

 

 

それでもなんか遅い!

マックのユーティリティでアクティビティモニタを起動して見てみると

なんと、nodeというものがCPUを食っている。

前も合ったな、 dreamweberを消すと消えた。

そして、早くなった。

https://discussionsjapan.apple.com/thread/250757552

 

CPUがあつくなって、ファンが回り始めたら ドリのnodeが原因だ

そうなると、CPUをくうので、ローカルサーバーが遅くなるべくなるべし!

 

 

そして、どり再起動してもなるので、調べると

https://community.adobe.com/t5/dreamweaver/dreamweaver-cc-2017-process-quot-node-quot-high-cpu-usage/td-p/8727989?page=1

 

サイトの設定の自動コンパイルで ノードjsが常に働いてるからなるみたいで

自動コンパイルをすべてじはずしたら治ったよ

array_multisort で お客様の声 やクライアントの事例を並び替えた。配列の並び替え

まず過去記事array_multisortでけんさくすれば色々出てくる。

まとめ

お客様の声 koe_roop_d

 

<?php
    
        $args = array(
        'posts_per_page' => -1,
        'post_type'      => array('jirei','d_jirei'),  // カスタム投稿タイプ名
  'tax_query'      => array(
    array(
      'taxonomy' => 'client',  // カスタムタクソノミー名
      'field'    => 'term_id',  // ターム名を term_id,slug,name のどれで指定するか
      'terms'    => get_field('client_tax'), // タクソノミーに属するターム名
    )
  )
);
 
    $myposts = get_posts( $args );
    

        $ar1 = array(); 
     $ar2 = array(); 
    foreach($myposts as $key):
    $ar1[] = $key -> post_type;	
    $ar2[] = $key -> post_date;
//		$amounts2[] = $key -> term_order;
//	$amounts[] = $key['name'];
endforeach;
    
    
//		echo "<pre>";
//	print_r($ar2) ;
//	echo "</pre>";
    

    
    array_multisort($ar1,SORT_DESC, SORT_STRING,$ar2, SORT_DESC, SORT_STRING,$myposts);
    
if(! $myposts){ }
    foreach ( $myposts as $post ) : setup_postdata( $post ); ?>

と続く並び替え用の配列と 並び替えの配列数は同じでなければならない。

感覚的には、配列1が 1,0,1,0 だとして、それを基準に並び替える場合

配列2の該当場所が並び替わるという感じ

つまり配列2が さる,うま,ひつじ,とり だとすると

ASCで並び替えると 0,0,1,1となるので

さる,ひつじ,うま,とり という感じ。

今回はポストタイプ別にHP制作事例を表示し、その後デザイン事例、 登録新しい順ということ、。

日付のデータは数字だが、多分同じ日付だと 時間の前に スペースがあるので 数として同じに扱われているようで、 あえて 数字 スターリングにした。

上記は、mypostをならびかえたが、

下記はタクソノミーで$postsを並び替えた。

 

<div class="jirei_box_all <?php if(is_tax('client')): //クライアンとなら ?>  client_all <?php endif; ?>">
<!--★★★ループ基本-->
<?php
//					echo "<pre>";
//	print_r($posts) ;
//	echo "</pre>";
        $ar1 = array(); 
     $ar2 = array(); 
    foreach($posts as $key):
    $ar1[] = $key -> post_type;	
    $ar2[] = $key -> post_date;
//		$amounts2[] = $key -> term_order;
//	$amounts[] = $key['name'];
endforeach;
    

    
    array_multisort($ar1,SORT_DESC, SORT_STRING,$ar2, SORT_DESC, SORT_STRING,$posts);
    
if ( have_posts () ) :
    while ( have_posts() ) :
        the_post();
?>
    
<?php
    
    $post_type = $post -> post_type;

 

と続く

タームアーカイブページでは

$posts ととればよかったが $postと取ると、配列のしまい方が違ったので注意

メールサーバー移転の際、DNSのTTLによって反映時間が決まるということ

https://tanaka.sakura.ad.jp/2011/03/sakura-domain-nameserver-dns-ttl.html

日々のサーバ運用を行う中で、サーバ移転を行いIPアドレスが変更される機会は少なくありません。
しかし、DNSがなかなか反映されず「浸透しない」とつぶやかれている人をよく見かけます。
これは事前にTTLを小さくしていないために発生する問題ですが、今回はさくらインターネットを例に、DNSのTTLを変更する方法を解説します。
なお、ここで解説しているのは個別のレコード(Aレコード)を変更する時だけであり、ドメイン自体の移転などNSの変更の際に有効な手段ではありませんのでご注意下さい。

さて、DNSの場合は分散してサーバが設置されています。
そのため、DNSの情報が反映されることを「浸透」と表現されることが多いのですが、電子メールのようにサーバを中継してリレーしていくわけではありませんので、決して浸透していくわけではありません。
実際にはネームサーバとクライアントの間のどこかでキャッシュされていて、しばらくの間設定が反映されないために起こる現象です。
DNSは分散されているため、ドメイン管理者側ではどのネームサーバでキャッシュされているかがわかりませんし、当然のことながら世界中のネームサーバのキャッシュをクリアするわけにもいきません。
そのためクライアントによってアクセスが出来なかってもただ待つしかなく、なかなか反映されないとやきもきする事態に陥るわけです。

これを回避する方法はひとつであり、TTLを短くして事前にキャッシュの有効期限を短縮しておくことです。
ただし、TTLは短くても1時間、長ければ24時間以上に設定されていることもあり、事前に余裕を持って行っておかなければなりません。
一番理想的な手順は、作業開始時間から「TTLで示された時間分」だけ先にTTLを変更しておき、サーバ移転と同時にDNSのIPアドレスレコードを書き換え、TTLをもとに戻すという形です。
例えば、デフォルトのTTLが86400と指定されているなら、サーバ移転の24時間前までに作業を行う必要があります。

 

DNSの時間を測れるサイト

https://mxtoolbox.com/

こちらでドメインを入れて、結果のサーバをクリックで現れる

今回さくらのネームサーバーからxserver のネームサーバーだったが、

メールのみ、23時間たってもまだ古いサーバーに届くメールがある

メールアドレスで記憶しているのか、

メールソフトが記録しているのか不明だが、

(検証結果、再起動、新規メッセージでも同じドメインinfo@d-marking.comからのメールのみ古いサーバーに届く IMAPだからか? 他のIMAPでも送らたので、覚えているのは間違いない)

返信メールで送ると古いサーバー

違うメールアドレスで新規でメール送ると新しいサーバーに届く。

 

 

今後の対策、

ネームサーバーを指定するとTTLが変更できない。
Xサーバーは60だからまだましか??

さくらは24時間なので、まずい。

1.メールのみさくらにしている場合はttlを予め短くできそう。

2.ネームサーバでさくらにしてる場合、DNSにてさくらにまず向ける必要がありそう。

・スタードメインは予め、DNSを設定してから、ネームサーバーを変更できるので、スターはそちらで、。

・たしかお名前も同じくだった気が、。

・xドメインは最初にネームサーバーを変更しなければならないのでラグが起こりそう。予めDNSを入れれるように準備しな、。

 

3.DNSをxserverでも変更できるが、どうだったっけ??

https://www.xserver.ne.jp/manual/man_domain_dns_setting.php

多分、まだ、浸かったことないかも、。

ネームサーバーをxserverに向けてるやつは、ここで変更できるかも。

 

https://www.weblab.co.jp/staff/other/4342.html

 

メールだが、IPアドレスを受信・送信サーバーでもいけるようだった。

すずきさんの場合

アイフォンでさくらのサーバー xserver 2つのサーバーを受信サーバーにすれば

2こ同じアドレスにできた。

 

メールサーバー移転の際は、

そのように2つのアドレスを受信して、

落ち着いたら、ドメイン名に戻すと言うこと

 

 

Animate.css + wow.js

「Animate.css + wow.js」でWebサイトにアニメーションをつけてみよう

現在は Animate.cssが4.0になてるので注意

https://qiita.com/yaki-shake/items/71791a6453eaf0ca99f5
このサイトではanimateClass: ‘animate__animated’ でanimate__animatedにwowを適応させているのか?

とりま、
ただしアニメーションのクラス名も
fadeIn -> animate__fadeIn
と変わっているのでお気をつけくださいまし。
のこところ

animate.css
https://animate.style/ ここでスタイルチェック

wow.js
https://www.delac.io/wow/

設置

ヘッダー

 

  <link
    rel="stylesheet"
    href="<?php echo get_template_directory_uri(); ?>/0_d/js/animate.min.css"/>

<script src="<?php echo get_template_directory_uri(); ?>/0_d/js/wow.min.js"></script>

<script>
  new WOW(
      
  //{mobile: false}
      
  ).init();
    
    
   
</script>

挿入箇所

<h2 class="d_con_title2 wow animate__animated animate__bounce"><i class=""></i>BLOG</h2>

 <div class="tsuzuki_box2">   
    <a href="/ブログトップ/" class="btn_d wow animate__animated animate__fadeInUp" >BLOG TOP <i class=" icon-right-open"></i></a>
    </div>