How do I link to the next newsstory in the dataset ? The first pic on the site links to the picture of “I am title 06”, But when I place a second picture on the homepage it links to the same ? How to link it to the next story in line. “I am a title 05” ?
Dataset should connect to the repeater and not to a single item. When you connect a dataset to a repeater, the repeater knows how to create the items based on the amount of information that exists in the database.
When you connect a dataset to a single item it will always take the first item that exists in the database.
Currently a repeater allows a uniform layout for all items. In your design each item looks different (once the image on the right and once on the left).
To connect the images to the information from the database (and also the texts, links…) you will need to use Velo.
For example:
Define your elements ID’s:
Get data from News database:
Assign received news data to the elements (image, title…):
Final results:
Example code:
import wixData from 'wix-data';
const newsElements = [{
id: 'box1',
image: '#imageX1',
title: '#text3',
description: '#text4'
},
{
id: 'box2',
image: '#imageX2',
title: '#text6',
description: '#text5'
},
]
$w.onReady(function () {
getNewsFromDatabase();
});
//Go get the information from the news database
function getNewsFromDatabase() {
wixData.query('News')
.limit(6)
.find()
.then((reaults) => {
console.log(reaults.items)
assignDataToUIelements(reaults.items);
});
}
//After we have received the information, we now define which element will receive which information
function assignDataToUIelements(data) {
for (let i = 0; i < newsElements.length; i++) {
$w(newsElements[i].image).src = data[i].image;
$w(newsElements[i].image).link = data[i]['link-news-title'];
$w(newsElements[i].title).text = data[i].title;
$w(newsElements[i].description).text = data[i].shortDescription;
}
}
Learn more about it here: