The Best Free Wordpress Slider - In-depth Tutorial on Depicter

แชร์
ฝัง
  • เผยแพร่เมื่อ 7 ส.ค. 2024
  • We're revisiting Depicter with a more in-depth Tutorial on the features and some bugs that you may want to be aware of.
    depicter.com/
    It's Free and works with shortcodes in your Page Builders/Wordpress Classic.
    00:00 Intro
    00:43 Get Started
    01:00 Templates
    01:37 Create a Blank Slider
    02:04 Stock Images/Shapes/Text/Videos
    03:09 Options
    03:36 Rename Slides
    04:24 Add Background Image
    07:30 ISSUE with Background Image?
    08:06 Add Text
    09:35 Can we add Custom Fonts?
    11:28 Element Settings like Hover
    12:28 Animations
    13:35 Add a Button
    15:13 Button and Text Animations
    17:18 Navigation Buttons
    19:50 Navigation Actions
    21:40 Add another Image
    22:49 Check the Mobile View
    23:10 ISSUE with Mobile Background Image
    23:29 Adjust Layout for the Mobile
    24:05 Create Slide 2
    25:53 ISSUE with Swapping Images
    26:50 ISSUE with Copy and Pasting Styles
    27:15 Create Slide 3
    28:00 Add a Button to go from Slide 1 to Slide 3
    29:35 Preview
    29:53 Undo Loop Navigation
    30:25 Get the Shortcode
    31:04 Add the Shortcode to a Page
    31:29 Preview on the Page
    31:33 ISSUE with Loop Navigation still remains
    32:07 ISSUE with Fonts if you remove Google Fonts
    32:52 Page Speed BEFORE adding Depicter
    33:51 Page Speed AFTER adding Depicter
    35:43 Conclusion
    The Best Free Wordpress Slider - In-depth Tutorial on Depicter
    We love to create - share - respond - and deliver.
    🧐 Learn with our Mastery Modules: websquadron.co.uk/web-design-...
    👕 Get our Merchandise: websquadron.co.uk/merchandise
    😃 Join our Facebook Group: / 3309523509284305
    😃 Get Code Snippets: r.freemius.com/10565/3304295/
    😃 Get Elementor Pro: be.elementor.com/visit/?bta=2...
    🥹 Support us: paypal.me/Websquadron
    Hire us to work on your Website!
    💌 info@websquadron.co.uk
    👩💻 Visit websquadron.co.uk
  • แนวปฏิบัติและการใช้ชีวิต

