The idea for this simple improvement to the WebMatrix Bakery template came to my mind from a post in the WebMatrix and ASP.NET Web Pages forum.
The question was how to implement a random sliding effect on the main image of the Bakery home page.
I'll try to propose a solution based on jQuery and JSON.
Using the code
The Bakery template lends itself to this improvement because it already foresees that the product for the main image is randomly chosen every time the home page is loaded.
Nevertheless, the home page header is composed not only by the main image, but also by name, price and description of the represented product.
Therefore, if you want to change the main product periodically , you must update the other data that pertain to it.
Here is the new
Default.cshtml page, which you can simply substitute to the original one after creating a new site in WebMatrix 2 from the Bakery template:
Page.Title = "Home";
var db = Database.Open("bakery");
var products = db.Query("SELECT * FROM PRODUCTS").ToList();
var json = Json.Encode(products);
<h1>Welcome to Fourth Coffee!</h1>
The page is also available for the download.