2021.10.11NOVA

NOVAの更新履歴

NOVAの更新情報です。お問い合わせから要件を「お知らせメール希望」でメールを送っていただくと、アップデートをお知らせします。

このページの目次

バージョン1.6
バージョン1.51
バージョン1.5
バージョン1.41
バージョン1.4
バージョン1.31
1. SIRIUSver1.553に対応
バージョン1.3
バージョン1.2
バージョン1.1

会員専用ページから最新のNOVAをダウンロードして、NOVAの使い方を参考にNOVAを更新してください。

バージョン1.6

サムネイル付き「いいね！」ボタンで画像を自動取得して表示するように変更

サムネイル付き「いいね！」ボタンで記事にサムネイル画像を設定しなくても記事画像から自動取得して表示するように変更。適用するには新しいコードに貼り直す必要があります。

ブロック要素を中央表示にする追加クラスを追加

NOVAの追加クラス（CLボタン）にブロック要素を中央化するクラスを追加しました。

ああああああ

↓↓↓↓

ああああああ

このように中央表示できなかった多くの要素が可能になりました。使用するにはnova-class.scdをインポートし直す必要があります。

追加クラス（CLボタン）に「追加クラス解説ページ」へのリンクを追加

追加クラスの使い方を簡単に確認できるように、当サイトの追加クラス解説ページへのリンクを追加しました。使用するとURLが貼り付けられます。

使用するにはnova-class.scdをインポートし直す必要があります。

その他の調整と修正

リンクテキストの青色を少し明るくして見やすい色に調整。

バージョン1.51

「4カラム」のタブレット表示を2x2表示に変更

NOVAの独自クラス「4カラム」は横に4つ表示できるクラスです。今までタブレット表示ではスマホ表示と同じように縦4つに表示されていたのを2x2表示に変更しました。

ボタンリンク横並びでボタン幅を均等表示するように変更

ボタンリンクを横並びにしたときにそれぞれ横幅を指定すると、PC表示では問題なくてもタブレットやスマホ表示でボタンがコンテンツ幅を突き抜ける場合があります。

そこでボタンリンクを横並びにした場合はボタンの幅が自動でそれぞれ均等に、また全て合わせてコンテンツ幅に合わさるように変更しました。これによりボタンリンク横並びで幅を指定することは不可能になりました。

このようにテキスト量に関係なく

自動で幅は均等になる

メインメニューフリースペース下段の追従機能のスクリプトを変更

メインメニュー（サイドメニュー）にインラインフレーム要素（Twitterのタイムラインなど）を設置すると、メインメニューフリースペース下段の追従スペースの位置が正しく習得できない場合があるため追従機能の内部スクリプトを変更しました。

その他の調整と修正

メインメニュー下部の追従広告を設定していないときに、ランキングなどで使われる評価★がアイコンフォントではなく画像が表示されてしまう問題の修正
ランキングテーブルで画像の横にリストを作成するとリストの点が画像を突き抜ける問題の修正
ランキングテーブルで「タグの生成方式」を「独自タグ」にした場合に、順位ごとの間にスペースを追加
ボタンリンク作成機能のプレビューでボタンの幅が正常に表示されない問題を修正
記事スライダー「均等に小さく表示」で日付の表示がズレてしまう場合がある問題の修正

バージョン1.5

記事一覧のサムネイルに「画像の遅延読み込み」を実装

「ブログモードのトップページ」と「カテゴリーページ」の記事一覧のサムネイル画像に「画像の遅延読み込み」を実装しました。（他の画像は「遅延読み込み」されません）

「画像の遅延読み込み」では画面に表示されている部分の画像を読み込み、表示されていない部分は画面のスクロールに合わせて順次読み込まれます。

SIRIUSブログモードの問題点

SIRIUSのブログモードでは記事一覧のページ分けの設定がありませんので、トップページにすべての記事が表示されてしまいます。

そのサイトに1000個の記事があり、記事それぞれにサムネイルを設定すると、トップページを開いた瞬間に1000枚の画像の読み込みが発生てしまい、表示するまでに時間がかかってしまいます。

これはユーザビリティやSEOを考慮すると大きな問題です。

そこでNOVAでは表示できる記事数を300個に制限し、下部にサイトマップのリンクボタンを追加して誘導していました。「画像の遅延読み込み」を実装で記事数の問題がなくなったため表示記事数を「300」から「全て表示する」ように変更しました。

通常のLazyLoadでは画像がスクロールされるまで表示されないため、Googleのロボットには「画像が無い」と判断されSEOに悪影響を与える可能性があります。そこでNOVAではGoogle推奨のIntersectionObserver API と polyfill を使用した画像の遅延読み込みを実装しています。

メインコンテンツ内で使うプロフィールのデザインを追加

サイドメニューのフリースペースで使用していたプロフィールカードをメインコンテンツで使用するためのデザインを追加しました。

表示項目が増えたためすでにサイドメニューでプロフィールカードを使用している場合は、コピペせずにこちらを参考にして新規で作成してください。