Tutorial Elementor + fullPage.js plugin

I explain how to create full-screen pages with Elementor builder by using the official fullPage plugin.
This is the easiest way of using fullPage in WordPress.
In this tutorial, I explain how to create a basic website with two vertical sections and a horizontal slide in the second section.
More information here:
alvarotrigo.com/fullPage/word...
Extensions are also available but need to be purchased separately:
alvarotrigo.com/fullPage/exte...
Questions?
alvarotrigo.com/fullPage/help...
Why using the plugin for Elementor instead of the plain JS version?
-----------------------
- WordPress is a huge CMS, many things can interfere with fullPage.js. The plugin takes care of most of them to make your life easier and save you - literally - hours of headache.
- Integrates background videos in a super-easy way.
- Anyone can understand it and edit every single fullPage.js option (50+) and without a line of code.
- Quick install and integration fullPage.js extension/s (after purchasing them)
- 1 month / 3 months / 1 year premium support. Depending on the license.
- Free unlimited updates

Пікірлер: 47

  • @olirc
    @olirc4 жыл бұрын

    Awesome, well done guys. This looks ace. Defo will be using!

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    Thanks! And if you have any feedback we will be happy to hear it! :)

  • @lifehacksukgaming5773
    @lifehacksukgaming57733 жыл бұрын

    thanks alot man i am looking for that thing looking for for more tourtial

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    What tutorials would you like to see?

  • @tanbori
    @tanbori4 жыл бұрын

    Hey this looks great. I am wondering wether i could add a topmenu after the second section so that the first screen is a pure image or video and starting from the second one a sticky navbar appears!!

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    Many things are possible with the right knowledge :) You can very probably achieve that by using callbacks such as `onLeave` or `afterLoad` also available through the plugin. Or even using the state classes added by fullpage.js. You can read more about them in the fullpage.js documentation.

  • @Salebl95
    @Salebl959 ай бұрын

    Great but how to add top header menu?

  • @HandyPlayanimation
    @HandyPlayanimation4 жыл бұрын

    Good afternoon Alvaro. I bought your plugin "FullPage for Elementor". Installed it, set everything up, as shown by you. Vertical scrolling works fine, but horizontal scrolling of inside sections doesn't work. What should I do? Can you look? I will give you access to my admin panel.

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    Scroll Horizontally with mouse wheel or trackpad is only provided through the paid extension called Scroll Horizontally: alvarotrigo.com/fullPage/extensions/scroll-horizontally.html If you don't use the extension horizontal slides can be reached by clicking on the arrows or navigation bullets or by dragging on touch devices .

  • @gigiagency3830
    @gigiagency38303 жыл бұрын

    Why isnt the horizontal scroll for the inner sections work? I've followed this very tutorial in every single step. Any idea?

  • @gigiagency3830

    @gigiagency3830

    3 жыл бұрын

    kinda annoying..the only reason why i got this plugin..

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    If you got the license then use the contact form to contact support and we'll figure it out! alvarotrigo.com/#contact

  • @BangkitBientang
    @BangkitBientang3 жыл бұрын

    Can i put a header (sticky on scroll) and footer (not sticky)?

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Sure! If you got a license please contact us through the contact page and we'll guide you with it! alvarotrigo.com/#contact

  • @Denis-pd1nw
    @Denis-pd1nw4 жыл бұрын

    Can this plugin still allow me to have a header menu?

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    Sure! In fact, you can even link it with fullpage.js so each elemenet in the menu can get the `active` class when moving to its respective section. This way you can style your button based on that class to tell visitors which item in the menu they are visualising. Just check for the "menu" option within the plugin settings :)

  • @macarenapazvogelmendoza3662
    @macarenapazvogelmendoza36623 жыл бұрын

    Hola Alvaro! estoy intentando encontrar tu mail ya que compre la "licencia con codigo" en tu pagina web pensando que era la del plugin+elementor :( como puedo hacer la devolución?? muchas gracias!

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Buenas Macarena! No problemo! :) Puedes contactarme a través del formulario de contacto. Selecciona como topic "fullapge" y la persona de soporte te ayudará! :) alvarotrigo.com/#contact

  • @macarenapazvogelmendoza3662

    @macarenapazvogelmendoza3662

    3 жыл бұрын

    @@alvaro_trigo muchas gracias, te escribiré enseguida :D

  • @sibbirius8726
    @sibbirius87263 жыл бұрын

    Big issue with horizontal slides, while using the paid elementor plugin: My template has multiple sections and inner sections, I have three slides, three templates and visit the site, the content of all three slides is on a single page.

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Yeap that doesn't sound right. You can contact us at the contact form: alvarotrigo.com/#contact

  • @rnunes260684
    @rnunes2606844 жыл бұрын

    Good Morning. When I install the plugin, I get a message The package could not be installed. No valid plugins were found. Plugin installation failed. Can I install a free version or is it only paid?

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    It is a paid version. You can get it from here: alvarotrigo.com/fullPage/wordpress-plugin-elementor/

  • @beflashjunior9817

    @beflashjunior9817

    4 жыл бұрын

    @@alvaro_trigo i was pay license so then i must pay again the plugin ?

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    ​@@beflashjunior9817 the plugin for Wordpress is a different product than the JavaScript library. What license have you payed?

  • @user-fh1qj5jp1z
    @user-fh1qj5jp1z3 жыл бұрын

    using sticky menus can work well with this plugin??

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Yeap. You will be fine. Any question or problems you can always ask us too :)

  • @user-fh1qj5jp1z

    @user-fh1qj5jp1z

    3 жыл бұрын

    @@alvaro_trigo I have problem, I made floating sticky icon, in elementor it's fine, but when it run, icon stuck on firs section, any tutorial for fix this?

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    @@user-fh1qj5jp1z if you acquired the official plugin for Elementor then you can ask us directly here: alvarotrigo.com/#contact

  • @user-fh1qj5jp1z

    @user-fh1qj5jp1z

    3 жыл бұрын

    @@alvaro_trigo yes, it fix now, thanks

  • @agboolasola4669
    @agboolasola46693 жыл бұрын

    How can I use the extensions in elementor

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Easy! After purchasing them please follow these instructions: www.meceware.com/docs/fullpage-for-elementor/#extensions

  • @sibbirius8726
    @sibbirius87263 жыл бұрын

    Hello, do you know how to use anchors? Slide one you have buttons, which link to another slide. There is documentation for this but I don't understand them: github.com/alvarotrigo/fullPage.js#creating-links-to-sections-or-slides

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    If you purchased the plugin for Elementor then feel free to ask any questions through the contact form of the page (if you are within your support time). alvarotrigo.com/#contact

  • @matthew514
    @matthew5143 жыл бұрын

    Bro - I have this installed by initialising the js. Everything is working fine, but my templates are using the background video - when i scroll to the next section the video pauses. I have referred to the docs github.com/alvarotrigo/fullPage.js#pause-on-leave I followed the documentation but I'm still having the issue? How do I stop the video pausing when I scroll? I'm using: Wordpress > Theme - Astra > Elementor Pro /* This is my JS Snippet */ jQuery(document).ready(function($) { }); $('#fullpage').fullpage({ //options here scrollingSpeed: 1000, navigation: true, slidesNavigation: true, }); //methods $.fn.fullpage.setAllowScrolling(true); }); /* HTML */ /* HTML WIDGET */ [elementor-template id="178"] [elementor-template id="178"] [elementor-template id="178"]

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    Unfortunately we can only help you if you got the official plugin for Elementor. WordPress is such a complex environment and the whole reason of creating a specific plugin for Elementor is simplifying the task for you guys. If you haven't taken a look at the plugin I invite you to do so: alvarotrigo.com/fullPage/wordpress-plugin-elementor/ Then, if you have any issues we will happily provide support to the point of even login into your page and helping you figure out what can be the problem and the possible solution for it ;)

  • @matthew514

    @matthew514

    3 жыл бұрын

    This problem also happens on the plugin though?

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    @@matthew514 If you problem is with the plugin for Elemento then please contact us for support if you still have support time: alvarotrigo.com/#contact We'll happily help you out ;)

  • @matthew514

    @matthew514

    3 жыл бұрын

    @@alvaro_trigo stuff wordpress then - i'll build it in html

  • @eddiejure
    @eddiejure4 жыл бұрын

    You should add a discount code for existing customers of fullPage.js :(

  • @alvaro_trigo

    @alvaro_trigo

    4 жыл бұрын

    You are entitled to a full refund of the fullPage.js license if you purchased that one as well. Please let us know about your case and we will happily refund you :) alvarotrigo.com/#contact

  • @_charles
    @_charles3 жыл бұрын

    Or... (without plugin) Section > Layout > Height > Min height > 100vh.

  • @alvaro_trigo

    @alvaro_trigo

    3 жыл бұрын

    That will only do one tiny thing compare to what fullPage.js provides :) That won't create a snap effect. It won't have auto height sections on responsive. It won't have lazy load, auto play/pause. It won't have anchors in the URL. It won't create css state classes for conditional css. It won't provide you with callbacks to fire actions under specific cases. It won't allow you to regulate the scrolling speed. Of course, it won't allow you to use horizontal sliders Add navigation bullets. Link the menu with the sections. Use different easing animations. Use any of the fullpage extensions (11 so far) Use continuous vertical movement. Make it keyboard accessible. Record each section as a new page on the browser history. Etc etc etc. But if having 100vh sections is good for you, surely, go for it :) Not everybody needs something as complete as fullpage.js.