Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feature: add CampgroundJsonLd component #1292

Merged
merged 2 commits into from
Oct 28, 2023
Merged

feature: add CampgroundJsonLd component #1292

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
93b4406
feature: add CampgroundJsonLd component
ryanmercadante Oct 19, 2023
212e9ef
Merge branch 'master' into json-ld-campground
garmeeh Oct 28, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
105 changes: 105 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ If you are using **`pages`** directory then `NextSeo` is **exactly what you need
- [Article](#article-1)
- [Breadcrumb](#breadcrumb)
- [Blog](#blog)
- [Campground](#campground)
- [Recipe](#recipe)
- [Sitelinks Search Box](#sitelinks-search-box)
- [Course](#course)
Expand Down Expand Up @@ -1089,6 +1090,7 @@ Below you will find a very basic page implementing each of the available JSON-LD
- [Article](#article-1)
- [Breadcrumb](#breadcrumb)
- [Blog](#blog)
- [Campground](#campground)
- [Recipe](#recipe)
- [Sitelinks Search Box](#sitelinks-search-box)
- [Course](#course)
Expand Down Expand Up @@ -1243,6 +1245,109 @@ const Page = () => (
export default Page;
```

### Campground

```jsx
import { CampgroundJsonLd } from 'next-seo';

const Page = () => (
<>
<h1>Campground JSON-LD</h1>
<CampgroundJsonLd
id="https://www.example.com/campground/rip-van-winkle-campground"
name="Rip Van Winkle Campgrounds"
url="https://www.example.com/campground"
telephone="+18452468114"
images={['https://example.com/photos/1x1/photo.jpg']}
address={{
streetAddress: '149 Blue Mountain Rd',
addressLocality: 'Saugerties',
addressRegion: 'NY',
postalCode: '12477',
addressCountry: 'US',
}}
description="Description about Rip Van Winkle Campgrounds"
geo={{
latitude: '42.092599',
longitude: '-74.018580',
}}
openingHours={[
{
opens: '09:00',
closes: '17:00',
dayOfWeek: [
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
'Sunday',
],
validFrom: '2019-12-23',
validThrough: '2020-04-02',
},
]}
petsAllowed
rating={{
ratingValue: '5',
ratingCount: '18',
}}
amenityFeature={{
name: 'Showers',
value: true,
}}
priceRange="$$"
/>
</>
);

export default Page;
```

**Required properties**

| Property | Info |
| ------------------------- | ------------------------------------------------------------------- |
| `@id` | Globally unique ID of the specific campground in the form of a URL. |
| `address` | Address of the specific campground location |
| `address.addressCountry` | The 2-letter ISO 3166-1 alpha-2 country code |
| `address.addressLocality` | City |
| `address.addressRegion` | State or province, if applicable. |
| `address.postalCode` | Postal or zip code. |
| `address.streetAddress` | Street number, street name, and unit number. |
| `name` | Campground name. |
| `description` | Campground description. |

**Supported properties**

| Property | Info |
| --------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------- |
| `geo` | Geographic coordinates of the campground. |
| `geo.latitude` | The latitude of the campground location |
| `geo.longitude` | The longitude of the campground location |
| `images` | An image or images of the campground. Required for valid markup depending on the type |
| `telephone` | A campground phone number meant to be the primary contact method for customers. |
| `url` | The fully-qualified URL of the specific campground. |
| `openingHours` | Opening hour specification of the campground. You can provide this as a single object, or an array of objects with the properties below. |
| `openingHours.opens` | The opening hour of the place or service on the given day(s) of the week. |
| `openingHours.closes` | The closing hour of the place or service on the given day(s) of the week. |
| `openingHours.dayOfWeek` | The day of the week for which these opening hours are valid. Can be a string or array of strings. Refer to [DayOfWeek](https://schema.org/DayOfWeek) |
| `openingHours.validFrom` | The date when the item becomes valid. |
| `openingHours.validThrough` | The date after when the item is not valid. |
| `isAccessibleForFree` | Whether or not the campground is accessible for free. |
| `petsAllowed` | Whether or not the campgroud allows pets. |
| `amenityFeature` | An amenity feature (e.g. a characteristic or service) of the campground. |
| `amenityFeature.name` | The name of the amenity. |
| `amenityFeature.value` | The value of the amenity. |
| `priceRange` | The price range of the campground, for example $$$. |
| `rating` | The average rating of the campground based on multiple ratings or reviews. |
| `rating.ratingValue` | The rating for the content. |
| `rating.ratingCount` | The count of total number of ratings. |

**Other**
| `useAppDir` | This should be set to true if using new app directory. Not required if outside of app directory. |

### Recipe

```jsx
Expand Down
145 changes: 145 additions & 0 deletions cypress/e2e/campground.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,145 @@
import { assertSchema } from '@cypress/schema-tools';
import schemas from '../schemas';

describe('Campground JSON-LD', () => {
it('matches schema', () => {
cy.visit('http://localhost:3000/jsonld/campground');
cy.get('head script[type="application/ld+json"]').then(tags => {
const jsonLD = JSON.parse(tags[0].innerHTML);
console.log('jsonLD', jsonLD);
assertSchema(schemas)('Campground', '1.0.0')(jsonLD);
});
});

it('renders with one amenity feature', () => {
cy.visit('http://localhost:3000/jsonld/campground');
cy.get('head script[type="application/ld+json"]').then(tags => {
const jsonLD = JSON.parse(tags[0].innerHTML);
expect(jsonLD).to.deep.equal({
'@context': 'https://schema.org',
'@type': 'Campground',
'@id': 'https://www.example.com/campground/rip-van-winkle-campground',
name: 'Rip Van Winkle Campgrounds',
description: 'Description about Rip Van Winkle Campgrounds',
url: 'https://www.example.com/campground',
telephone: '+18452468114',
image: ['https://example.com/photos/1x1/photo.jpg'],
address: {
'@type': 'PostalAddress',
streetAddress: '149 Blue Mountain Rd',
addressLocality: 'Saugerties',
addressRegion: 'NY',
postalCode: '12477',
addressCountry: 'US',
},
geo: {
'@type': 'GeoCoordinates',
latitude: '42.092599',
longitude: '-74.018580',
},
openingHoursSpecification: [
{
opens: '09:00',
closes: '17:00',
dayOfWeek: [
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
'Sunday',
],
validFrom: '2019-12-23',
validThrough: '2020-04-02',
'@type': 'OpeningHoursSpecification',
},
],
petsAllowed: true,
aggregateRating: {
ratingValue: '5',
ratingCount: '18',
'@type': 'AggregateRating',
},
amenityFeature: {
'@type': 'LocationFeatureSpecification',
name: 'Showers',
value: true,
},
priceRange: '$$',
});
});
});

it('renders with multiple amenity features', () => {
cy.visit('http://localhost:3000/jsonld/campground/multipleAmenityFeatures');
cy.get('head script[type="application/ld+json"]').then(tags => {
const jsonLD = JSON.parse(tags[0].innerHTML);
expect(jsonLD).to.deep.equal({
'@context': 'https://schema.org',
'@type': 'Campground',
'@id': 'https://www.example.com/campground/rip-van-winkle-campground',
name: 'Rip Van Winkle Campgrounds',
description: 'Description about Rip Van Winkle Campgrounds',
url: 'https://www.example.com/campground',
telephone: '+18452468114',
image: ['https://example.com/photos/1x1/photo.jpg'],
address: {
'@type': 'PostalAddress',
streetAddress: '149 Blue Mountain Rd',
addressLocality: 'Saugerties',
addressRegion: 'NY',
postalCode: '12477',
addressCountry: 'US',
},
geo: {
'@type': 'GeoCoordinates',
latitude: '42.092599',
longitude: '-74.018580',
},
openingHoursSpecification: [
{
opens: '09:00',
closes: '17:00',
dayOfWeek: [
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
'Sunday',
],
validFrom: '2019-12-23',
validThrough: '2020-04-02',
'@type': 'OpeningHoursSpecification',
},
],
petsAllowed: true,
aggregateRating: {
ratingValue: '5',
ratingCount: '18',
'@type': 'AggregateRating',
},
amenityFeature: [
{
'@type': 'LocationFeatureSpecification',
name: 'Showers',
value: true,
},
{
'@type': 'LocationFeatureSpecification',
name: 'RV Hookup',
value: false,
},
{
'@type': 'LocationFeatureSpecification',
name: 'Campfire',
value: true,
},
],
priceRange: '$$',
});
});
});
});
Loading
Loading