Follow for free plugins, new theme releases and theme news
Plugin Description
INTRODUCING – FULLPAGE FOR WPBAKERY PAGE BUILDER
Now, create beautiful scrolling full screen web sites with WPBakery Page Builder, fast and simple. This plugin simplifies creation of full page scrolling websites with WordPress and saves you big time.
Would you like to create full screen web sites with Gutenberg, the new WordPress editor?
Take a look at FullPage for Gutenberg
Would you like to create full screen web sites with Elementor?
Take a look at FullPage for Elementor
Top Features
Responsive
FullPage is fully responsive and perfect fit for any device.
Touch Support
For mobiles, tablets and other touch screen devices.
Rows as Sections
Each WPBakery Page Builder row is defined as vertical scrolling section.
Columns as Slides
Each WPBakery Page Builder column inside the row can be defined as horizontal slides.
Auto-Height Sections
Each section can be defined as auto-height instead of full screen.
Responsive Auto-Height Sections
Full height sections for big screens and auto height sections for small screens.
Fixed Header and Footer
Fixed header and footer rows can be defined within WPBakery Page Builder row settings to add your own custom menu or code to the top or bottom of the page.
Navigation Bullets
Horizontal and vertical navigation bullets with 20 different styles.
Scrollbars of Sections
When the content is bigger than the screen size, scrollbar can be visible inside the sections (Hidden, Faded and Interactive scrollbar options).
Optional Scrollbars
Full page scroll with browser scrollbar instead of auto-scrolling.
Animations
5 CSS3 ease animations or 32 Javascript animations, whichever you prefer.
Anchors
Animated anchor links, optional browser history support and optional anchor links at the address bar.
Keyboard Navigation
Navigate between sections and slides with keyboard (up/down/left/right keys).
Vertically Centered Sections
Section contents can be vertically centered.
Vertically Centered Sections
Section contents can be vertically centered.
Section and Slide Loops
Infinite loop options for sections and slides.
Record History
Browser back button will go to the previous section or slide.
Clean and Minimized Code
Clean, professionally written, optimized and minimized code.
Great Support
Customer support and satisfaction is the most important priority and the help will always be available.
Customization – VC Native Animations
WPBakery Page Builder native animations in sections and slides.
Customization – Videos
Play videos only when the videos are in view.
Demos
Demo Page
Demo Page with Scrollbars and Fit To Section
Demo Page with Scrollbars and Parallax
Responsive and Responsive Auto Height Sections Demo
How To Use
Demo Tutorial
Responsive Auto-Height Tutorial
FullPage for WPBakery Page Builder has been tried with more than 97 themes, and counting…
How To Use FullPage for WPBakery Page Builder with Avada
How To Use FullPage for WPBakery Page Builder with The7
How To Use FullPage for WPBakery Page Builder with Enfold
How To Use FullPage for WPBakery Page Builder with Bridge
How To Use FullPage for WPBakery Page Builder with Jupiter
How To Use FullPage for WPBakery Page Builder with 907
How To Use FullPage for WPBakery Page Builder with Fevr
How To Use FullPage for WPBakery Page Builder with X-Theme
How To Use FullPage for WPBakery Page Builder with Salient
How To Use FullPage for WPBakery Page Builder with Zephyr
How To Use FullPage for WPBakery Page Builder with TheFox
Themes Not Supported (If you have one of these themes, full page will not work so support will be waste of time.)
To use FullPage for WPBakery Page Builder, you have 2 options. Option 1 uses theme default template, and Option 2 uses custom empty page template, which is is independent from the theme and gives you the possibility to use a blank page, which means no theme related menus and settings.
How To Use FullPage for WPBakery Page Builder
- Add rows with WPBakery Page Builder. Each row will be defined as fullpage section. Design your row content.
- From row settings, go to ‘Full Page’ tab and select:
- Full Height: To make the row (section) full screen.
- Auto Height: To make the row (section) auto height, which means the row height will be depending on the contents of the row. It won’t be full screen.
- Responsive Auto Height: To make the row (section) full screen on big screens, but auto height on responsive screens. To adjust the maximum width or height of responsive screens, please enter the values to ‘Responsive Width’ and/or ‘Responsive Height’ under FullPage Settings -> Design tab.
- Top Fixed Header: If you have a menu or another content that you want to show at the top of the screen, it can be shown using this option. Add your content inside this row and select this option.
- Bottom Fixed Footer: If you have a footer content that you want to show at the bottom of the screen, it can be shown using this option. Add your content inside this row and select this option.
- Add your anchor name at ‘Full Page’ tab if you want to use anchors. If the value is not set, an automatic generated anchor name will be used. The anchor name cannot be any ID used in the HTML output. (Do not set the anchor name the same as row ID.)
- Set your Tooltip text at ‘Full Page’ tab if you want to use tooltips.
- You can add slides to the sections by following these steps:
- Add columns to the row (The plus sign of each row, set custom and enter 1/1 + 1/1 + …). Each column will be defined as slides in the section.
- From row settings, go to ‘Full Page’ tab and check ‘Columns as Slides’.
- Enable Full page and configure by playing with the options.
Option 1 – Using theme page template
- Enable ‘Force Remove Theme Margins’ from FullPage Settings -> Customization tab.
- Hide page title, either from theme settings or using CSS. There should be no relative positioned element before content.
- If you want the theme header shown at the top, enable ‘Force Fixed Theme Header’ from FullPage Settings -> Customization tab. When you enable this option, there is another option appears right under it. Please enter your theme header selector to that box.
- If you don’t want theme header shown at the top, hide header either from theme settings or using CSS. You can add your own menu to the top or bottom with adding a row with FullPage settings as ‘Top Fixed Row’. You can add your menu shortcode inside that row.
Option 2 – Using Full Page empty page template
- Select ‘Enable Empty Page Template’ from FullPage Settings -> Advanced tab.
- Enable ‘Force Remove Theme Margins’ from FullPage Settings -> Customization tab.
- You can add your own menu to the top or bottom with adding a row with FullPage settings as ‘Top Fixed Row’. You can add your menu shortcode inside that row.
- You can also customize the template buy writing your own code. Copy template folder in the plugin directory, make your changes in it and copy it back to your server. Do not copy it under the plugin directory or you can lose the changes when the plugin is updated.
Notes
- WPBakery Page Builder animations are supported only for native WPBakery Page Builder elements. This feature is experimental and may not work with some elements and themes with customized WPBakery Page Builder. If the feature is not used, WPBakery Page Builder animations can be viewed only for the first row. If you use animations on other rows, they might not start and the items might not be visible.
- Do not use row stretch, full width row, full height row etc.. options of WPBakery Page Builder rows. These options are unnecessary with FullPage and the behaviour of the page changes when used. (Such as scrolling mechanism might not work.)
- Some of the plugins that depend on scrolling mechanism such as sticky menus, animations etc. might conflict with FullPage. Please contact me on need, I will try to resolve the issue.
- Some of the themes change the behaviour and structure of WPBakery Page Builder. If you have one of these themes, please follow the steps below:
- Add ’> .vc_row’ (without the apostrophes) to ‘Section Selector’ option of Full Page settings at the Advanced tab.
- If you use slides, add ’> .vc_row > .wpb_column’ (without the apostrophes) to ‘Slide Selector’ option of Full Page settings at the Advanced tab.
- If you use top fixed header, add ‘mcw_fp_fixed_top’ to ‘Extra Class Name’ of the top fixed header row.
- If you use bottom fixed footer, add ‘mcw_fp_fixed_bottom’ to ‘Extra Class Name’ of the top fixed header row.
Credits
Thanks to Álvaro Trigo for awesome fullpage.js jQuery plugin.
Support
Item support only includes plugin techical/non-technical questions, version updates, reported bug fixes and minor change requests. FullpageJS modifications are not included in the support.
Contact me
- If you want to ask a question about the plugin.
- If you want me to check a theme.(This plugin is tested on most of the famous themes that I have. If I have the theme I can tell you if it is supported or not.)
- If you need support with the plugin.
Changelog
v2.0.8 (December 12 2019)
- fullpage.js updated to v3.0.8.
v2.0.7 (July 14 2019)
- fullpage.js updated to v3.0.7.
- Bug fix.
v2.0.6 (April 14 2019)
- fullpage.js updated to v3.0.5.
- Minor improvements.
v2.0.5 (January 21 2019)
- Bug fix.
- Translation improvements
- Code improvements
v2.0.4 (December 01 2018)
- Scroll overflow bug is fixed..
v2.0.3 (November 30 2018)
- Scroll overflow is force to be disabled when scrollbars are activated.
- fullpage.js updated to 3.0.4.
- Improvements.
v2.0.2 (August 19 2018)
- Bug fixes.
- Minor improvement.
v2.0.1 (August 01 2018)
- fullpage.js updated to v3.0.2. The plugin is updated to v2 with fullpage.js v3. Even though the plugin is backwards compatible, customized code and CSS might not work with the new version. Please use support and contact me if you have problems with the new version. Please use a staging site if you have that option. Otherwise please take a backup of your site database before updating. Thank you,
- Code is improved. Bugs are fixed. Almost written from scratch with a new approach on the main algorithm, which results with a faster web site.
v1.7.7(April 208 2018)
- fullpage.js is updated to 2.9.7.
v1.7.6.1 (February 07 2018)
- Scrolloverflow bug fix.
v1.7.6 (February 06 2018)
- Name change.
- Animations bug fix (thanks to @sanderswebworks)
v1.7.5 (February 01 2018)
- fullpage.js updated to 2.9.6.
<pre>v1.7.4 (November 04 2017)
- fullpage.js updated to 2.9.5.
- Bug fix.
v1.7.3 (March 04 2017)
- fullpage.js updated to 2.9.3.
- Extensions support.
- Filters are added for parameter change on the fly. More information can be found in the helpers plugin file.
- Improvements.
v1.7.2 (January 03 2017)
- fullpage.js is updated to 2.9.2.
v1.7.1 (November 16 2016)
- Bug fixes.
v1.7.0 (November 10 2016)
- fullpage.js is updated to 2.8.8 (stabilized)
- 19 extra navigation styles are added, Different styles for sections and slides.are applied.
- Auto-height Responsive feature is added.
- AfterResponsive event is added.
- Video play customization is added. Now videos are stopped when the section is not in view.
- Fixed theme header customization is added. Now you can add theme header to the page easily.
- Plugin URL is changed.
- Template system is changed.
- Bug fix.
- Other small code improvements.
v1.6.0 (August 31 2016)
- Infrastructure improvements to make the plugin more stable and a little bit faster.
- FullPage options are re-organized.
- Fit to section delay option is added.
- Theme remove margins customization added.
- Metabox improvements
- fullpage.js updated to 2.8.5
- Bug fix.
v1.5.3 (August 19 2016)
- fullpage.js updated to 2.8.4.
v1.5.2 (July 12 2016)
- fullpage.js updated to 2.8.2.
- New Feature: bigSectionsDestination added to options.
- Small bug fix and improvements.
v1.5.1 (June 25 2016)
- New feature: Disable scroll overflow for any section
- New feature: Option to move fullpage.js to footer instead of header (useful with some plugins)
- Bug Fix about 404 pages (thanks to @peterand)
v1.5.0 (Jun 4 2016)
- fullpage.js updated to 2.8.1
- New feature: Hide scrollbar, fade scrollbar and interactive scrollbar on scroll overflow options.
- New feature: Visual Composer animations support (Special thanks to Andrea Morone @IlTuoWebmaster)
- Deprecated Resize text option is removed.
- Removed duplicate paddingTop option.
- Stability improvements
- Metabox stability improvements.
- Bug fix in the template file.
v1.4.3 (Apr 08 2016)
- fullpage.js updated to 2.7.9
- Metabox bug fix.(Thanks yo milanbrouwer)
v1.4.2 (March 27 2016)
- Bug fix.
v1.4.1 (Feb 22 2016)
- fullpage.js updated to 2.7.8
- 2 new events are added,
- Tooltip background and text color options are added.
v1.4.0 (Jan 26 2016)
- fullpage.js updated to 2.7.7.
- Events are added. Now you can write your own events in javascript and add it to the full page.
- Meta box is improved.
- Section and slide selector options are added to support themes that use customized Visual Composer.
- Full page template is improved for better support.
- Other performance improvements.
v1.3.2
- Small bug fix.
v1.3.1
- Bug fix about meta box.
v1.3.0
- Fixed header and footer rows are added. Now rows can be defined as fixed header or footer on the page.
- paddingTop and paddingBottom features are added.
- fixedElements feature is added.
- Plugin and meta box improvements and bug fixes.
v1.2.0
- fullpage.js updated to 2.7.6.
- Bug fix (Thanks to Nickid)
- Improvements and bug fixes.
v1.1.1
- Bug fix (Thanks to h22uk)
v1.1.0
- Templates are added. Now can be used with any theme.
- fullpage.js updated to 2.7.5.
- Directory index.php files are added.
- Minor changes.
v1.0.0
- Initial Release </pre>
