> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/bonnita-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/bonnita-documentation/sections/all-sections-in-theme/featured-blog.md).
# Featured Blog
To add this section, please follow below steps:
1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Click **Add section** and choose "**Featured Blog**".
## Section Settings
| Setting | Description |
| ------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------- |
| Layout: | Select the width layout of the section to be either default to the body's width, 1170px, 1770px or full screen width. |
| Padding Container Full Width | Determine the spacing of the left and right sides if the layout 'fullwidth' is selected. |
| Margin Minus Top | Determine the minus integer of spacing top (which means the section will get closer to the section below it) |
| Spacing top - Desktop / Tablet / Mobile | Determine the spacing of the section from the top on Desktop, Tablet and Mobile. |
| Spacing bottom - Desktop / Tablet / Mobile | Determine the spacing of the section from the bottom on Desktop, Tablet and Mobile. |
| Background Color | Set the Background Color for the whole section. |
| Background Gradient | Set the Background Gradient for the whole section. If the gradient is none, then the background color will be applied if any. |
| Background Image | Upload/choose an image as the background for the section. |
| Title | Enter the title for the section. |
| Title Color | Set the title color for the section. |
| Title Border Color | Set the line-through color for the section title. |
| Enable Title Border | Enable to show the line through the section title. |
| Title Custom Width | Determine the width of the title content. |
| Title Font Size | Determine the font size of the section title on Desktop ranging from 10px to 50px. |
| Title Font Size Mobile | Determine the font size of the section title on Mobile ranging from 10px to 50px. |
| Title Spacing Bottom | Determine the spacing of the title from the bottom. |
| Description | Fill in the description text for the section. |
| Description Color | Set the color for description text. |
| Description Spacing Bottom | Determine the spacing of the description from the bottom. |
| Description Font Size | Determine the font size of the description text. |
| Alignment | Align content to the left, the right or center of the section. |
| View All | Fill in the text for the view all link. |
| View All Margin Top | Determine the spacing top of the view all |
| View All Margin Bottom | Determine the spacing bottom of the view all |
| View All Alignment | Align the view all to be either to the left, right or center of the section. |
| View All Font Weight | Select the font weight of the view all text. |
| Enable View All Border? | Enable to underline the view all. |
| View All Link | Enter the link to redirect viewers to after being clicked. |
| View All Color | Set the color for the view all text. |
| View All Icon | Fill in the icon for the view all link along with its text. |
| Icon View All Color | Set the icon color of the view all link. |
| View All Position | Select the position of the view all to be under the heading or to the right side of the heading. |
| Button | Enter the text for section button. |
| Link | Enter the link that the button redirects to. |
| Button Font Size | Determine the font size of the button. |
| Color - Background Color - Border Color | Set the color, background color and border color for both normal and hover states. |
| Button Background Opacity | Determine the transparency of the button background. |
| Button Text Transform | Select the text transform for the button to be either Lowercase, Uppercase or Capitalize. |
| Icon | Enter the icon (svg) for the button. |
| Button Spacing Top | Determine the spacing of the bottom from the top. |
### Blog Settings
| Setting | Description |
| ------------------------------- | --------------------------------------------------- |
| Select Blog | Select the blog to show its blog posts. |
| Item Per Row | Select the number of items per row. |
| Grid Gap | Determine the spacing between each post. |
| Posts Limit | Determine the maximum number of blog posts to show. |
| Posts Content Description Limit | Limit the content description by word count. |
| Text By | Enter the text prior to the post date. |
| Text On | Enter the text after to the post date. |
### Blog Item Settings
| Setting | Description |
| ------------------------- | ----------------------------------------------------------------------------------------------------- |
| Background Color | Set the background color for all blog posts |
| Blog Item Border Radius | Round the corners of all blog post cards. |
| Blog Content Margin | Determine the spacing of the blog content to its sides. |
| Image Margin Bottom | Determine the spacing of the blog post image from its bottom. |
| Title Font Style | Select the font style of the blog post title to be either normal, uppercase, lowercase or capitalize. |
| Title Spacing Bottom | Determine the spacing of the blog post title from the bottom. |
| Info Margin Bottom | Determine the spacing of the blog post info from the bottom. |
| Description Margin Bottom | Determine the spacing of the blog post description from the bottom. |
| Alignment | Align the Blog Post content to left, right or the center of the card. |
| Blog Link Text Transform | Select the style for the blog link to be either none, uppercase, lowercase or capitalize. |
| Blog Link Font Weight | Select the font weight of the blog post link. |
| Enable Border Box | Toggle to enable the border of the blog post card. |
| Color Border Box | Set the color of blog post card border. |
| Title Blog Color | Set the color of the blog post title. |
| Date Blog Color | Set the color of the blog post date. |
| Description Blog Color | Set the color of the description of the blog post. |
| Button Width | Determine the button width of the section. |
| Button Blog Color | Set the color of button text. |
| Content on Image | Toggle to display content on the image or below it. |
| Background Color | Set the background color of the content when the content is On Image. |
| Background Gradient | Set the background gradient of the content when the content is On Image. |
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://halosoft.gitbook.io/bonnita-documentation/sections/all-sections-in-theme/featured-blog.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.