Customizing the Blog Post Section

Customizing the Blog Post Section

Blog Post Section Overview

In Shopify stores, showcasing blog posts helps drive traffic, establish thought leadership, and engage customers with valuable content. Tapita's Blog Post Section offers a visually striking way to present your blog content, featuring unique elegant frames that create a modern and engaging layout.

With Tapita's Blog Post Section, you can:
  1. Create Unique Frames: Display blog posts within elegant frames that add a touch of style and visual interest.
  2. Offer Centered Content: Perfectly align text and images in the center for a clean and balanced look.
  3. Provide a Responsive and Eye-Catching Display: Ensure your blog posts look great on all devices while maintaining the unique circular design and enhancing readability.

Blog Post Section Customization

For instructions on how to add a blog post section to your store, please refer to the Getting Started guide for Tapita Theme Sections Builder.
After adding your desired Blog Post Section to your store, you can configure the settings as follows within the Shopify Theme Editor:
  1. Configure the section header
    1. Heading: Enter the main heading text for the section (e.g., "Latest Blog Posts"). This is the primary title that will appear at the top of the blog post section.
    2. Heading Size: Select a heading size ("Small," "Medium," or "Large").
    3. Sub-Heading: Enter a sub-heading text.
    4. Description: Enter a section description.
    5. Alignment: Choose the text alignment ("Default" or "Center").
    6. Button Label: (Optional) Add text for the button label.
    7. Button Link: (Optional) Add a URL for the button.
  1. Configure the section body
    1. Select Blog: Choose the blog from your store to display in this section.
    2. Blog Limit: Set the maximum number of blog posts to display. The minimum is 3.
    3. Image Ratio: Select the desired aspect ratio for the blog post images.
    4. Show Author: Enable to display the author's name below each blog post. Disable to hide the author's name.
    5. Show Date: Enable to display the publication date below each blog post. Disable to hide the date.
    6. Show Excerpt: Enable to display a short excerpt from each blog post. Disable to only show the title and image.
    7. Read More Label: Enter the text for the "Read More" link (e.g., "See More," "Read Article").
    8. Show Nav: Enable to display navigation arrows for browsing through blog posts. Disable to hide the arrows.
    9. Show Pagination: Enable to display pagination dots to indicate the number of pages of blog posts. Disable to hide the dots.
    10. Auto Play: Enable to have the blog posts automatically scroll through the display. Disable for manual navigation.
    11. Loop: Enable to have the blog posts loop back to the beginning after reaching the end. Disable to stop at the last post.
  1. Configure the section footer
    1. Button Label: Enter the text for the button label (optional). This will add a button in the section's footer, if desired. Leave blank for no button.
    2. Button Link: Enter a URL for the button (optional).
  1. Configure the section layout
    1. Background image: Choose a background image for the section (if desired).
    2. Section Full Width: Toggle this setting to make the section span the full width of the screen. If disabled, customize the size at "Section max width."
    3. Content Full Width: Toggle this setting to make the content within the section span its full width. If disabled, customize the size at "Content max width."
    4. Padding and Margin: Adjust the padding and margin for the section on mobile, desktop, and tablet screens to control spacing.
  1. Configure the section color
    1. Background: Choose a color for the section background.
    2. Background Gradient: Set a background gradient. This allows you to create a subtle color transition in the background instead of a solid color.
    3. Foreground: Choose a color for the foreground elements.
    4. Title: Choose a color for titles.
    5. Button Background: Choose a color for button backgrounds. This determines the background color of any buttons within the section.
    6. Button Text: Choose a color for button text. This sets the color of the text displayed on the buttons.
    7. Input, button radius: Set border radius for input and button elements.
  2. Configure the section optimize
    1. Lazy Load Speed: The section will only load when it is scrolled to on the page, improving initial page load times.

Now you know how to customize the Tapita's Blog Post Section to showcase your blog content and create a visually appealing browsing experience! If you have any questions or need assistance, please don't hesitate to contact Tapita support.

    • Related Articles

    • Customizing the Mega Menu Section

      For any website, the menu does more than just list pages — it guides shoppers, shapes their journey, and helps turn visits into purchases. That’s why a clear, well-structured menu is essential to both user experience and store performance. Tapita ...
    • Customizing the Footer Mega Menu Section

      For any website, the menu does more than just list pages — it guides shoppers, shapes their journey, and helps turn visits into purchases. That’s why a clear, well-structured menu is essential to both user experience and store performance. Tapita ...
    • Customizing the Mega Menu #2 section

      For any website, the menu does more than just list pages — it guides shoppers, shapes their journey, and helps turn visits into purchases. That’s why a clear, well-structured menu is essential to both user experience and store performance. Tapita ...
    • Customizing the Lucky Wheel Section

      Delight your customers with a spin of excitement that could unlock exclusive rewards, while growing your email list! Welcome to the Tapita Lucky Wheel Section, a dynamic and creative tool designed to show your appreciation to customers in a fun, ...
    • Customizing the Scrolling Image Section

      Enhance your store’s visual appeal by showcasing images and media in a dynamic, scrolling format with the Scrolling Image Section. Whether you're highlighting products, promotions, or brand stories, the Scrolling Image Section transforms static ...