Component Creation and Template Linkage - Linked Fields Edition
Next to content, links are the most important data on a website. In this article, we will introduce how to describe this part in the form of a component.
Next.js
Next.js is a React-based framework that provides functionality to enable server-side rendering and static site generation using React.
Component Creation and Template Linkage - Date and Number Edition
As for dates and numbers, they can be managed using text fields, but it is possible to set up dates, times, and numbers as fields in Sitecore. In this article, we will show you how to use the fields so that you can structure your content using these items.
Component Creation and Template Linkage - Images
In the previous article, we created a template using a field format related to text. This time we will create a component that allows you to specify an image.
Component Creation and Template Linkage - Text Edition
Sitecore provides templates to define the data structure. This time, we'll create templates to define how data is stored and how it's called for display. We'll use sample code from the Styleguide's sample data to illustrate this process.
Create component
Once you have an environment ready to work with Sitecore, the steps regarding the addition of components are quite simple. In this article, we will see how the component is managed by adding the component without using the jss scaffold command.
Switch to multilingual site content
Since the Next.js template already includes a module for multilingual support, it is relatively easy to add more languages by adding settings on the Sitecore side. So this time, we would like to add Japanese resources.
Installing Sitecore Horizon
Until now, Sitecore's editing environment utilized two tools: the Content Editor for an overall view and the Experience Editor for WYSIWYG editing. The new tool we're introducing, Sitecore Horizon, combines the best features of both.
Creating components for the Hero area (Part 2)
In the last issue, we created and placed a new component, but it still looks like a Tailwind CSS design with just normal HTML displayed. This time we want to change the appearance a bit and also change a few attributes of the content.
Creating Hero Area Components (Part 1)
In the previous article, we organized the header and footer areas. In this article, we will create a new component for the Hero area to be used on the top page. Through this procedure, you will learn how to create a new component.
Separate navigation
In the previous article, we implemented Tailwind CSS to the point where it can be used. This time, we will review the steps to separate the navigation code contained in the layout into separate files before using it.
Applying Tailwind CSS to the Next.js sample
The Next.js sample is configured with bootstrap as the standard CSS style sheet, and although various CSS style sheets are provided, we will switch to using Tailwind CSS.
Setup Google Tag Manager in Next.js
This time, we will change things up a bit and show you how to apply Google Tag Manager with Next.js instead of Sitecore. We will also include a test.