Tailwind Logo

ブログ

ブログの記事を時系列で確認することが出来ます

Next.js

多言語サイトのコンテンツに切り替える

Next.js のテンプレートはすでに多言語対応のモジュールが入っているため、Sitecore 側の設定を追加することで比較的簡単に言語を増やすことができます。そこで今回は、日本語のリソースを追加したいと思います。


Next.js

Sitecore Horizon のインストール

これまで Sitecore の編集環境としてはコンテンツエディター、エクスペリエンスエディターと2つのツールを利用していました。全体を見渡すことができるコンテンツエディター、見たまま編集を実現するエクスペリエンスエディターという位置付けです。今回紹介をする Sitecore Horizon はその2つのいいところ取りの製品になります。


Sitecore Connect for Content Hub 5.0 のインストール

以前にこのブログでも Sitecore の CMS と Content Hub を連携させるコネクタのインストールの手順を紹介しましたが、コネクタの新しいバージョンがリリースされました。このリリースからは Sitecore Install Framework を利用したインストールに対応をしているので、今回はこの手順を紹介します。


Next.js

Hero エリアの部品を作成する(後編)

前回は新しいコンポーネントを作成して配置しましたが、まだ見た目は普通に HTML が表示されている程度の Tailwind CSS のデザインになっています。今回は見た目を少し変更するのと、合わせてコンテンツの属性を少し変更したいと思います。


Next.js

Hero エリアの部品を作成する(前編)

前回の記事でヘッダー、フッターのエリアを整理しました。今回はトップページで利用する Hero エリアのコンポーネントを新規に作成していきます。この手順を通じて、新しいコンポーネントの作り方を学んでいきます。


Next.js

ナビゲーションを分離する

前回は Tailwind CSS を利用できるところまで実施しました。今回はこれを利用する前に、レイアウトの中に記載されているナビゲーションのコードを別のファイルに分離する手順を確認していきます。


Next.js

Tailwind CSS を Next.js のサンプルに適用する

Next.js のサンプルは CSS のスタイルシートとして bootstrap が標準で設定されています。CSS のスタイルシートはさまざまなものが提供されていますが、今回は Tailwind CSS を利用する形に切り替えていきます。


Send

Moosend と Sitecore Send の紹介

昨年、このブログでも紹介をした Moosend のサービスを、Sitecore としてのサービスとして Sitecore Send という形で企業向けのサービスとして展開を開始しました。改めて製品の紹介と 2 つの製品の違いは何か?というのを今回は紹介します。



Sitecore Headless - GraphQL UI の利用

Sitecore XM に対して Headless Service をインストールすることで、GraphQL を利用してデータの取得が可能となります。今回は、データをどういう形で取得することができるのか、というのを紹介します。


Sitecore Headless - Sitecore First に変更する

これまで Sitecore の SDK のサンプルのコードを展開するところにフォーカスしていましたが、ここからは Sitecore で作業をしてコードで補完する形の開発をしていく手順に切り替えていきます。後半では以前に紹介をした空っぽのプロジェクトを作る手順を改めて確認して、実際につながるところまで進めていきます。


Sitecore Headless - Next.js ステージングの追加

前回の記事で、Next.js のサンプルを Sitecore に展開、また実際のデリバリーとして Vercel と連携する形まで用意をしました。今回は、もう少しテスト、検証をしやすくするためにプロダクションとステージング環境を分けて、ローカルでもテストする手順を紹介をしていきます。