Luxeritas AMPの ブログカードで 画像が表示されない

　サムネイルの LazyLoad を有効化してると AMP でブログカードの画像が表示されない（正確には 1 x 1px の透明画像が表示されてる）不具合修正（ver3.7.6 でのレベルダウン）

「Luxeritas」→「管理機能」を選択する。

「バックアップ」タブを開くと、3つのバックアップとリストアが用意されている。

まず、Luxeritas アップデート用テーマサイトから、「Luxeritas アップデート用のテーマ」をダウンロードする。

ダウンロードした、「Luxeritas アップデート用のテーマ」をアップロードして有効化する。

アップデート用のテーマが有効になっている状態で、サイトにアクセスすると次のメッセージが表示されるようになっている。

次に、Luxeritasのダウンロードサイトから最新バージョンのテーマをダウンロードする。

テーマの「新規追加」で、親テーマのみアップロードして有効化すると、【子テーマ】が有効になる。

これで、Luxeritasのバージョンアップが完了。

Luxeritasのバージョンは、「Luxeritas」→「管理機能」の【バージョン】タブで確認出来る。

Luxeritasのバージョンアップが完了すると、AMPページでのブログカードも画像が表示されるようになった。

「外観」→「カスタマイズ」→「ブログカード」で、【画像の位置】を左に設定しているが、AMPページには効いていない。

画像の位置を変更すべく、AMP 用スタイル 【style-amp.css】にCSSを追記する。

【 float:left; 】を追記してみるも、画像が右寄りになってタイトルや抜粋の文字が画像に隠れる。

画像に【 margin 】を設定するとうまくいった。

/*----------------------------------------------*/
/*    AMP ブログカードのカスタマイズ            */
/*----------------------------------------------*/
a.blogcard-href {
    padding:10px 10px 5px;
    min-height:105px;
    background-color:#f2ffcc;
    box-shadow:0 2px 5px #b0c4de;
    transition: .3s;
 }

/*マウスが乗ったとき*/
a.blogcard-href:hover {
    background-color:#fee;
    box-shadow: 0 4px 20px #b0c4de;
    transform: translateY(-5px);
}

/*画像(アイキャッチ)*/
.blogcard-img {
    margin: 0 10px 0 0;
    float:left;
    border: 1px #000000 solid;
}

/*合わせて読みたいの表示*/
a.blogcard-href:before {
    content:"こちらも参考にしてください。";
    position:absolute;
    bottom:0;
    right:0;
    padding:1px 10px;
    font-size:12px;
    font-weight:bolder;
    color:#fff;
    background-color:#005000;
}
/*----------------------------------------------*/

ブログカードはサーバーにキャッシュされ、一度表示されたカードは２回目以降は高速に表示される様になっている。このキャッシュは、管理画面の「リセット」のタブからクリアすることが出来る。