# fullPage.js for Elementor - Documentation
Source: https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/
Plugin version: 3.0.0
Docs last updated: 2026-10-04

Create beautiful full screen scrolling web sites with **WordPress** and **Elementor**, fast and simple.

[![FullPage for Elementor](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/imgs/fullpage-for-elementor-card.png "FullPage for Elementor")](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/)

- [DEMO](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/demo/)
- [BUY](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/#pricing)
- [FAQ](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#faq)

## Requirements

* WordPress version should be at least v6.8.
* PHP version should be at least v7.4.
* Elementor plugin should be active on the WordPress site and at least v3.32, recommended v4.0.

## Tutorial Video

[Video tutorial](https://www.youtube.com/watch?v=kvNCDZsSZbQ)

[Video tutorial](https://www.youtube.com/watch?v=GzG2pAbC0do)

## How To Install

* Login to your WordPress Dashboard.
* Install Elementor plugin if not installed.
* In your WordPress Admin Menu, go to **Plugins > Add Plugin**.
* Click on **Upload Plugin** button found on top left corner of page.
* Click on **Browse** button. Select the `mcw-fullpage-elementor.zip` file of your plugin in your computer, and click **Install Now** button.
* Active the plugin by clicking on **Activate Plugin** link to work with the plugin.

![How To Install FullPage for Elementor Plugin](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g01-install.mp4 "How To Install FullPage for Elementor Plugin")

## License Key

The license key you obtained by buying the plugin can be entered at WordPress admin panel **FullPage** settings page.

![License Settings](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s01-settings.png "License Settings")

After entering the license, press on **Activate License** button. This will activate the license.

![Activated License Settings](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s02-settings-activated.png "Activated License Settings")

You can use the plugin without any limitations once your license is activated.

### License Deactivation

If you want to move your license to another domain, you will need to deactivate your license if activated. You can click the **Deactivate** link to deactivate your license.

![Deactivate License](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g02-deactivate.mp4 "Deactivate License")

If you don't have access to your site, you can deactivate your license on the [deactivation page](https://www.meceware.com/server/deactivate-fullpage/).

### License Dashboard

If you want to see all your licenses, please visit the [dashboard](https://alvarotrigo.com/fullPage/dashboard/).

## Sample Elementor Template

You can [download the sample template](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/template/fullpage-for-elementor-template.json) and import it into your Elementor template library. It has four sections, and one of them has horizontal slides. It uses only a few elements, so it fits most sites.

![Import the Sample Template](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g03-template-import.mp4 "Import the Sample Template")

To import and use it:

* Create a new page and edit it with Elementor.
* Click the **Add Template** icon (the folder) on the page.
* Go to the **Templates** tab first, then click the **Import Template** icon at the top right.
* Click **Select File** and choose the `fullpage-for-elementor-template.json` file.
* Click **Insert** next to the imported template.
* [Enable FullPage](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#enable-fullpage) for the page and click **Save & reload**.
* Use the [setup wizard](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#fullpage-setup-wizard) for the first options, or close it and change them later.

## Enable FullPage

* Create a new page, or open an existing one, with Elementor.
* Click **Page Settings** in the top bar and open the **FullPage** section.
* Turn on **Enable FullPage**.
* The page needs to be saved and the preview reloaded. Click **Save & reload**.
* After the preview reloads, the sections show at full height in the editor.

*Note: Put all your content inside top-level Flexbox (recommended), Div Block or Container elements. Each of them becomes a section. Content outside them is not part of FullPage and may break the page.*

![Enable FullPage for Elementor](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g04-enable-fullpage.mp4 "Enable FullPage for Elementor")

By default, a page with FullPage enabled uses an **empty page template**: the page loads without your theme's header, footer and page title. To show them, turn off **Enable Empty Page Template** in the [Advanced](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#enable-empty-page-template) section, or answer **Yes** to *Use your theme's template?* in the setup wizard.

![Use The Theme Template](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g07-theme-template.mp4 "Use The Theme Template")

### FullPage Setup Wizard

The Setup Wizard helps you choose the first options. After FullPage is enabled, you can open it with the **Setup Wizard** button in the FullPage section of Page Settings, or with the **F** icon in the top bar.

![FullPage Setup Wizard](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s03-wizard.png "FullPage Setup Wizard")

* **Use your theme's template?**

  * **Yes:** Your theme's header and footer stay on the page. Two more questions follow:

    * **Use your theme's header?** Keeps the header fixed at the top. Give its CSS selector (like `header` or `.site-header`) so FullPage can find it.

    * **Use your theme's footer?** Shows the footer as the last section. Give its CSS selector (like `footer`) too.

  * **No:** A clean, empty page shows only your FullPage content.

* **Remove theme margins?** Removes the margins and paddings your theme adds around the page.

* **Show section navigation bullets?** Shows clickable dots on the side of the page, so visitors can see which section they are on.

* **Slide navigation:** How visitors move between horizontal slides: **Off**, **Bullets**, **Arrows**, or **Both**.

* **Change vertical alignment?** Leave it at **No** to keep the alignment you set on each element. Choose **Yes** to put the content of every section at the **Top**, **Center**, or **Bottom**.

* **Show a visible scrollbar?** Shows the browser scrollbar and keeps the snapping between sections.

* **Enable responsive mode?** Only asked when the scrollbar is hidden. Below your mobile breakpoint, FullPage turns off and the page scrolls like a normal website. You can change the width later in [Responsive Width](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#responsive-width).

Click **Apply Settings** to use your answers, then save the page. **All FullPage settings** takes you to the full list of options instead.

## Sections

Each top-level Flexbox, Div Block or Container on the page is a FullPage section. The video below changes the options of the first section, then shows them on the page.

![Section Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g05-sections.mp4 "Section Options")

### Add Sections

Add a Flexbox (or a Container) to the page: click the **+** icon in the drop area, or drag it from the Elements panel. Each new top-level element is a new section. The **Structure** panel lists your sections.

![Elementor Structure Panel](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s04-structure.png "Elementor Structure Panel")

### Remove Sections

* Right click on the section and click **Delete**.

### Section Options

Select a section and open the **FullPage** part of its settings. For a Flexbox or a Div Block it is on the **General** tab. For a Container it is on the **Layout** tab.

![Section Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s05-section-options.png "Section Options")

#### Has Horizontal Slides

Turns the section into a section with horizontal slides. See [Slides](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#slides).

**Slide Autoplay** moves to the next slide on its own, and **Slide Autoplay Delay** sets the time between slides.

#### Section Behaviour

Sets the height of the section.

![Section Behaviour](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s06-section-behaviour.png "Section Behaviour")

When **Full Height** is selected (default), the height of the sections will be full screen.

When **Auto Height** is selected, the height of the section will take the height defined by your section/slide content.

When **Responsive Auto Height** is selected, sections will be full screen until the responsive mode gets fired. Then they'll take the size required by their content, which could be bigger or smaller than the viewport. Responsive mode is only enabled when [Responsive Width](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#responsive-width) and [Responsive Height](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#responsive-height) options are set.

#### FullPage Anchor

The anchor shows in the address bar while the section is on screen, and links can use it to go straight to the section.

For example, if the anchor of a section is `secondPage`, the link `http://yoursite.com/#secondPage` opens the page at that section.

If you leave it empty, a unique anchor is created for the section.

*Note: FullPage Anchor should be unique, and should NOT be the same as any other ID on the page.*

#### Navigation Tooltip

The text shown next to this section's navigation bullet.

#### Disable Scroll Overflow

Stops the in-section scrollbar on this section. Use it when [Scroll Overflow](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#scroll-overflow) is enabled but this section doesn't need a scrollbar.

#### Navigation Colors

**Nav Color**, **Nav Hover Color** and **Nav Active Color** change the navigation bullet colors while this section is on screen. They override the page's navigation colors for this section only.

**Tooltip Color** and **Tooltip Background** do the same for the tooltip, once the section has a [Navigation Tooltip](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#navigation-tooltip).

## Slides

Slides are the horizontal FullPage elements inside a section.

Turn on [Has Horizontal Slides](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#has-horizontal-slides) for a section, and each Flexbox, Div Block or Container directly inside it becomes a slide.

![Slides](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g06-slides.mp4 "Slides")

*Note: In a section with slides, put all content inside the slides. Anything placed directly in the section, next to the slides, may break the page.*

### Add Slides

* Turn on [Has Horizontal Slides](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#has-horizontal-slides) for the section.
* Add a Flexbox (or a Container) inside the section for each slide.
* Add your content inside those slides.

### Remove Slides

* Right click on the slide and click **Delete**.

### Slide Options

These options are on the section that holds the slides:

* **Has Horizontal Slides?** turns the section into a section with slides.
* **Slide Autoplay** moves to the next slide on its own.
* **Slide Autoplay Delay (s)** is the time between slides, in seconds.

Each slide also has options of its own:

![Slide Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s07-slide-options.png "Slide Options")

* **FullPage Anchor** is the anchor of the slide. If it is set, the address of the slide is `#section_anchor/slide_anchor`. If it is empty, the slide number is used, like `#section_anchor/2`.
* **Disable Scroll Overflow** works like the [section option](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#disable-scroll-overflow).
* **Nav Color**, **Nav Hover Color** and **Nav Active Color** work like the [section options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#navigation-colors), while this slide is on screen.

## Navigation

The Navigation section of the FullPage page settings has the options for section and slide navigation.

![FullPage for Elementor Navigation Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s08-navigation.png "Navigation Options")

### Section Navigation

The navigation bar made up of small circles (bullets), one for each section. Click the edit icon next to **Section Navigation** to see its options.

![FullPage for Elementor Section Navigation Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s09-navigation-section.png "Section Navigation Options")

* **Section Navigation**: Where the bullets are shown: **Off**, **Left** or **Right**.
* **Section Navigation Style**: The style of the bullets.
* **Show Active Tooltip**: Shows the tooltip of the active section next to its bullet all the time.
* **Clickable Tooltip**: Clicking a tooltip also goes to its section.
* **Bigger Navigation**: Shows bigger bullets.

These options can be set for each device (desktop, tablet and mobile):

* **Show**: Shows or hides the bullets.
* **Main Color**: The color of the bullets.
* **Hover Color**: The color of the bullets when the mouse is on them.
* **Active Color**: The color of the active section's bullet.
* **Tooltip Background Color**: The background color of the tooltips.
* **Tooltip Text Color**: The text color of the tooltips.
* **Space**: The distance of the bullets from the left or right side of the page.

### Section Navigation Buttons

Adds previous and next buttons to the page, to move between sections.

![FullPage for Elementor Section Navigation Buttons Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s10-navigation-buttons.png "Section Navigation Buttons Options")

* **Section Navigation Buttons**: Where the buttons are shown: **Off**, **Left** or **Right**.
* **Style**: The style of the buttons.
* **Color**: The color of the buttons.
* **Background Color**: The background color of the buttons.

### Slide Navigation

The navigation bar made up of small circles (bullets) for the slides of a section.

![FullPage for Elementor Slide Navigation Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s11-navigation-slide.png "Slide Navigation Options")

* **Slides Navigation**: Where the bullets are shown: **Off**, **Top** or **Bottom** of the section.
* **Slide Navigation Style**: The style of the bullets.
* **Bigger Slide Navigation**: Shows bigger bullets.

These options can be set for each device (desktop, tablet and mobile):

* **Show**: Shows or hides the bullets.
* **Main Color**: The color of the bullets.
* **Hover Color**: The color of the bullets when the mouse is on them.
* **Active Color**: The color of the active slide's bullet.
* **Space**: The distance of the bullets from the top or bottom of the section.

### Control Arrows

Shows the left and right arrows to move between slides.

![Control Arrows Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s12-control-arrows.png "Control Arrows Options")

* **Style**: The style of the arrows.
* **Color**: The color of the arrows.

### Lock Anchors

Controls whether URL anchors have any effect on fullPage navigation.

### Disable Anchors

Turns off all section anchors so URLs no longer update as the user scrolls.

### Animate Anchor

Controls the initial load behavior when the URL contains an anchor (#). When enabled, the page animates to the target section; when disabled, it loads directly there.

### Keyboard Scrolling

Enables keyboard navigation between sections and slides.

### Record History

Pushes each section/slide to the browser history, so the back and forward buttons move the user between them. When disabled, the URL still updates but the browser history stays put. Automatically disabled when [*Auto Scrolling*](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#auto-scrolling) is off.

## Scrolling

Scrolling section includes the options about scrolling mechanism.

![FullPage for Elementor Scrolling Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s13-scrolling.png "Scrolling Options")

### Auto Scrolling

Switches between automatic scrolling and the browser's native scrolling. It also affects how sections fit in the viewport on tablets and mobile phones.

### Fit To Section

Controls whether sections snap to fill the viewport. When enabled, the active section always takes the full screen. When disabled, users can stop halfway between sections.

**Fit To Section Delay** is the wait, in milliseconds, before the section snaps into place.

### Scroll Bar

Enables a visible scrollbar alongside fullPage. [Auto Scrolling](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#auto-scrolling) still works, users can also drag the scrollbar, and fullPage snaps to the nearest section when scrolling stops.

### Scroll Overflow

Adds an in-section scrollbar when a section or slide's content is taller than the viewport.

![Scroll Overflow Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s14-scroll-overflow.png "Scroll Overflow Options")

**Mac Style Scroll Overflow** shows a "mac style" scrollbar instead of the default one, which looks quite different on Windows computers.

### Continuous Vertical

Wraps vertical scrolling so the last section continues into the first, and scrolling up from the first section jumps to the last.

### Loop Bottom

Wraps scrolling down from the last section back to the first.

### Loop Top

Wraps scrolling up from the first section back to the last.

### Loop Slides

Wraps horizontal slide navigation so the last slide continues to the first and vice versa.

### Skip Intermediate Items

Skips the scroll animation when navigating between non-consecutive vertical sections or horizontal slides.

### Big Sections Destination

Controls how fullPage scrolls to a section that's taller than the viewport. By default, it scrolls to the top when coming from above, and to the bottom when coming from below. Possible values are **Default**, **Top** and **Bottom**.

### Easing

Sets the transition effect used for vertical and horizontal scrolling, as either a CSS3 or a JS transition.

When **CSS Easing** option is enabled, CSS3 transition animations are used. It is highly recommended to use CSS3 easing options.

![CSS3 Easing Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s15-css-easing.png "CSS3 Easing Options")

When **CSS Easing** option is disabled, JavaScript transition animations are used.

![JavaScript Easing Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s16-js-easing.png "JavaScript Easing Options")

### Scrolling Speed

Speed in milliseconds for the scrolling transitions.

## Design

Design section includes options about the elements of fullpage.

![FullPage for Elementor Design Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s17-design.png "Design Options")

### Vertical Alignment

Sets the vertical position of the content within sections and slides: **Top**, **Center** (default) or **Bottom**. Choose **Default** to keep the alignment you set on each element.

### Adjust on Nav Resize

Defines whether to adjust section height when the mobile navigation or address bar resizes or toggles visibility. If disabled, sections may not remain full-height when the bar shrinks or hides.

### Responsive Width

A normal scroll will be used under the defined width in pixels. A class `fp-responsive` is added to the body tag in case the user wants to use it for their own responsive CSS. For example, if set to `900`, whenever the browser's width is less than `900` the plugin will scroll like a normal site.

### Responsive Height

A normal scroll will be used under the defined height in pixels. A class `fp-responsive` is added to the body tag in case the user wants to use it for their own responsive CSS. For example, if set to `900`, whenever the browser's height is less than `900` the plugin will scroll like a normal site.

### Fixed Elements

Takes elements off the scrolling structure so they can stay fixed when the CSS3 option is in use. Accepts a string of JavaScript selectors for those elements (for example, `#element1, .element2`).

### Normal Scroll Elements

If you want to avoid the auto scroll when scrolling over some elements, this is the option you need to use. (useful for maps, scrolling elements etc.) It requires a string with the JavaScript selectors for those elements. (For example: `#element1, .element2`). This option should not be applied to any section/slide element itself.

### Custom CSS

You can add your custom CSS. This CSS will only be enabled when FullPage is enabled.

## Events

The Events section has the JavaScript events of fullpage.js. Each event runs the code you give it when the event fires.

![FullPage for Elementor Events](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s18-events.png "Events")

![FullPage for Elementor Event Code](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s19-events-code.png "Event Code")

### afterRender

Fires right after the page structure is generated. Use this for initializing other plugins or any code that needs the DOM to be ready, since fullPage rewrites the DOM during setup.

### afterResize

Fires after the browser window is resized, right after the sections have been resized.

### afterLoad

Fires once the sections have finished loading and scrolling has ended.

### beforeLeave

Fires right before leaving a section, just before the transition takes place. Returning `false` cancels the move.

### onLeave

Fires as the user leaves a section, during the transition to the new one. Returning `false` cancels the move.

### afterSlideLoad

Fires once a slide inside a section has finished loading and scrolling has ended.

### onSlideLeave

Fires as the user leaves a slide, during the transition to the next one. Returning `false` cancels the move.

### onScrollOverflow

Fires while scrolling inside a scrollable section, when [Scroll Overflow](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#scroll-overflow) is enabled.

### afterResponsive

Fires whenever fullPage switches between normal and responsive mode.

### afterReBuild

Fires after fullPage is manually rebuilt via `fullpage_api.reBuild()`.

### Before FullPage

Fires right before fullpage.js initializes.

### After FullPage

Fires right after fullpage.js initializes.

## Extensions

Extensions section includes FullPage Extension options. The extensions can be purchased on [FullPage Extensions](https://alvarotrigo.com/fullPage/extensions/) page.

***Note: These options are only available if at least one extension is purchased. The plugin is not bundled with these extensions.***

***Note: After you purchase an extension, the extension can be installed using your extension license key and used without activation. Please note that, there is no deactivation or domain change for extensions.***

### Installing The Extension

* Go to **FullPage** settings page. You will see extension list.

![Extension List](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s20-extension-settings.png "Extension List")

* Select the extension you want to install.

* Enter your *License Key* you've received via email upon the purchase for the corresponding extension.

![Extension List](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s21-extension-parallax-pre-install.png "Extension List")

* Click on **Install Extension** button.

![Installing Extension](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s22-extension-installing.png "Installing Extension")

* After a successfull installation, the page will refresh and the extension plugin should be installed.

### Activating The Extension

When you purchase an extension, you will need to activate your extension license for a domain. **Please note that, there is no deactivation or domain change for extensions**.

You can use the extension without activating it on a domain (for example, a staging/development domain). ***When a non-activated extension is used on a domain, a red box will appear but it will be removed upon activation***.

If you are on a staging/development domain, please ignore that message and do not activate for the development domain. **The extension domain cannot be changed (no deactivation) and once activated, refund for the extension would not be possible**. Once moved to the production domain, you can activate it and the red box will be disappeared automatically.

If this is the first time you are using the extension (*hence the extension license is not activated*), you will see a yellow warning box about the activation process after installing the extension plugin.

![Before Activation](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s23-extension-no-activation.png "Before Activation")

If you are on the production domain and you want to activate your license, click on **Activate** button and follow the steps on the activation page.

![Extension Activation Page](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s25-extension-activation-page.png "Extension Activation Page")

Once the activation process is completed, click on **Check Activation** button and the extension should be activated. ***The activation key is fetched automatically***.

![Extension Installed](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s26-extension-activated.png "Extension Installed")

If you don't like the automatic activation process and you want to manually activate your license, go to the [activation web site](https://alvarotrigo.com/fullPage/extensions/activationKey.html) and follow the on-screen steps to choose your extension and enter your *License Key* you've received via email upon the purchase.

### Using The Extension

After the extension is installed,

- Open **Page Settings** and turn on **Enable FullPage Extensions** in the **Extensions** section.

- You should see the extension. Enable the corresponding extension and adjust its option(s) as suitable.

![Extension Options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s24-extension-options.png "Extension Options")

### Removing the Extension

To remove the extension, go to your Plugins page and *Deactivate/Delete* the extension plugin.

## Customizations

![FullPage for Elementor Customizations](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s27-customizations.png "Customizations")

### Video Autoplay

Plays videos inside sections/slides only while the section is in view, and pauses them on leave.

**Video Keep Playing** option will make the videos play all the time, even if the section/slide is not in the view.

### Remove Theme Margins

Removes the margins and paddings of the page wrapper, so FullPage can fill the whole width of the screen.

### Force Fixed Theme Header

![Force Fixed Theme Header](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s28-fixed-theme-header.png "Force Fixed Theme Header")

Pins the theme header to the top of the page and adjusts section content to account for it.

**Theme Header Selector** option is required as a JavaScript/CSS selector.

**Toggle Header** option enables header toggle, which the header is hidden when scrolling down, and the header is shown when scrolling up.

**Theme Header Padding** option sets the section header paddings with respect to header height.

If you designed your theme header using Elementor, the *Theme Header Selector* option should be set to `.elementor-location-header`.

### Show Theme Footer

![Show Theme Footer](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s29-show-theme-footer.png "Show Theme Footer")

Moves the theme footer into a new auto-height section appended as the last section.

**Theme Footer Selector** option is required as a JavaScript selector.

### Hide Content Before FullPage

When this option is enabled, an empty content will be shown before FullPage is loaded. The content is shown after FullPage is loaded and enabled.

### Override FullPage Links

Forces anchor links to use fullPage navigation. Enable this if fullpage anchor links aren't working as expected.

### Override Anchor Links

Forces regular anchor links to use fullPage navigation. Enable this if anchor links aren't working as expected.

### Extra Parameters

If needed, any extra fullpage.js parameters can be used.

## Advanced

![FullPage for Elementor Advanced Parameters](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/s30-advanced.png "Advanced Parameters")

### Section Selector

If needed, the JavaScript selector of the sections can be given here.

### Slide Selector

If needed, the JavaScript selector of the slides can be given here.

### Observer

Watches for changes to the page's HTML structure and re-initializes FullPage when they happen.

### Enable JQuery Dependency

FullPage does not depend on jQuery. But if you want to load jQuery on the page, such as for events, enable this option.

### Enable Empty Page Template

By default, FullPage for Elementor uses an empty page template, and this option is enabled. When FullPage is enabled on a page, the page loads without your theme's header, footer and page title.

Disable this option to use your theme's template instead. You might need some CSS and JavaScript knowledge to adjust how the page behaves.

![Use The Theme Template](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/imgs/g07-theme-template.mp4 "Use The Theme Template")

### Use Template Redirect

Controls whether the template is redirected or included. When enabled, the template is redirected; when disabled, it is included. Try both to see which works best for your theme. Only available when Empty Page Template is used.

### Remove Theme JS

Strips theme JavaScript files from the output. Be aware, this can break the page if the theme outputs JS in the head.

Enable this option if you want to remove theme JavaScript files, on necessary cases such as conflicts between theme and FullPage. Enabling this option is not recommended on production environments, and is used for debugging purposes.

### Remove JS

Removes the specified JavaScript files from the output. Be aware, this can break the page. List the JavaScript file names separated by commas.

## FAQ

#### Can I move my license to another server?

Yes, you can! You can [deactivate](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#license-deactivation) your license on your old server and use the same license on your new server. Please see [License Key](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#license-key "License Key") section for more information.

#### How can I deactivate my license if I don't have access to my site?

You can manage your licenses on the [dashboard](https://alvarotrigo.com/fullPage/dashboard/).

Alternatively, you can *deactivate* your license on the [deactivation page](https://www.meceware.com/server/deactivate-fullpage/). You will need the domain of your site, your license key and your email you used to purchase the plugin.

#### How can I generate the invoice for the plugin?

You would have received an email from Gumroad that shows the plugin license key as well as an *Invoice* button. You can generate your invoice by clicking on that button.

#### I cannot see extensions even if I installed the Extensions plugin!

FullPage extensions can be purchased separately and is not available with the plugin out-of-the-box. If you haven't purchased any extension, you don't need to use/activate the extensions plugin.

If you have purchased one or more extensions, please take a look at the [Extensions](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#extensions "Extensions") section for the tutorial video that shows how to install them.

#### I see a red box about extension not activated!

Please find more information at [Extensions](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#extensions "Extensions") part of the documentation. As specified there, you could see the red box when the extension is not activated. However, if you are on a development domain, **please ignore that message and do not activate for the development domain**. **The extension domain cannot be changed and once activated, refund for the extension would not be possible**. Once moved to the production domain, you can activate it and the red box will be disappeared automatically.

#### How can I show a normal web site on mobile and fullpage scrolling web site on desktop?

You can activate Responsive Mode. To activate Responsive Mode, please set [Responsive Width](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#responsive-width "Responsive Width") option to `767` (or any screen width you want). That's it! For the screens that has width less than `767px`, a normal scrolling web site will be shown.

You can also try setting [Responsive Auto-Height](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#section-behaviour "Section Behaviour") option for the sections.

#### I cannot see my header and footer!

By default, the plugin comes with an empty page template. This means that, while fullPage is enabled on your WordPress site, an empty page with no theme dependency will be loaded. That's why your header or footer does not appear on your site. To disable it, please take a look at the [tutorial video](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#enable-empty-page-template "Enable Empty Page Template").

#### I cannot scroll to my footer!

If scrollbars are disabled, only the content inside the sections are visible. To be able to show the footer, it needs to be moved inside a section. You can use the [Show Theme Footer](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#show-theme-footer "Show Theme Footer") customization.

#### Sections are getting cut off! I cannot see the rest of my content!

When the scrollbars are disabled and your content is greater than the screen height, some of your content might be left outside of the viewport. To display these, you can enable [Scroll Overflow](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#scroll-overflow "Scroll Overflow") option. This will create an in-section scrollbar.

#### How do I remove anchors from URL?

If you want to remove the anchors (your-domaion.com/`#anchor`), you can enable [Lock Anchors](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#lock-anchors "Lock Anchors") or [Disable Anchors](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#disable-anchors "Disable Anchors") option. Enabling one of these two options will remove the anchor part from the URL.

#### Why my scroll based animations or events don't work?

Some of the WordPress plugins or Javascript libraries that depend on scrolling mechanism such as sticky menus, animations etc. might not work if scroll bar is disabled using the plugin. Please enable the [Scroll Bar](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#scroll-bar "Scroll Bar") option to enable scroll based animations.

#### Updating From v2.X to v3.0

FullPage for Elementor v3.0 is a major update, rebuilt for Elementor 4. It needs Elementor v3.32 or later (Elementor 4 is recommended), WordPress v6.8 or later and PHP v7.4 or later. To update the plugin from `v2.X` to `v3.0`, please follow the instructions below:

- Before updating, please take a **database backup** as a precaution.

- Update Elementor to v3.32 or later, then update FullPage for Elementor plugin to the latest version.

- For each page/post designed with FullPage for Elementor (FullPage is enabled):

  - Edit the page/post.

  - The old Elementor **Section**, **Column** and **Inner Section** elements are not supported any more. If your page uses them, replace each top-level Section with a **Flexbox** (or a **Container**), and each Inner Section that was a slide with a Flexbox (or a Container). Move your content into the new elements, and set the [section options](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#section-options) again: FullPage Anchor, Section Behaviour, Has Horizontal Slides and the others.

  - The **Full Height Columns** option is removed. Use the size and alignment settings of the Flexbox instead.

  - The **Is Header a Section?** option is removed.

  - The **Template Path** option is removed. A page always uses the plugin's empty page template, or your theme's template when [Enable Empty Page Template](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#enable-empty-page-template) is off.

  - Check the [Vertical Alignment](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#vertical-alignment) of your pages. **Top** and **Bottom** are back, and **Default** keeps the alignment you set on each element.

  - For Offset Section extension users, if you have changed the default option of **Data Centered** for any section, please check it again. It is in the FullPage options of each section.

  - For users that have custom CSS or JavaScript options, please check your site after the update. You can use [support](https://alvarotrigo.com/contact/ "Contact") for your customized scripts and styles.

  - The [Setup Wizard](https://alvarotrigo.com/fullPage/wordpress-plugin-elementor/docs/#fullpage-setup-wizard) can help you check the main options again.

  - Save the page and refresh. After saving, you should not see any error.

  - Check your page to test if everything works as expected.

- That should be it :) For any issues, please use [support](https://alvarotrigo.com/contact/ "Contact") and we will try our best to help you…

## Pre-sales FAQ

#### Is fullPage plugin for Elementor compatible with any WordPress builder editor?

No. The plugin is only compatible with Elementor editor.

However, we also have a [fullpage.js plugin for Gutenberg editor!](https://alvarotrigo.com/fullPage/wordpress-plugin-gutenberg/)

#### Can I install it in any Elementor theme?

It can be installed with any theme. However, if you need to use theme features, such as header, you might need to know CSS and maybe JavaScript, depending on your theme and your design.

#### Can I use fullPage plugin to build comercial products?

If you want to include Fullpage in downloadable or installable products like WordPress themes, HTML templates, as part of a commercial interface builder, SDK, or toolkit, choose the Commercial OEM license. Commercial OEM licenses are customized for each customer. [Contact us](https://alvarotrigo.com/#contact) if you need this license.

Otherwise you are fine with any of the other available licenses.

#### What happens if I cancel my yearly subscription?

You will still be able to use the fullPage.js plugin but you won't be able to get any more updates for it.

This means that you would be subject to **possible breaking changes** if you update WordPress or Gutenberg or if new versions of web browsers break the old version of fullPage.js in any way.

Additionally, you wouldn't be able to enjoy any fullPage.js improvements or new features.

Remember you can get a lifetime license with unlimited updates for just a bit more.

#### Is the payment secure?

Of course! You'll be paying through [Gumroad](https://gumroad.com/), a secure platform that allows payments all around the world with different cards and services like Paypal. Gumroad makes use of the [Stripe](https://stripe.com) service that ensures your payment details are secure and in pretty good hands!

#### How can I apply extra updates and support?

You can get extra support by acquiring the support package.

#### Can I be refunded?

Sure! There's 30-days money back guaranteed for any purchase.

Notice that you won't be elegible for a refund if you asked for support.

#### Can I upgrade from one license to another?

Sure! It is in fact very easy!

Please proceed to purchase the upgraded license (Professional or Business license). Then [contact us](https://alvarotrigo.com/#contact) and let us know that you want to upgrade. We'll then proceed to refund you the previous purchase. Easy uh?

#### How can I get an invoice for my purchase?

You'll get a link to the invoice on the purchase confirmation email sent by Gumroad, the company dealing with the secure payment.

#### Do you have an affiliate program?

Yes we do! Earn up to 40% commission on every sale! Learn more on our [affiliates page](https://alvarotrigo.com/fullPage/affiliates/).

#### I have another question

If you still having some questions, please feel free to drop us an email from the [contact form](https://alvarotrigo.com/#contact). Make sure you select "wordpress" as the topic.