ความคิดเห็น • 71

  • @Who.Said.Photography
    @Who.Said.Photography ปีที่แล้ว +1

    Looks - cool, will have to give it a try. Thanks for the demo and finding this one at the very least I can review the templates for ideas.

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      The templates are alone are awesome :)

  • @martifingers
    @martifingers ปีที่แล้ว +1

    Thank you!

  • @SilverFOXO
    @SilverFOXO ปีที่แล้ว

    Hey imran. Double clicking on the slider to optimise your image cropping works. Just like canva.

  • @stanamster1697
    @stanamster1697 ปีที่แล้ว +2

    This plugin has great potential. At the moment, It does have a few bugs that will drive a designer crazy though. Maybe the developers are looking at user videos and user feedback and are working through the issues we find. I hope they will add a window that shows the layers on a timeline type of thing. And, you can edit from the timeline. I believe SS3 and SR allow that. All in all, I think this plugin has great potential and can be a must-have tool in some cases.
    Imran, this video showed me something I totally missed when I was playing with this yesterday. Thanks man!

  • @antonichristian5845
    @antonichristian5845 ปีที่แล้ว +1

    great video Imran!!! btw in elementor depicter has its own widget if you search for it when you drag it in you can select any active sliders....

    • @websquadron
      @websquadron  ปีที่แล้ว +2

      I keep forgetting that!

  • @visualmodo
    @visualmodo ปีที่แล้ว +1

    TOP!

  • @emmanouil1453
    @emmanouil1453 ปีที่แล้ว

    Thanks Imran.
    This is really the Elementor equivalent for Sliders.
    I wonder how we could exploit *Data Sources* tab to automatically create slides from posts.

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Good question. I'll doublecheck if it allows posts.

  • @HaifengZhu-pn3uq
    @HaifengZhu-pn3uq ปีที่แล้ว

    I like it

  • @Houlgravely
    @Houlgravely 8 หลายเดือนก่อน

    When you mess with Buttons and try to add a URL, it doesn't accept any of my published pages. It only accepts the home page as a URL and otherwise gives me a red glow of death with the i or ! point thing.

  • @hicetnunc_
    @hicetnunc_ 10 หลายเดือนก่อน

    Mine looks blurry by phone if I set image as background, but doesn't if I don't. But I need to, since otherwise the images will not show properly on all devices.
    I also tried uploading full res, having no optimization at all. I'm desperate for a solution!

    • @websquadron
      @websquadron  10 หลายเดือนก่อน

      Best to check with the Devs.

  • @KariposTheOne
    @KariposTheOne ปีที่แล้ว +1

    I always try to avoid additional slider plugins and a hero slider as you saw is a nightmare for the performance 😀

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Agreed

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      And got to love the Bricks Builder Nestable Slider

  • @syafiqafifuddin5983
    @syafiqafifuddin5983 ปีที่แล้ว

    How to change the resolution on mobile device to be landscape slider just like the pc device? I've tried to change it on option but thats not working, the content area box change to landscape but when I publish and check on my page, it still on a potrait with my content on centre of it, please help me solve this 🙏

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Have you checked with the Developers?

  • @shillsweb
    @shillsweb ปีที่แล้ว +1

    Did anyone encounter a small issue where the slides and texts are showing great in both elementor editor and depictor editor but when you go to a live site, there is a grey/white background showing for the slides instead of your images. If so how did you rectify it please and thanks.

    • @websquadron
      @websquadron  ปีที่แล้ว

      Best to check with their Dev team

    • @shillsweb
      @shillsweb ปีที่แล้ว

      @@websquadron ahh oki np will do 😁😁😁

  • @gianmarcogiuliarig
    @gianmarcogiuliarig ปีที่แล้ว

    My friend... you know that I love your videos, I need help with something... I need to create a SLIDER with dynamic content (latest post content in particular) Have any idea how? Thanks!

    • @websquadron
      @websquadron  ปีที่แล้ว +2

      I would use templates inside the Elementor sliders. Each template would contain a blog post. And each of them would use the offset function so that it only ever shows the latest, the 2nd, the 3rd etc

    • @haagsesam
      @haagsesam ปีที่แล้ว

      You can do that, take one of the examples with posts slider. Only bad thing, it can not open in the same window, it opens in a new window!!
      I have not succeed to open in same window

  • @erling5148
    @erling5148 ปีที่แล้ว +1

    Nice tutorial but a slightly smaller "pepsi drinking" Imran would be great for tutorials
    Also as you can see you can position de background strange as it may sound its called Background Position

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      I tried that Background Position but it wouldn't remain in place for the Mobile, and sometimes it adjusted the desktop instead. Did you find that?

    • @erling5148
      @erling5148 ปีที่แล้ว

      @@websquadron I have an even bigger issue that I did report, on a local server (this is how i test) the latest version of the plugin simply does not work

  • @SuburbanPhilosophy
    @SuburbanPhilosophy ปีที่แล้ว +2

    1st view, 1st comm, 1st like :)

  • @adrianlieurance7788
    @adrianlieurance7788 ปีที่แล้ว

    Slides look different on chrome and safari. It doesn't work as you describe. My install has glitches. Currently trying to get support.

  • @SilverFOXO
    @SilverFOXO ปีที่แล้ว

    Hey imran, have you made a video about rive and lottiefiles?

    • @websquadron
      @websquadron  ปีที่แล้ว

      Nope. But you could make some with Canva

    • @SilverFOXO
      @SilverFOXO ปีที่แล้ว

      @@websquadron ??

    • @websquadron
      @websquadron  ปีที่แล้ว

      @@SilverFOXO th-cam.com/video/dP2xPKIN6wE/w-d-xo.html

  • @Tom59Kriek
    @Tom59Kriek ปีที่แล้ว +1

    I struggled with the layouts in containers, but sort of managed after a while. Then I created another slider and it broke my Elementor page, with a critical WP error, just on that page. I mailed them, but they did not come back. (just the initial auto answer that they got the message.) I wonder how long they will take? In the meantime, any pointers on how I can try to fix it? I do not want to uninstall and re-install or use my backup. A lot of work will be gone if I do.

    • @Tom59Kriek
      @Tom59Kriek ปีที่แล้ว

      When seeking help with this issue, you may be asked for some of the following information:
      WordPress version 6.0.2
      Active theme: Hello Elementor (version 2.6.1)
      Current plugin: Depicter (version 1.1.9)
      PHP version 7.4.30
      Error Details
      =============
      An error of type E_ERROR was caused in line 200 of the file /home/zxcvcaha/public_html/wp-content/plugins/depicter/app/src/Modules/Elementor/SliderWidget.php. Error message: Uncaught Error: Call to a member function toArray() on null in /home/zxcvcaha/public_html/wp-content/plugins/depicter/app/src/Modules/Elementor/SliderWidget.php:200
      Stack trace:
      #0 /home/zxcvcaha/public_html/wp-content/plugins/elementor/includes/base/controls-stack.php(2223): Depicter\Modules\Elementor\SliderWidget->render()
      #1 /home/zxcvcaha/public_html/wp-content/plugins/elementor/includes/base/widget-base.php(609): Elementor\Controls_Stack->render_by_mode()
      #2 /home/zxcvcaha/public_html/wp-content/plugins/elementor/includes/base/widget-base.php(733): Elementor\Widget_Base->render_content()
      #3 /home/zxcvcaha/public_html/wp-content/plugins/elementor/includes/base/element-base.php(534): Elementor\Widget_Base->get_raw_data(true)
      #4 /home/zxcvcaha/public_html/wp-content/plugins/elementor/core/base/document.php(957): Elementor\Element_Base->get_raw_data(true)
      #5 /home/zxcvcaha/public_html/wp-content/plugins/elementor/core/base/document.php(631): Elementor\Core\Base\Document->get_elements_raw_data(Array, true)
      #6
      I hope the info does not open me up to hackers. Does not look like sensitive info?

    • @websquadron
      @websquadron  ปีที่แล้ว

      I hope they get back to you asap

    • @Tom59Kriek
      @Tom59Kriek ปีที่แล้ว

      @@websquadron They must have seen this, as they just answered. On a Saturday!

    • @websquadron
      @websquadron  ปีที่แล้ว

      @@Tom59Kriek Awesome. I hope the issue gets resolved.

    • @Tom59Kriek
      @Tom59Kriek ปีที่แล้ว

      @@websquadron Seems that there is an issue in this version that would be fixed in the next update, so please be patient for the next update.
      Thanks for being patient.

  • @BENZIVAR93
    @BENZIVAR93 ปีที่แล้ว

    my video slider isnt loading on my page, jst 2 dots all the time, any idea?

    • @websquadron
      @websquadron  ปีที่แล้ว

      Best to contact their Dev team

  • @haidarsurabaya17
    @haidarsurabaya17 ปีที่แล้ว

    how to merge multi template ?

  • @aman64045
    @aman64045 ปีที่แล้ว

    How can we use .GIF images on wp page ???

  • @GeorgeWebDevCy
    @GeorgeWebDevCy ปีที่แล้ว +1

    No more revslider required:)

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Totally right.
      I hope they clarify or correct me on the background mobile issues.

  • @cankarahanli
    @cankarahanli ปีที่แล้ว

    hi, i couldn't find the auto scroll part

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Double check with the devs

    • @cankarahanli
      @cankarahanli ปีที่แล้ว +1

      @@websquadron I did but can't find. I want auto slide

    • @p.davidrij8319
      @p.davidrij8319 ปีที่แล้ว

      @@cankarahanli I haven't completed the slider and installed it yet, but I was wondering the same, I want an auto slider

    • @cankarahanli
      @cankarahanli ปีที่แล้ว

      @@p.davidrij8319 My friend, Option in the upper left corner

  • @nabilanuzhatmoin5392
    @nabilanuzhatmoin5392 ปีที่แล้ว

    after adding the short code it is not loading.

    • @websquadron
      @websquadron  ปีที่แล้ว

      Oh no - check with the DEV team. Are you aggregating any JS or CS with optimisation plugins.

  • @adied7725
    @adied7725 ปีที่แล้ว

    can we add bg videos?, please

  • @oguzbenice7423
    @oguzbenice7423 7 หลายเดือนก่อน

    Depicter is poorly responsive on mobile. Text wrapping not working...

    • @websquadron
      @websquadron  7 หลายเดือนก่อน

      Yup, I don't use it anymore.

  • @squirrelpropertyservices1259
    @squirrelpropertyservices1259 ปีที่แล้ว

    Doesn't work with my site. Just breaks it and creates a critical 500 error. One I remove the plugin then everything works as normal. I'm on the latest wordpress build using elementor and all plugins are up to date. shame really.

    • @websquadron
      @websquadron  ปีที่แล้ว +1

      Let the Developers know, and have you checked with your Host Provider regarding PHP?

    • @kevinatinda2242
      @kevinatinda2242 ปีที่แล้ว

      Experienced the same her, especially when using free templates.

  • @shahzadhaider9195
    @shahzadhaider9195 8 หลายเดือนก่อน

    Sorry to say it's total sucks for mobile devices like smartphone,