STEP THREE OF FOUR
Replacing the images
Your own food, in the same frames.
Nicole arrives with placeholder images with measurements included, so the site looks finished as soon as you add your own media. Your own photographs are what make it your blog.
THE SHAPES
Where each photo goes, and its shape
Every photo sits in a fixed crop, so a picture of any shape keeps the page’s proportions. Match the shape and you choose what gets cropped; ignore it and the theme crops from the centre for you. Around 1200 pixels on the longer side is plenty for all of them.
SHAPES AT A GLANCE
Home hero — Upright 3:4 - the photo beside “Slow, cozy cooking for everyday tables”.
Category arches — Upright 3:4 - the four arched cards under the home hero.
Recipe photos — The featured image of each recipe. It shows at 3:2 landscape at the top of the recipe and as an upright 4:5 card in every grid, so keep the dish in the middle.
Photos inside a recipe — 3:2 landscape, framed - the two photos in each recipe’s story.
Meet Nicole and About — A circle on the home page and an upright 3:4 on About. A square or portrait photo of you works for both.
Photo strip — Squares - the six Instagram-style photos at the foot of the home page although we suggest you use the Instagram module for this area inbuilt with your Divi 5 theme.
Kitchen Favourites — Squares, 800 × 800 - the twelve product placeholders, also used in the “What you’ll need” panels.
STEP ONE
Find the placeholders
STEP TWO
Open the page in the builder
Open the page or recipe, click Enable Visual Builder, and hover the image you want to change. A small toolbar appears; click the cog to open its settings.
STEP THREE
Swap the file
In the module settings, click the image and choose Upload an image or pick one from the Media Library. Divi 5 keeps alt text in the media window rather than in the module, so set it there while you are choosing the file - describe your photograph, not the demo’s.
Change the picture inside the module rather than deleting the module and adding a new one: the module carries the CSS class that sets its crop and frame.
STEP FOUR
A product appears twice
Each Kitchen Favourites product is used on the Kitchen Favourites page and again in the “What you’ll need” panel of every recipe that uses it. The quickest way to replace one everywhere is in the Media Library: open the placeholder and use Replace if your site has a media-replace plugin, or upload your photo and swap it in each place.
STEP FIVE
The ones that are not image modules
Two photos are not Image modules. The dish behind the newsletter band is the footer section’s background: change it in that section’s Background tab, under Divi › Theme Builder. The photo at the top of each recipe is the recipe’s featured image, shown by the Single Recipe template: change it in the post’s Featured image box.
WORTH KNOWING
Before you upload
KEEP THEM SMALL
The demo photographs were exported at around 1400 pixels and 100 to 250 KB. A recipe with six photos straight off a phone at 4 MB each will feel slow however well it is built, and food blogs live on phone readers. Export at 1200 to 1600 pixels with the quality around 75.
THE WARM TONE IS IN THE PHOTOGRAPHS
Nicole’s palette is soft greige and clay, and the demo photographs sit comfortably inside it. A cold, blue-toned photograph will fight the page. If yours look out of place, a small warm tint usually settles them.
Next