Features with Image
In this part of the documentation, we will show you how to customize the features section with images in the SaaSBold boilerplate, including updating feature details and images.
Last updated
In this part of the documentation, we will show you how to customize the features section with images in the SaaSBold boilerplate, including updating feature details and images.
Last updated
This section is designed to visually showcase the main features of your application alongside descriptive text.
The default features with the image section of SaaSBold include the following elements:
Heading: The main title that introduces the features section with an image.
Supporting Description: A brief description or tagline emphasizing the product's primary benefits.
Feature Heading: The feature's title, summarizing its main benefit or functionality.
Feature Description: A concise explanation of what the feature does and how it benefits the user.
Features Bullet Points: A list of key benefits or functionalities associated with the feature.
Image: An image showcasing the feature, providing a visual representation to support the text.
Locate the FeaturesWithImage Component File: Open the FeaturesWithImage component file located in components/Home/FeaturesWithImage/index.tsx.
Update the Title and Description: Modify the main title and supporting description to reflect your product’s unique selling points.
Update the Feature Heading and Description: Open the features data file located in the components/Home/Features/FeaturesData.ts.
Change the feature heading and description to highlight the key benefits of the feature.
Update the Features Bullet Points: Modify the checklist to list the benefits or functionalities associated with the feature.
Update the Image: Use an image that visually represents the feature. Make sure the image is relevant and high-quality.
Review and Save: After making your changes, review the updated features with the image section to ensure they effectively communicate the product's key benefits. Save the file and check the changes.
Clear and Compelling Headlines: Ensure the heading and sub-headings are engaging and convey the main message.
Highlight Key Benefits: The feature heading and description emphasize the main benefit.
Concise Bullet Points: Make the bullet points easy to read and understand. Each point should add value.
Relevant and High-Quality Image: To maintain a professional look, choose an image that is relevant to the feature and of high quality.
By following these steps and tips, you can create an effective feature with an image section that showcases your application's strengths, helping to attract and convert potential users.
