gatsby-source-pexels
v1.0.1
Published
A source plugin for Gatsby to query images from the pexels API
Downloads
2
Maintainers
Readme
Gatsby source plugin for searching image from https://www.pexels.com/.
Installation
npm i gatsby-source-pexels --save
Usage:
{
resolve:'gatsby-source-pexels',
options:{
protocol:'http',
query:'city skyscrapper',
page:1,
per_page:15, //Max = 40
token: '[YOUR TOKEN]'
}
},
//Can use plugin more than once, each node has searchTerm to decipher
//the difference between the images, e.g to find all aeroplane images
//images.filter((img)=>img.searchTerm === 'aeroplane')
{
resolve:'gatsby-source-pexels',
options:{
protocol:'http',
query:'aeroplane',
page:1,
per_page:15,
token: '[YOUR TOKEN]'
}
}
Example query
{
"node": {
"src": {
"large2x": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940",
"large": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&h=650&w=940",
"original": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg",
"medium": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&h=350",
"portrait": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=800",
"small": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&h=130",
"square": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=1200&w=1200",
"landscape": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=627&w=1200",
"tiny": "https://images.pexels.com/photos/313782/pexels-photo-313782.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=200&w=280"
},
"searchTerm": "city skyscrapper",
"url": "https://www.pexels.com/photo/high-angle-view-of-cityscape-against-cloudy-sky-313782/",
"photographer": "Quintin Gellar",
"width": 5103,
"height": 3320
}
}