ShopFlow e-commerce theme documentation
A fast, mobile-first WooCommerce theme with a customizable homepage, quick-order product cards, an installable mobile app experience and social login. This guide takes you from upload to a finished store.
What you get
Everything below is controlled from Appearance → Customize. No code is needed.
Homepage builder
Four hero layouts including video, editable features strip, category grid with Show more, and five promo banner slots.
Quick order cards
Order from the product card or product page without opening the cart. Buy now and pre-order buttons included.
App-like mobile
Bottom navigation bar, installable PWA, and an install pop-up that hides itself inside the installed app.
Account & login
Register form, tabbed login, Google and Facebook sign-in.
Brand control
Solid, gradient or glossy brand fill. Colors can be picked from your logo. Light and dark mode.
Bilingual
English and Bengali switcher with automatic theme translations.
Requirements
Check these with your hosting provider before installing.
| Item | Minimum | Recommended |
|---|---|---|
| WordPress | 6.0 | 6.8 |
| PHP | 7.4 | 8.1 or newer |
| WooCommerce | Active plugin | Latest release |
| HTTPS | Needed for PWA install, Google and Facebook login | Valid SSL certificate |
| PHP memory limit | 128 MB | 256 MB |
Installation
Upload the theme zip file, then activate it. Use the zip named shopflow-ecommerce.zip, not the folder inside it.
- Install and activate WooCommerce from Plugins → Add New.
- Go to Appearance → Themes → Add New → Upload Theme.
- Choose
shopflow-ecommerce.zipand press Install Now. - Press Activate. You will be asked for your license (next section).
- Unzip the file on your computer. You get one folder named
shopflow-ecommerce. - Upload that folder to
/wp-content/themes/. - Open Appearance → Themes and activate ShopFlow.
License activation
ShopFlow needs an active license. Without one the storefront shows a maintenance page to visitors, while the admin area stays open for you.
- After activation you land on the license screen. If you do not, open Appearance → Theme License.
- Enter your license key and the email used for purchase, then press Activate.
- When the status turns to Active the storefront opens again and demo import unlocks.
portal.getproservices.net. The server must be able to make outgoing HTTPS requests.Import demo content
Loads sample products, categories, pages, menus and the default contact details so you can edit instead of starting empty.
- Activate your license first.
- Open Appearance → Demo Content and press Import.
- Wait until the progress bar finishes. Do not close the tab.
supportbygps@gmail.com, 8801821124025 and Dhaka, Bangladesh. Replace them in Customize → ShopFlow Contact.WooCommerce setup
Run the WooCommerce wizard first, then create the standard pages.
- Set your currency, shipping and payment methods in WooCommerce → Settings.
- Make sure Shop, Cart, Checkout and My Account pages exist under WooCommerce → Settings → Advanced.
- Set Settings → Reading → Your homepage displays → A static page and choose the demo Home page. ShopFlow draws the homepage from
front-page.php. - Set permalinks to Post name in Settings → Permalinks.
Customizer map
Open Appearance → Customize. All theme options sit in panels that start with “ShopFlow”.
| Panel | What it controls |
|---|---|
| ShopFlow Colors | Brand fill (solid, gradient, glossy), colors from logo, gradient angle, accent, second color, text color |
| ShopFlow Layout | Site width, light/dark toggle, dark mode logo |
| ShopFlow Header | Top bar visibility and message |
| ShopFlow Language | English / বাংলা switcher, position, default language |
| ShopFlow Homepage (panel) | Sections & Titles, Hero Layout & Banners, Hero Slides, Features Strip, Category Tiles, Promo Banners, Extra Promo Sections, Customer Reviews |
| ShopFlow Product Cards | Quick order, Buy now text, pre-order |
| ShopFlow Mobile Bottom Bar | Bottom navigation slots |
| ShopFlow Footer | Footer background and text colors, footer text, “Download Mobile App” column, PWA icon, install pop-up options |
| ShopFlow Checkout | “Create an account” (Register) on My Account |
| ShopFlow Social Login | Google and Facebook sign-in |
| ShopFlow Category Pages | Category archive options |
| ShopFlow Social Links | Social media icons |
| ShopFlow Contact Page | Email, phone, address, map |
Header & top bar
Logo, search, account, cart and optional language and theme switches.
- Logo: Site Identity → Logo. If none is set, the bundled ShopFlow logo shows.
- Dark mode logo: upload a light-colored version in ShopFlow Layout → Logo for dark mode. It replaces the normal logo when a visitor switches to dark mode.
- Top bar: toggle it under ShopFlow Header. The message defaults to “Free shipping on orders over $50”.
- Brand fill on the top bar: enable “Use the brand fill for the top bar and the newsletter band” under ShopFlow Colors.
- 1Top bar message and menu
- 2Logo
- 3Search
- 4Language, theme, account, cart
Hero banner
Pick one of four layouts in ShopFlow Homepage → Hero Layout & Banners.
Full-width banner images
Large banner slides with heading, text and button.
Sidebar menu + banner slider
Category list on the left from the Hero Sidebar Menu, slider on the right.
Classic: text beside artwork
Text on one side, artwork on the other.
Video banner (play video)
A banner that plays your video.
Video banner
- Set Hero layout to Video banner (play video).
- Upload an MP4, or paste a YouTube / Vimeo / MP4 link.
- Add a poster image.
- Choose how it plays: poster with a Play button (plays on click), or plays by itself, muted and looping, like a moving background.
- Heading, text and overlay use the banner settings in the same section.
Features strip
The row of short promises under the hero (shipping, payment, returns, support). Edit icon, title and text for each item.
Open ShopFlow Homepage → Features Strip.
Categories grid
Shows product categories as tiles. Choose how many appear first and let visitors reveal the rest.
- Columns: tiles per row on desktop.
- Show first: how many tiles are visible at start.
- Show more button: when the category count is higher than “Show first”, a button reveals the others without reloading the page.
- Category images come from Products → Categories → Thumbnail.
- 1Reveals the remaining categories
Extra promo banner sections
Add banner rows between homepage sections. Each row has its own images, links and number of columns.
Positions available:
| Position | Appears |
|---|---|
| After categories | Directly below the category grid |
| After featured products | Below the featured products row |
| After promos | Below the standard promo cards |
| After deals | Below the deals section |
| Before newsletter | Just above the newsletter band |
For each section: switch it on, add up to the allowed number of banners (image, link, alt text) and choose 1, 2 or 3 columns. Empty banners are skipped.
Product cards
Compact cards with a framed “Quick order” area under the price.
Card options sit under ShopFlow Product Cards: the Buy now button text, pre-order for out-of-stock items, and the pre-order button text.
Quick order & Buy now
On a single product page the Quick order frame sits below Add to cart and Buy now. A customer enters name, phone and address and places the order on the spot.
- 1Quick order frame, same style as the product card
Category banners
Give each product category its own banner image on its archive page.
- Go to Products → Categories and edit a category.
- Find Category banner, press Select image and pick a wide image (about 1600×400).
- Optional: add a banner link. Press Update.
Categories without a banner show the default shop heading.
My Account & registration
The account page shows Login and Register side by side on desktop and as tabs on mobile.
Registration is switched on by the theme through ShopFlow Checkout → Show “Create an account” on My Account. The WooCommerce setting is overridden for you.
PWA & install pop-up
Visitors can add your store to their home screen as an app. ShopFlow serves the web app manifest and service worker for you.
Setup
- Make sure the site runs on HTTPS.
- Open ShopFlow Footer and tick Installable web app (PWA). Set the app text.
- Upload a square 512×512 PNG app icon, or keep the bundled one.
- Tick Show an “Install our app” pop-up and choose its position (header, footer or center), delay, and how many days to wait after it is closed.
When the pop-up shows
- The browser supports installing and the app is not installed yet.
- Never inside the installed app (standalone mode).
- After a visitor closes it, it waits the number of days you set before showing again.
- Optional: show it only on phones and tablets.
- On iPhone the pop-up explains the Share → Add to Home Screen steps.
Language switcher
Enable under ShopFlow Language. Theme texts are translated automatically. For text you typed yourself, write both languages in the same field, separated by ||:
Free shipping over $50 || ৫০ ডলারের উপরে ফ্রি ডেলিভারিPlace the switcher in the header, top bar, or both. First-time visitors can start in English, Bengali or the WordPress site language.
Dark mode
Tick Show a light/dark toggle in the header under ShopFlow Layout. The visitor’s choice is remembered in their browser.
Troubleshooting
| Problem | Fix |
|---|---|
| Site shows a locked / maintenance page | License is missing or expired. Log in at /wp-admin and activate it. |
| “Critical error” after an update | A file upload was cut off. Re-upload the whole theme folder, then check wp-content/debug.log. |
| Old design after update | Clear the cache plugin and CDN, then hard-refresh the browser. |
| Install pop-up never appears | Needs HTTPS and a supported browser. It hides after a visitor dismisses it, and inside the installed app. |
| Google or Facebook says “redirect_uri mismatch” | The redirect address in the provider console must match the Customizer value exactly, including https://. |
| Facebook login works only for you | The Meta app is still in Development mode. Switch it to Live. |
| No Register form on My Account | Enable it under ShopFlow Account, then clear caches. |
| Hero video does not autoplay on phones | Use “plays by itself” mode with an MP4, and set a poster image. Some phones in low-power mode block autoplay; the “Play button” mode always works. |
| Demo import button disabled | License not active yet. |
Changelog
| Version | Changes |
|---|---|
| 1.10.0 | Separate logo for dark mode. |
| 1.9.9 | Footer color options and a tidier mobile footer. |
| 1.9.8 | Added this documentation. |
| 1.9.7 | Hero video banner layout. |
| 1.9.6 | Developer credit with website and WhatsApp support pop-up. |
| 1.9.5 | Redesigned My Account login and register layout. |
| 1.9.4 | Editable features strip. |
| 1.9.3 | Google and Facebook social login. |
| 1.9.2 | My Account register form. |
| 1.9.1 | Extra promo banner sections. |
| 1.9.0 | License lock: no license, no storefront. |
| 1.8.x | More homepage categories with Show more, per-category banners, install pop-up, mobile bottom bar, PWA download block, quick order restyle, bundled logo and default contact info, parse-error fixes. |
Support
supportbygps@gmail.com
Phone
8801821124025
WhatsApp support
+88 01729341345
Website
When you write to support, include your WordPress and PHP version, theme version and a screenshot of the problem.
Google & Facebook login
Add the sign-in buttons under ShopFlow Social Login. You need app credentials from each provider.