Content Settings | User Roles | Security | Page Creation & Tips | SEO | Landing Pages | Maintenance Pages
What is flowww?
FlowwwSites is a Managed Website Service, which is a cost-effective, flexible approach to websites where the provider (FlowwwSites by Kayak) maintains technical items such as security, updates, and uptime. By taking care of the technical aspects of your website, FlowwSites lets you focus on your content instead of the tech.
External links provided as a courtesy. Use at own risk.
How do I make a site?
To start, Sign Up for an account. Our platform creates the account, adds you as a User, and initiates a 7-email onboarding sequence (1 per day). Each one provides tips and guides you through an aspect of using Flowww Sites.
The first email prompts you to set your password. After that, you can sign in and start adding content (type it in, copy/paste, or import from another site). It’s easy. And as soon as you log in, your Site is already live so you don’t need to ‘launch’ anything. Note: the Site is set to not-index by default to allow you to start building your website. Change that setting once you want search engines to index your pages.
See Getting Started for details.
- THE EASY WAY: draft your content and get ready to paste it into pages you create.
- THE EXPERT WAY: export your content from another site, import into your new site.
Standard site setup for your account:
We install a demo page. You can add more pages as needed, edit menus, add widgets, etc. You’ll see templates for Home Page, Default Page, Landing Page, and Blog pages on the Right sidebar under Page Attributes.
I’m not a developer. What do I need to install?
Nothing. Except for your content, that is. See Getting Started. Add images and text via the Gutenberg Editor. Add, Move, or Drag and Drop “Blocks” of different content types. Even manage columns.
Hover over a page area/block to reveal a PLUS sign. Click it to reveal a variety of content blocks, formatting blocks, layout blocks… even specialized or custom blocks. Then build your page with them. Or, look to the top left to see that PLUS sign, as well as Redo/Undo arrows.
Who’s this Eddy person I keep hearing about?
Eddy is our support moniker. It’s a shared account for our whole support team. Rather than saying “support@”, we thought we’d have some fun and name our group, “eddy@“. Support note: If you suspect your site is down, your IPv4 address has probably been blocked by our anti-spam tools. If you are truly down, we are all down, so you can bet we are on it!
Does flowww feature Data Protection?
“Data protection” is often interchanged with website backups. But, it’s much more that that. The most common elements of a solid data protection policy include:
- website backups at both server and website levels
- implementation of SSL (HTTPS protocol)
- requires users to have complex passwords
- is hosted on a reputable service provider
- incorporates IPv4 address blocking
- is proactively maintained
- additional Users are required to subscribe and agree to terms
Flowww Sites has all of these elements in place. 👍🏼 View full data protection measures.
If you get “This site can’t be reached” message when visiting your site… it means that you can’t see it because your location’s IP address has been blocked. Before you submit a support ticket, check that your site is actually down.
It’s how we keep the hackers out. No, you aren’t a hacker…you just did something that is hacker-like, such as attempting to log into your account and using an incorrect password, or attempting to log in multiple times trying to guess what your username was. There are more, but you get the idea.
Getting back into your site.
First of all, don’t panic. If your site was actually down, ALL of our sites would be down, and we’d be doing the panicking for you. 😱
Easy fix…
- In a browser, go to “what-is-my-ipv4.com” and look for the IPv4 number. It’ll look like this: 000.000.000.000
- Submit the number to flowww support for whitelisting.
Tip: If you log in from other locations, such as office, home, cafe, etc, send all those numbers to support. Once whitelisted, clear your browser cache and open a new tab and type in your website address. You should see your site again then. If you still see the error message, consider restarting your device.
Note: some service providers change your IPv4 address from time to time as a security measure. Simply send us the new address each time.
FlowwwSites User Roles:
- Website Manager (full access for savvy marketers and webmasters)
- Content Manager (modified access for those wishing to focus on content and marketing activities)
Website Manager
- Assumed to be experienced in a WordPress or similar environment
- Assumed to wish to import content (XML) from a previous site, as well as enter content by typing and uploading images, styling by pre-sets and CSS, publish pages.
Content Manager
- Assumed to be inexperienced in a WordPress or website management environment
- Assumed to enter content by typing and uploading images (replace content in Demo pages), styling by pre-sets, edit pages.
Why flowww?
Our FLOW theme is based on a proven link strategy we refer to as “flowww.” Also, see Why Flowww for your business.
Flowww helps guide prospects effortlessly through your website. When “Flows” are executed well, they become sales funnels. It’s a proven strategy that does more than convert visitors in decision-maker roles into leads; it creates champions and advocates of website visitors in researcher mode.
The Templates in FLOW Themes are available for both the HubSpot CMS and WordPress CMS. FLOW for WordPress is available exclusively through our flowwwsites Site as a Service. FLOW may not be purchased separately at this time. FLOW for HubSpot is available exclusively to Kayak clients.
a flow state; in the zone; fluid; effortless; a state of mind; progressive…
– Randy Milanovic, Kayak Marketing
At the core of ‘flowww’ is a simple but effective link strategy:
- links deployed in this order can form an excellent sales funnel:
- inline (linking phrases within content to other pages = satisfies the visitor’s passive exploration needs )
- sidebar (contextual navigation of 3-5 related pages = lets visitors dig deeper. Tip: main navigation and footer navigation are also contextual.)
- graphical CTAs (linking to offer pages: downloads, tools, etc = conversion opportunity where the visitor identifies themselves and sets cookies for on-site tracking)
- buttons (action-oriented activities: buy now, contact us, subscribe = marketing qualified lead)
Our Forever Free subscription never expires.
Our team is so committed to helping small businesses and organizations grow, you can enjoy a flowww site free. Upgrade to unlock advanced functionality. Both Free and Upgrade plans include free website maintenance. That lets you focus on your content instead of the tech.
Zero Tolerance for Bad Behaviour
- First instance: suspension of support services for 3 days.
- Second instance: suspension of Site as a Service account for 3 days.
- Third instance: termination without refund.
Be respectful. It’s easy.
5 Critical Steps for Creating Pages
Step-by-step web page creation.
Pro-tip: create items in the order presented:
- Create your content
- Create your pages
- Add links
- Add menus
- Add widgets
1. Create Content
- Text
- H1 (headline – only one, created from your page title when published, can be overwritten in FLOW theme)
- Subtitle (a FLOW theme feature)
- H2 (smaller headline – can have many)
- H3 (smaller still headline – can have many)
- H4 (smallest headline – can have many)
- Paragraph (can have many)
- Blockquote (quotes version of a paragraph)
- Pro-tips:
- Write pages as long as needed to get your message across (there are no set rules to page length)
- If you don’t have a lot of info, consider combining pages (people regret going to a page and finding the content drab or too complex)
- If you have a lot of content, consider making many pages (one per topic)
- Think of Headlines like a book: one title, several chapters, countless smaller sections and paragraphs.
- Blog articles are pages. Publish quality content regularly.
- Images
- jpg (photos, best compression for smallest file sizes)
- png (graphics, such as logos and diagrams, allows transparency of white areas)
- Always crop images to the size needed. In flowww Site as a Service, there are 4 main sizes:
- 1920×920 pixels (home page, should be optimized to less than 400k)
- 1920×620 pixels (regular pages, height can range from 360-920 pixels, be consistent, should be optimized to less than 200k)
- 600x600px (Calls-to-Action CTAs, on-page images, mobile header images, page featured images, should be optimized to less than 60k)
- 800×600 pixels (blog featured images and on-page images, should be 800 pixels wide by any height, ideally horizontal, should be optimized to less than 120k)
- Name image files descriptively: name-files-descriptively-1920×620.jpg and only separate words with a dash only (no spaces, underscores, etc.)
- Videos
- embed videos from Youtube, Vimeo, etc (easy and best playback quality)
- never upload videos or podcasts (short audio clips are ok) as external services like Youtube, Vimeo, etc are made for playback
- The Home page allows you to set a video header/hero (YouTube or Vimeo).
2. Page content considerations:
- page-level:
- the header section (often referred to as a billboard or hero) is designed for people wishing to make contact
- below the header section is designed for people wishing to learn more about what your business does (researchers)
- site-level:
- home (help people know they are in the right place, extra 1-3 widget section)
- inside (information on services, products, etc)
- contact/landing pages (contact forms, download PDFs, etc)
- blog (informational content mainly for researchers)
3. Create Pages
- Header (hero) Section: settings found at the bottom of the page: Hero image, Mobile Hero image, Alternate headline, optional Caption/Sub-head, up to 2 CTA Buttons (see gallery image below)
- Page Content Section: simply start typing. Hover over a section to see the + sign, and add different content blocks, including columns, galleries, images and much more (see gallery image below)
- Sidebar Section: differs on each page template. No sidebar on the Home template, Contextual menu and CTAs on the default page template, forms on Landing Page template.
- Footer section: add 1-6 widgets, copyright notice, etc
- Yeost SEO Section: between the Page Content section and the Header (hero) section. Write concisely as this is what searchers will see in Google search results. Write unique descriptions for each page to prompt viewers to click to your site.
- Theme controls: are found in two places: at the bottom of every page just below the content area and on the right sidebar of every page.
Page Header Settings (bottom of every page)
4. Link Strategy (the art of flowww)
- links deployed in this order can form an excellent sales funnel:
- inline (linking phrases within content to other pages = satisfies the visitor’s passive exploration needs )
- sidebar (contextual navigation of 3-5 related pages = lets visitors dig deeper. Tip: main navigation and footer navigation are also contextual.)
- graphical CTAs (linking to offer pages: downloads, tools, etc = conversion opportunity where the visitor identifies themselves and sets cookies for on-site tracking)
- buttons (action-oriented activities: buy now, contact us, subscribe = marketing qualified lead)
5. Create the Navigation
- Once your content has been created, your pages have been built, and your link strategy has been put in place, it’s time to build your main navigation (NAV Menu).
- Pro tips:
- Keep it simple, smarty. Fewer items are WAY better than many items or endless drop-downs. Mega-menus aren’t included in flowww for a reason, they are terrible UX (user experience).
- Consider creating Menus to place into the Main nav, a Footer nav, and tailor side Navs to each page’s related topics.
- Publish pages from the outside in. Meaning, the least used page first, the Home page last. Then add the pages to your menus.
- Congrats, you are now launched!
5. Forms tips:
- Forms to download offers should be as simple as possible. First name and Email is sufficient.
- Forms on contact pages can be a bit longer, but still, only include what’s absolutely needed.
- All forms should start with a qualifying question that helps you segment them, and also allows visitors to voluntarily identify their goals/needs which provides lead intelligence for you.
- Avoid “message” or “subject line” fields as the responses are difficult to segment in your CRM.
- The litmus test: include a Phone field, and set it to ‘not required’. If they put it in any way, they are much more interested.
Next steps:
In the previous steps, we covered creating pages and adding them to menus. But save some pages for next week and the week after. Each time you publish a new page you give both search engines and visitors a reason to return.
Blogs offer an easy way to add pages and grow your site. And, where you have lots of excellent content, you could create content hubs (page groupings).
Smart marketers plan monthly or quarterly campaigns to launch new offers. It’s a great website activation strategy.
BONUS: Landing Pages built right in!
A website without landing pages is a brochure.
Landing pages are specially formatted pages containing a form. They are the destination pages for graphical calls-to-action (CTAs) like the “Hire Eddy” one on the sidebar of this page.
We’ve equipped flowww landing pages with a special HubSpot Forms drop-down menu found only in our FLOW theme. It automatically places your HubSpot Form in the best position on the page so you don’t need to worry about shortcodes or embed scripts, or where to place the form. To enable the drop-down, simply authorise the K HubSpot Connector tool under Appearance/Theme Settings.
The K HubSpot Connector is a secure, authorized tool approved by HubSpot’s engineering team.
Pro tip: Run an experiment on each of your landing pages using Nelio A/B Testing, which was added to our tech stack on September 12th, 2019.
Watch for the release of additional Landing Page designs coming soon.
Maintenance Pages
A maintenance page can be shown to non-logged-in users. This allows for the live site to show an announcement page while the site can be updated on the backend and previewed to logged-in users.
The site logo will be displayed in the header as well as a minimal footer is now displayed to make styles match the live site. Steps:
- Create a new page that is to show the maintenance notice, and add content and formatting (choose Default Template)
- Publish this page with the title “Maintenance” or similar
- Navigate to Theme Settings
- On the General Settings Tab, scroll to Coming Soon / Maintenance Page
- Turn the selection ON
- Select the “Maintenance” page from the dropdown menu
- Save the settings
- Clear the WPRocket Cache
- Test the site by opening the page in an Incognito or Private Browser
Pro Tip: Provide contact details instead of an ‘under-construction’ message. That’ll ensure visitors don’t hit a dead end. Because if that happens, they seldom return.
HubSpot Integration
Video intro to Hubspot. The tool has already been installed, so you can ignore that part of the video. But, be sure to watch it all to get a feel for HubSpot as it’s integral to your experience on flowww. PLus, we’ve eliminated the need to copy a forms short code. Simply use the toggle on any flowww Landing Page sidebar.
Search Engine Optimization
Quick Tips
Can I do SEO in flowww?
Of course you can. :)
Craft titles and meta descriptions on each page through WordPress SEO by Yeost (pre-installed). From the technical side, flowwwsites has been engineered to high SEO standards. Plus, you can import (op copy/paste) your content from INKai, the most incredible content optimization tool.
Content and link strategy are important. Follow both linking best practices and user experience best practices to make your flowww site rock SEO. On-site search optimization is pretty straight forward, but the organic kind can take a lot of time and effort. Check out this links guide showing you 16 ways to get high-quality links, or pick up this UX and SEO book from Amazon. Need Citations? You might want to hire Eddy to help you get those business profiles set up properly.
Page and Content Formatting
Quick Tips
How do I change the fonts?
- Easy. Log in.
- Then, go to your Appearance Tab
- and select Theme Settings.
- Then select Typography.
Tip: you can follow this path to find all of FLOW’s Theme styling options.
Shortcut:
https://[yoursite].flowwwsites.com/wp-admin/themes.php?page=fw-settings
or:
https://[yoursite.com}/wp-admin/themes.php?page=fw-settings
Can I display a font that is not in the Google Fonts list?
Yes. Call the font at the very beginning of the CSS code. Use “!important” to override the default font.
@font-face {
font-family: fontname;
src: url(your font's installation location);
font-weight: your preference;
}
h1, h2, h3 {
font-family: "fontname" !important;
}
Note: Fonts are software that is typically protected by copyright. We treat takedown notices very seriously. Please have proof of purchase or subscription if asked.
Can I style the main navigation?
Yes of course. Use this styling as your starting point:
.fw-site-navigation > ul > li ul > li {
color: setcolor;
background: setcolor;
background: setcolor;
-webkit-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
}
.fw-site-navigation > ul > li ul > li > a {
color: setcolor;
}
.fw-site-navigation > ul > li ul > li > a:before {
width: 16px;
font-size: setfontsize;
}
.fw-site-navigation > ul > li ul > li:hover > a,
.fw-site-navigation > ul > li ul > li.parent.hover > a,
.fw-site-navigation > ul > li ul > li.current-menu-item > a {
color: setcolor;
background: setcolor;
}
Can I add content to the Sidebar?
You certainly can. We’ve even pre-set a few smart items for you:
- Call to Action (600x600px) + a link (on inside pages)
- Contextual Menu (on inside pages)
- Rich text box (on inside pages)
- HubSpot Forms drop-down toggle (on landing pages via our K-HubSpot Connector integration, only on FLOW sites)
- Plus, Featured images on all pages
- Sidebar content options are dependent on the template used.
What are flowww image sizes?
- 1920×920 pixels (home page, should be optimized to less than 400k, height can vary)
- 1920×620 pixels (regular pages, height can range from 360-920 pixels, be consistent, should be optimized to less than 200k)
- 600x600px (Calls-to-Action CTAs, on-page images, mobile header images, page featured images, should be optimized to less than 60k)
- 800×600 pixels (blog featured images and on-page images, should be 800 pixels wide by any height, ideally horizontal, should be optimized to less than 120k)
Heights are flexible, but these are good sizes for you to start with.
How to apply background CSS classes
flowww sites has six pre-set CSS classes (that you can modify) to add visual design enhancements.
Select your block, then look to the far right (on desktop). At the bottom of the sidebar is the “Advanced” tab. Type in any “one” of the 6 classes noted above depending on your desired section to be affected. Hit “return” to set it. You’ll see the X in a circle once it’s set.
Pre-set Classes: flood-full-bg, flood-block-bg, flood-full-right, flood-full-left, flood-partial-left, flood-partial-right
Then, under Appearance / Theme Settings / Customize CSS style as desired using any or all of the following to affect the appearance:
- color (HEX or rgba)
- background-image
- position
- transition
- padding
- margin
- After/Before pseudo-classes
- animations, etc
Pre-defined classes are: flood-full-bg, flood-block-bg, flood-full-right, flood-full-left, flood-partial-left, flood-partial-right. Select class based on the page template you are using.
Note: default padding is taken from the Content Density setting. You can override that inline.
Feel free to add your own classes as well.
Link strategy, based on visitor behaviours (a.k.a. persona flowwws)
Two easily identifiable website visitor behaviours:
- rarely reads anything, makes contact (buyer)
- reads everything, seldom makes contact (researcher)
Website visitors come to your site to either act or research, or research before acting. They do it with a bit of bias based on their role, which the team at KAYAK identifies as Product, Process, and Performance.
- Product-focussed visitors tend to look for price and availability (are often in operational roles).
- Process-focussed visitors tend to look for ways to improve their situation (are often in management roles).
- Performance-focussed individuals can be quite the gamblers, eager for big wins (are often in executive roles).
Pro tip: Map content to your website visitor needs. It’s a fantastic way to make your website work. Apply links (inline, contextual, on CTAs… not just the main NAV) to guide visitors along information-based pathways.
I have a site full of content that I’d like to migrate. Can I do that?
Absolutely. Depending on the site and the type of content, it could be very quick and easy, or an octopus of a job. A few of the more common scenarios:
First, generate a site map and guard it as if it were your child.
- From Wix (Migration Plugin)
- From Weebly (Migration Tool)
- From WordPress (Export Tool) Custom Post Types are not supported (at the moment, but they are coming soon). If you have custom post types in your current site, be prepared to manually reproduce those items. Export all other individual content types.
- For platforms without an export feature, you’ll need to manually recreate pages.
Once you have your export file(s), use the WordPress Import Tool to bring your content into FLOW. Do you need help exporting, importing, or migrating content? Why not Hire Eddy?
I know CSS and HTML. Can I style my site to make it my own?
Yes, of course, you are more than welcome to style the look of your site. There are a number of options ranging from selecting pre-sets to coding inline, choosing page options, and adjusting global stylings.
Go for it. We’re curious how creative you can get. Apply gradients, add animations, play with content positioning, style buttons, style lists, etc.
- Globally:
- Setting header (Hero) styles (several presets, including logo Left / Right / Centered, side-nav or Left / Right / Centered top-nav, and sub-menu in header, full-width or boxed)
- Setting fonts (the full Google Fonts library)
- Setting colours (apply to the site, fonts, header/hero image overlays, etc)
- CSS access (for those who know how to code)
- Adding scripts can be set under Theme Settings/General/ (tabs along the top)
- At the Page level:
- Display/Hide default title, subtitle, buttons (x2) in the header/hero.
- Use Gutenberg Blocks to lay out your content
- Display/hide/edit footer items such as Logo (L/R), menu, edit copyright area, add social icons, and a lot more.
- Display/hide/set number of widgets below the body copy area
- Bonus: Gutenberg allows you to save a custom block (for example, an inline button styling) as a new block type that you can pop in anywhere else, even on other pages.
- In-line (content):
- Bold, Italics, Color, Place images inline, style horizontal rules (lines), paces, columns, round-corners, etc
Tip: Embeds require Website Manager level user to place (as a security measure). Content managers will see the code sanitized. Contact Eddy if you encounter challenges embedding code.
Note: back-end PHP files are not accessible to users. Only Eddy may modify these, and only if it doesn’t impact other clients.
Can I install a different theme?
The FLOW theme is pre-installed and engineered to ‘flow’ (a link strategy and page structure) that enables lead generation. It’s why this is such an amazing service, and why it helps you to generate high-quality leads.
COMING SOON: we have two (2) new FLOW themes coming; Paddle which is a checker box visual design variation of Flow, and Current, which is intended for financial, legal, and insurance organizations.
Should I select the Child or Parent Theme?
Child! lol. The Parent is the master (in WordPress). Don’t change this or toggle between the two. The Child is where Eddy (our support team) will make changes to customize your theme if needed.
Can I have my own Domain on flowww?
Yes. We can map your domain in two ways.
- have you modify your DNS (preferred)
- host your DNS and make the modifications on our server
Can I perform A/B testing?
Yes! Google SiteKit is installed on Upgraded subscriptions. SiteKit includes several tools, of which Google Optimize is a option to activate.
Who’s behind flowww… some nameless, faceless corporation?
FlowwSiwtes was created and is managed by the team at Kayak Marketing, one of Canada’s leading digital marketing firms. Kayak has worked with more than 600 companies across North America to deploy high-quality lead generation websites. Kayak is a Small Business of the Year Finalist (2013), and a Platinum HubSpot Certified Partner Agency (2018).
Additionally, Kayak’s founder, Randy Milanovic has written several books on SEO & UX, Content, and High-Quality Websites. Check them out.
What Plugins are installed?
Great question! We gathered the best-in-class WordPress plugins, then pre-installed and largely pre-configured them to help you make the most of your flowww experience. Compare plans.
Eddy and the flowww team experiment with plugins from time to time. Once we feel they are performing well and extend the functionality of our sites in a positive way, we may add them to the site-wide Tech Stack.