SW Modules

Use SW Form when the form is the main content and should appear alone with optional headings and a styled form box. Use SW Pillar Section when a form should sit beside image, video, or copy.

Module Outer is the full-width band behind the SW Button section. Module Inner is the limited-width box that holds the button row, so its background stays within the page's content width. Use Outer when you want a theme color, custom color, gradient, image, divided background, Aurora, SVG overlay, or Animated treatment to span the section. Use Inner when you want a contained color, gradient, image, video, or Effect around the buttons. If a background looks narrower than expected, check which layer is selected before changing spacing or width settings.

The resubmit cooldown temporarily prevents a visitor from submitting the same form again. It works only when the HubSpot form submission setting is Show thank you message. If the form redirects to another page after submission, the cooldown cannot remain visible on the original page.

The same rule applies to a form inside SW Pillar Section. Its cooldown is separate from the cooldown for a standalone SW Form, so submitting one does not start the waiting period for the other.

Use SW Blog Listing Hero to feature a post at the top of the main blog listing. Turn on Show on Blog Tag page if the hero should also appear on tag pages. For the Blog All page, use the blog listing template setting Show hero on Blog All page; that option is not in the module. The listing hero does not appear on author archives or individual blog posts.

This guidance applies to the deprecated SW Blog Cards setup. Check these settings:

1. Confirm the listing hero is visible only where you expect it, usually on the first listing page.
2. If the hero displays the newest post, set Post start so the card grid begins with the next post.
3. Turn on Post start first page only when the hero appears only on page one.
4. Set HubSpot's Number of posts per listing page to Posts to show plus (Post start − 1).

Preview page one and page two before publishing because settings that look correct on the first page can leave a gap later.

This troubleshooting applies to the deprecated SW Blog Cards module. Check three requirements:

1. Turn off Use infinite scroll because it cannot run with the slider.
2. Turn on Use as slider.
3. Make sure the module has more posts than the Cards per row (XL) setting, which controls the largest desktop layout.

For a new blog layout, use SW Cards Blog instead of adding another legacy SW Blog Cards module.

Start with a 1280 × 640 image for the Smithworks theme. Its 2:1 shape works well in SW Blog Post Hero and listing cards. Keep the subject near the center with extra space around it because responsive layouts and social networks may crop the image differently. HubSpot recommends a 1.91:1 ratio for Facebook and LinkedIn link previews, so 1200 × 630 is also a sound choice when social sharing is the priority. Use a sharp, web-optimized image, add useful alt text, and preview the post on desktop, mobile, and your priority social channel before publishing.

You do not need to create a draft post before editing the blog post template. In HubSpot, open Settings → Content → Blog → Templates. In the Blog Post Template section, choose Actions → Edit to open the template in Design Manager. Edit the module settings there, preview the template, and publish the changes when they are ready. The template is shared by posts in that blog, so check an existing post before publishing a change that could affect every post.

Use SW Blog Post Hero for the article hero and title, SW Blog Post Body for the article content wrapper, and SW Blog Related Posts for read-next content at the bottom of a post.

Use SW CTA Popup for one simple popup with a quick setup. Use SW Popup Panel for multiple variants, page-specific rules, more positions, announcement banners, and finer triggers.