Style settings for your Flow

Once you've picked your theme, let's break down all the style settings

D
Written by Davy Laudet
Updated over a week ago

First of all, if you haven't yet, check out this article on the different themes available in Flowbox.

Once you've selected your theme, you can go into the individual style menus to fully customize your Flow.


Let's go through these menu options one by one.

General

  • Background color: the background color behind posts.

  • Width: a fixed pixel width for the Flow. The Flow will determine its own width based on the space available if unset (Auto).

  • Height: a fixed height for the Flow. The Flow will determine its own height based on the number of posts available to display if unset (Auto).

  • Post padding: the distance between posts in the Flow.

  • Post limit: the number of posts that will be shown in a Flow.

  • Columns: the number of columns that you want in a Grid theme.

  • Rows: the number of rows that you want in a Grid theme.

  • Slides (Carousel theme only): the number of posts visible in the carousel. The Flow automatically determines the number of posts based on the width of the carousel if unset (Auto).

  • Mobile slides (Carousel theme only): the number of posts visible in the carousel when viewed on a mobile device. The Flow automatically determines the number of posts based on the width of the carousel if unset (Auto).

  • Highlight time (Auto themes only): the number of seconds you wish the highlighted post to be shown for.

  • Font: the inherit (default) setting means that the Flow will adapt your site's CSS. You can also choose from other available fonts.

  • Infinite scroll: if the toggle is switched on, the 'Show More' button will be hidden and the Flow will refill with more available posts when a visitor scrolls to the bottom of the Flow.

  • Autoplay videos: if the toggle is switched on, the Flow will automatically play videos in thumbnails (without sound). NOTE: Autoplay will not work for Youtube videos.

  • Post count: the number of posts that will be loaded in a Flow, when you are scrolling through them in the gate, i.e., not just the total number of posts that will be visible on the page.


Posts

  • Post color: the color for the backgrounds in posts. If no extra content besides post media (photo or video) is displayed, this background is not visible.

  • Text color: the color of all text on Posts and in the popup.

  • Hashtag color: the color of all hashtags on Posts and in the popup.

  • Text size: the baseline font size for text on Posts.

  • Larger posts: makes all posts larger.

  • Minimalistic: hides all extra content besides post media (photo or video). This setting will override other style settings.

  • Engagements: displays post engagements (the number of likes and comments).

  • Same size post: if the toggle is switched on, all posts will be set to the same size.

  • Post text: the original post author's caption on the posts in the Flow.

  • Popup text: the original post author's caption on the posts in the popup.

  • Center Post Header (Card and Carousel themes only): center the icon and text displayed at the top of the card.

  • Post interactivity: adds a hover effect on Posts.

  • Profile name: the original post author's username.

  • Profile image: the social media icon from where the source was collected. If it is a custom post, it will display the profile image added to the post.

  • Logotype: the social media logo from where the source was collected.

  • Post age: the time since the original author posted the media (image/video). This is not based on when the post was collected nor when the Rights Request was granted.
    ​


Buttons

Call to Action (CTA) Button Settings:

  • Button color: the CTA button background color.

  • Text color: the CTA button text color.

  • Rounding: a rounding on the CTA button. 0px means that the button will have right angles, whereas 4px and more will show a softer curve.

Load More Button Settings:

  • Show load more button: the 'Show More' button at the bottom of a Flow. This is hidden if you have enabled 'infinite scroll.'

  • Button color: the button color.

  • Text color: the button text color.

  • Rounding: a rounding on the button. 0px means that the button will have right angles, whereas 4px and more will show a softer curve.


Products

  • Enable products: use product displays in this Flow. If turned off, posts will only show caption.

  • Title: the text that you want displayed as a header at the top of all products added.

  • Button text: the text to be used on all product CTA buttons.

NOTE: only edit the Title and Button if your Product Catalog is only one locale (one market). Otherwise, edit this in your Product Catalog settings.

  • Show price: the price of the product.

  • Stock availability:

    • None: default behaviour, displays all products regardless of stock status.

    • Show stock status: same as above, but also displays a text below the product's name stating the stock status.

    • Hide product: hides out of stock products.

  • Hide posts: hides posts in the Flow that have no products tagged.

  • Show sale price: the old price in combination with the new sale price.

  • Show sale badge: a circular badge with text if a product has an ongoing sale price.

  • Sale badge text: choose to display 'Sale' or the percentage value in the circular sale badge.



Ratings

  • Enable ratings: if the toggle is switched on, product reviews will be shown. You must have an account with Trustpilot that enables product reviews in order to use this feature in Flowbox. Read more about our Trustpilot integration in this article.

  • Show number of reviews: the number of product reviews for each tagged product.

  • Hide ratings: hide low-rated reviews.

Flowbox only supports Trustpilot product reviews. If you do not have this feature enabled, talk to your Trustpilot customer contact and mention that you are a Flowbox customer to receive a discount.


Banner

  • Enable banner: if the toggle is switched on, you can create a banner for your Flow.

Note: If you're planning on displaying your Flows on multiple pages, in multiple locales, it's strongly recommended that you create your banner on your own site, as this feature is not location-specific and customization options are limited.

  • Primary text: your Flow title, where we recommend an attention-grabbing title. Examples include: 'Shop our best Instagram looks' or 'Be a part of our #community'.

  • Primary font size: the baseline font size for the tagline.

  • Secondary text: your Flow subtitle, where we recommend explaining the purpose of your Flow and how your customers can get involved. A typical subtitle includes your custom hashtag and Instagram handle, for example: 'We love seeing you enjoy our products. Tag @company on Instagram and use the hashtag #LoveCompany to be featured here'.

  • Secondary font size: the baseline font size for the subtitle.

  • Background color: the background color for your banner.

  • Primary color: the color for your primary (tagline) text.

  • Secondary color: the color for your secondary (title) text.

  • Height: a fixed height for the Flow banner.

  • Position: where the banner will appear in relation to the Flow (top, bottom, or as a card - meaning it will appear as a post in the Flow).

  • Logotype: add an URL to display a logo in the banner.

  • Hide logo on mobile: if the toggle is switched on, the logo will be hidden on mobile devices.
    ​


Email

For email settings, please see this comprehensive article.

We also have a list of dedicated support articles for specific email providers:


CSS

For CSS settings, please see this set of articles:


​

Did this answer your question?