【SWELL】好きな場所にニュースティッカーを設置する

【SWELL】好きな場所にニュースティッカーを設置する

ニュースティッカーとはこんなものです↓

企業サイトでお知らせを表示するのに用いられていることが多いですが、省スペースでたくさんの情報を表示できるので使い勝手がいいんですよね。

このブログでも新着記事を表示させる用途でティッカーを採用しています。

新着記事を普通に投稿リストブロックで表示させてもよかったのですが、下に各カテゴリの記事を表示させていて内容が重複することも多いためティッカーを使用しました。

このようにニュースティッカーは企業サイトだけでなく個人ブログでも使える要素です。

SWELLの標準機能にはニュースティッカーを表示させる機能はありませんが、コードを追加してカスタマイズすることで実装することができます。

ほぼコピペで完成するカスタマイズなのでコードを触ったことのない方でも安心!ぜひ挑戦してみてください。

ページの表示速度を考慮し、jQueryや追加外部ライブラリーなしで出来る方法を考えました!

CONTENTS

カスタマイズの説明

この記事で解説するニュースティッカーは、投稿リストブロックのテキスト型をニュースティッカーのように表示させるもので、新着記事に限らず投稿リストブロックで設定できる条件、表示出来るものはほぼ全て表示することができます。

※抜粋文、もっと見るボタンは表示できません。

ニュースティッカーは記事ページや固定ページにそのまま設置するのはもちろん、ブログパーツ化して使用することもできます。

ブログパーツにしてメインビジュアルの上に重ねるのもいい感じ◎

汎用性が高いカスタマイズなので、用途問わず好きな場所で使用することができます。

注意点として同ページにおけるニュースティッカーは1つまでとなっており、複数設置には対応していません。(別ページならいくつでも可)

カスタマイズの諸注意

カスタマイズする際の注意事項
  • 作業前にバックアップを取ることを推奨します。
  • カスタマイズは自己責任でお願いします。

このカスタマイズは子テーマで作業することを推奨しています。未導入の方はこちらの解説記事を先にご確認ください。

またfunctions.phpという重要なファイルを編集する必要があります。

記述ミスなどによりサイトが何も表示されなくなる場合もありますので取り扱いには十分注意してください。

子テーマやfunctions.phpについてよくわからない・編集に不安がある場合は、記事をご購入いただくのではなくお仕事として私にご依頼いただくことをおすすめします。

\ ご依頼はココナラかXのDMで /

変更履歴等

  • SWELL 2.13.0 動作確認済み(2024/11/22)
CONTENTS