What You Can Do with Breezi Apps
How Different Apps Work
This article will give you a short preview of what each of our main app’s basic user interface entails, along with a general description of what you can do. Keep in mind, the apps are quite versatile, and how they will look will largely depend on the content you add along with how you apply formatting and styles to each. Feel free to scroll down to find a specific app you’re curious about, or go through each one by one if you’re interested in learning about all of the options you have.
Note: we regularly add new apps, so some of our apps may not yet be added to this list.
With the Text app you can display blocks of text, or individual headings, format the different pieces of text that you add however you’d like using the WYSIWYG toolbar options (hyperlinking, changing colors, fonts, sizing, spacing, alignment, kerning, etc.) and you can insert images and videos within your text as well. You can have your text wrap around images and videos as well.
The Image app is used for displaying a single, isolated image by itself. Once you upload your image, you can crop and resize it if needed, link it out to another page or URL, add alt tags, and then play with the alignment and style options as needed. This app is ideal for displaying a logo, or stand-alone image on your page. You can display images in a number of different ways through other apps.
You can use the Navigation app to create a nav. menu, linking out to other pages on your site or external URLs, depending on your preference. Currently we do not offer a sub-navigation drop-down menu option, however you can add as many nav. links as you’d like, and create multiple menus if need be by simply adding new versions of the app. You also have a lot of ways that you can style your navigation menu, like applying “button” background effects or keeping more basic text links that you can style.
With the Video app you can display a single video player by simply clicking on the app toolbar (pencil icon) and then pasting the video URL from where it’s hosted (i.e. YouTube or Vimeo). If you’re using a video hosting service and our Video app for some reason isn’t recognizing and displaying your video after you add the URL and save, you can always use the Embed HTML app to display a video as well (as long as you have an embed code for it).
Need to display more than one video? You can use the Video Gallery app to display a row of videos, and after you add the videos by pasting in the URLs (same as with the Video app, above), you can resize all of the player thumbnails at once by clicking and dragging the resizer at the lower right corner of one of the thumbnails. You can also add a caption to display under each video player – double click it and a panel will open where you can add a caption. Currently you’ll need to add videos that you’d like for the gallery one by one, as you cannot simply add a YouTube channel URL to pull in all of the videos from your channel automatically.
One of my personal favorites, the Slideshow app lets you upload as many images as you’d like, and it then rotates through the images showing one at a time. You can customize how you’d like the image transitions to render by clicking the app’s settings option, and picking “Fade” or “Slide”, how long each image will display, and if you pick the fade transition you can specify how fast the fade happens.
You can have each image link out to another page, crop, resize, and add alt tags when you double click on an image and adjust the settings. To change the order of the images, mouse over one of them and click the up/down arrow icon next to the “X” icon (which removes an image from the slideshow, by the way), letting you drag and drop the images into the order you’d like. You can do some pretty nifty things using this app, like adding rotating background images using PNGs.
Similar to the Video Gallery app, this lets you add as many images as you’d like, and displays the thumbnail versions of them in a carousel so visitors can click through to see them all. Once someone clicks on an image, it enlarges in an overlay, and then you can click right and left arrows to see the other images in the gallery. To add captions, single click on an image. You’ll see a field under the image where you can enter text and format it using the WYSIWYG toolbar. In the image settings you can crop and resize, and add alt tags. You’ll notice if you mouse over the lower right corner of any of the thumbnails, you can click and drag the resizer to make all of the thumbnail images larger or smaller (in equal proportion) at once!
With the Blog app you can add posts, and for each you can add your text, images and videos, using the WYSIWYG toolbar for text formatting and adding media and links. To edit a post, double click on the image, title, or “Read more” link, hold for a few seconds, and release. This will take you to the blog post editor where you and add and modify the content of your post. There’s also a date picker and you can change the thumbnail image of the post by clicking it. The URL for the post will be generated based on the title (currently we don’t have an option to customize the URL). More blogging features will be coming soon, stay tuned!
Want to display your social media icons, linking out to your various profiles? With the Social Icons app, you can click into the app settings and then populate the URLs for your social profiles next to the matching social network. Then, you can pick from a number of different display options for how you’d like the icons to be styled and aligned.
Just paste your Facebook Page URL in this app‘s settings, and it will pull in a widget letting visitors “Like” your page. If you’d like, you can also select to display a feed of the most recent wall updates as well, also in the app settings. You can change or remove the title of the app too.
Once you add your Twitter id in this app‘s settings, it will start to pull in your most recent tweets and display them on your page. In the app’s settings you can select how many tweets to rotate through.
The Maps app simply pulls in a Google Map of your location, after you copy and paste the embed code that Google Maps gives you. Pretty straight forward, but helpful if you need to show your location on the map.
With the Carousel app, you can display multiple entries that will rotate using carousel functionality, and each “entry” can include an image (optional), a primary block of text, and then a secondary text field (optional). The image can be resized, and you can adjust the text formatting however you’d like. This app is commonly used to display testimonials and reviews, but you could certainly use it for other purposes depending how you’d like to showcase your content.
This app lets you display series of “entries” that a visitor can click through using a tab navigation menu that displays along the left side of the app. “Entries” consist of a title (which displays on the tab), and then you can add whatever text, images and videos you’d like using the full WYSIWYG toolbar. This app is good for displaying products and services, but it can be used for a lot of other purposes too.
Have a blog you want to pull into your site using an RSS feed? Just add this handy app, then click the app settings icon and paste in your feed URL and select how many posts you want to display at a time.
We do not currently have a video for the Embed HTML app’s user interface, since it will render differently based on what embed code you insert. This app is ideal for copying and pasting embed codes if you’d like to display a newsletter sign-up box (i.e. using MailChimp or Constant Contact), an e-commerce store and shopping cart (learn how to use Wazala for this), or an iframe.
The following apps all have a contact form option included, with a good bit of shared functionality among them.
The Banner app displays one image at a time, and with each image you can add text that displays over the image at the bottom, along with a button that sits at the lower right and can either link to another page or URL, or trigger a form in an overlay. If you add more than one entry, you’ll see right and left navigation that lets visitors click through. You can also set the entries to “auto-rotate” in the app’s settings. To adjust the form settings for the lower right button, hover over it and click the “Form Settings” button. You’ll also notice an up/down arrow icon, which will let you re-order your entries.
This app gives you an exposed contact form, and you can set the title, intro. description/instructions, and configure the form settings however you’d like. When someone submits a form, you’ll be notified via email with the submitted info., and the data will be stored in the app. You can check submitted forms anytime by clicking the “Inquiries” button, and you can export all submissions as well to a csv file. Lastly, you can set up an automatic follow-up email that sends to whoever fills out the form – just click the “Inquiries” button and then the “Edit Email Template” tab to customize the email.
Similar to the Contact app, the Button app lets you display a button that, when clicked, can either render a form in an overlay or link to another page or URL. By default there’s a main text field and a secondary “slogan” field, but to hide the secondary field you can click into the app settings and then change “Display Slogan Text” to “No”. Click “Form Settings” when you mouse over the button to configure the form options, and you can click “Inquiries” to see and export submissions and customize the auto-response email template that’s sent to someone after they complete a form. Here’s a quick tutorial on ways you can style your button, and you can create a circular button if you’d like as well.
Ask a Question
This is another exposed contact form app, very similar to the Contact app, but more simplified. You can add a title for the app, and in the settings customize the “Question” and “Email” field labels, as well as the “Thank You” message that displays when someone submits. Click “Inquiries” to view and export submissions, and also customize the auto-response email template that’s sent to anyone who fills out the form.
Have questions or comments about this how-to? Let us know in the comments area below!