Food Recipes
Food Recipes
Welcome to the “Food Recipes” documentation.
Looking to integrate food recipes into your website? Our block will assist you in presenting delicious dishes and culinary creations in a way that aligns perfectly with your style and appeals to your audience.
In this guide, we'll show you how to use the editor to customize your food recipes block.
Step 1 : Open the Editor
1. Go to Food Recipes templates.
2. Click on "Edit" after choosing your template.
class="flex justify-center items-start h-auto w-auto" alt="">Step 2: customize the content
Welcome to the “Food Recipes” documentation.
Looking to integrate food recipes into your website? Our block will assist you in presenting delicious dishes and culinary creations in a way that aligns perfectly with your style and appeals to your audience.
In this guide, we'll show you how to use the editor to customize your food recipes block.
Moreover, you can edit the recipe ingredients and steps, including text and images. Lastly, you have the option to include tips for your food recipe.
class="" alt="">Step 3: Configure settings
Here, you'll handle the settings:
1. Start with container where you can choose to include a background and border, modify their colors, and fine-tune padding, width, and roundness.
class="flex justify-center items-start h-auto w-auto" alt="">2. You can adjust the padding, height, and roundness of the cover, along with changing the name color.
class="flex justify-center items-start h-auto w-auto" alt="">3. For social elements, you can activate the absolute and new tab mode, set a border, customize their roundness, adjust the gap between them and the padding. Additionally, you'll choose their positioning and change their colors.
class="flex justify-center items-start h-auto w-auto" alt="">4. In the details section, you can add a background and border, select the icon's position and color, and make adjustments to roundness, width, padding, the gap between them, and add separators while changing text colors.
class="flex justify-center items-start h-auto w-auto" alt="">5. Next, for ingredients, you can include title, background, border, and images.
Fine-tune the padding, gap, and roundness.
Choose the number of columns, section positioning, and add icons.
class="flex justify-center items-start h-auto w-auto" alt="">6. When dealing with steps, you can include title, images, style adjustments, step and image numbering, and choose to display your steps in an accordion format.
class="flex justify-center items-start h-auto w-auto" alt="">7. Lastly, for tips, you can choose to show their title, background, and border, customize their styles, and alter colors to match your design preferences.
class="flex justify-center items-start h-auto w-auto" alt="">Step 4: Preview
Lastly, you can click on “Preview” to see how your food recipe block looks on both desktop and mobile devices. After this, you can proceed to the next step.
class="flex justify-center items-start h-auto w-auto" alt="">