How to Use Absolute & Fixed Custom Positioning in Elementor
ฝัง
- เผยแพร่เมื่อ 5 ต.ค. 2024
- 2022 UPDATE: Custom Positioning is now called Position and can be found under the Advanced ▶ Layout tab.
Learn how to use absolute and fixed custom positioning in Elementor 2.5.
You will learn:
✔︎ The difference between absolute & fixed position
✔︎ How to freely position your widgets on the page
✔︎ Use absolute & fixed positioning the right way!
Learn More: elementor.com/...
Get Elementor Pro: elementor.com/... - แนวปฏิบัติและการใช้ชีวิต
![How to Add Custom CSS in Elementor [PRO]](http://i.ytimg.com/vi/xv9RjJky720/mqdefault.jpg)
![How to Add Custom CSS in Elementor [PRO]](/img/tr.png)
2022 UPDATE: Custom Positioning is now called Position and can be found under the Advanced > Layout tab.
I have the 3.9.2 version but even my mouse cursor icon differs with the one in the video,as I mentioned in the comments I’m not able to move or resize section,images etc. like you do.
Im badly stuck in this situation i hope you can help me
My absolute favorite part about your tutorials, is how you say, "cool" it's awesome. Never stop.
amazing how this feature doesn't even exist and yet you managed to make a tutorial on how to use it, congrats!
@arekt2998 thanks for your comment. Please see the pinned comment in the video: Custom Positioning is now called Position and can be found under the Advanced > Layout tab.
I dig this guy's accent! He's also directly to the point. Thanks Mr Instructor, you helped a noob immensely with this.
Hi guys! Fantastic stuff! Been using Elementor over 2 years on various projects now. Please add more responsive controls such as smartphone & tablet orientation. Having an option to have multiple breakpoints for each device types ( in preview) would be a godsend!
Unfortunately this absolute position (which probably should be called 'relative') doesn't work after zooming and the website becomes disjointed.
I just shocked, We are using elemntor in our company for 2 years and we never knew about this feature, amazing job!!! Thansk for the video toooo!
Saves my time on making a floating table of content. Well done Elementor teams!!!
I myself are very interested in all the cool background you make for your demo video's.
Could you guys perhaps do a video on that? (Colum styling etc)
Would be awesome!
Such a simple looking new feature but it fundamentally changes web design for WordPress. Well done Elementor. 🔥🏆
[SOLVED]
Hiyoo! O/ So if the object still scrolls with the page having Custom Positioning Fixed, whats wrong?
[EDIT]: Changed the theme, did a minor change on the page with elementor so I could press update, and now it works.
hi . I've got a problem I've been struggling with over the last 2 days. i use the absolute positioning for an image element.
but the problem is , whenever i change the size of the screen,the position of the element changes . i know i can do the things on tablet and mobile forms, but what about different sizes on desktop screen ? I'd be so grateful if anyone helps me .
Hi there, did you get a resolve to this??
Does this only work in elementor pro, the fixed position is not working for me.. Any thoughts?
Great! Less CSS ;)
I love Ziv's accent, btw! Sounds like scottish but not quite. It's a very interesting, calm, and clear voice to explain a video!
Thanks Cécile, what an awesome compliment! I have a South African accent 🇸🇸
@@zivgeurts That's right! I never would have guessed, but now that you say it, totally!
Why I can't get my transparent background .png to actually show up as "transparent" in the image box? It just fills in a standard background (white)
wow, your videos are simply life saving for me. love you a lot for all your videos!
I have a question everytime I edit my website in desktop mode it changes in mobile mode how do I stop that?
This is the best tutorial ever. thank you so much.
This is absolutely not mobile responsive. You can go to mobile and change the position, but when you go back to desktop all the positions are changed.
This is right man how to fix this
@@alimaster5292 duplicate the elements with one particularly for mobile and set it to the position and size you want, the hide the elements responsiveness across the devices view. That's the trick I usually use though,I don't know if it's good practice. Since I'm not really a web designer.
@@benedictonwe7884 This works but it's really not best practice. I've had to use this because its not possible to switch position responsively. It seems silly to me being a developer as you can use a media query to change position:static; to position:absolute; easily so why can't it work?
he literally points out the disclaimer that's it's not the best practice to use it frequently because it's not responsive
@@reformatco Hey! I'm curious, as a developer, do you write additional media queries for elementor, or do you just go with the basic breakpoints they give you?
If it only worked this well!!!!
can fixed elements stay fixed until a certain point in the page? and then for example change to a different element? (like from a light logo to a dark logo, you get the idea)
Im literally never writing css again... i have switched to elementor... from other builders... im sooo building something mad with this and pods
Yeah CSS and JavaScript take so much time and are a pain in the ass
thank you master ...
Is it possible to change the layers on this? Meaning I want it to be moved to the back of the page so it doesn't block/disable buttons I need to be clickable. Right now I have a bokeh png floating over text and a button but it disables it.
Set a z index for each object depending on the order of layering. 0=closest to the background
I was thinking if elementor give us full control on the slider like pop-up feature, let us design slider like if we design a normal page using elementor to every slide, i hope you guys make this it will be too cool also the parallax effect you should add something like this (parallax not fixed) parallax on text on images on every element. Good luck i love you ❤️❤️👍
Heavy Riven I agree about the slider. Wouldn’t it be great if we could use Elementor templates to create slides, then call them into the slider.
Good idea!
Yeah, that's a great idea. With the free plugin "Brizy page builder" it is already possible. Nice suggestion for the Elementor.
@@Simon-sly perfect that exactly what i wanted to say 👌🏻❤️
Ultimately I got it, thank you
Can this feature be used in the free version?
Thank you
Very helpful... thanks so much ...
How to make Popup design that you use in vedio...please make vedio on this
This was super helpful. If we reorganize our elements per devide type, are there any risks with using Absolute & Fixed? Thanks!
Great tutorial,
what about the *inner section*, what if we want a whole div to be set absolute. how can we achieve that.
kind regards
Dude, you guys are crazy! WTF Guys this can change the internet. You Guys do soo cool stuff loooooool
Thanks, very very helpful
The fixed photo will be at the lowest of the page, will enter into footer when keep pull down the page, please check
Position and orientation should be configurable per responsive size. And what about relative positioning?
ah thank you so much
Hi Great tutorial! However, on different screen sizes my elements keeps freaking out... Please help. I see in theres a comment by Fateme Fouladkar. im having the same issue and i see there was no feedback
Very Nice and help full, after pop up and this update i think elementor now is too much better than divi.
nope. Not that simple, absolute works with the sizes of elementor's preview interface : BUT NOT wITH THE INIFINE MULTITUDE OF SCREEN SIZE. This tut was misleading.
How to do the pop up with the fixed position ?
Same question .
Great explanation. You've a real talent!
You guys are amazing!!!!
Those animated characters are made from Adobe illustrator ?
Mobile preview... what you see is not what you get! Looks great on Elementor preview but when I look on my phone it's not even close. Any updates on this tutorial, please?
Hey, could you help me about the custom positioning. My custom positioning button is buried by image carousel so that it can not appear above the image carousel, please help.
Great. But how to make absolut items being responsive to other screen sizes. For example, if I put an absolut item on 27' screen size and then enter the website on 15 inch laptop, it's all going messy. How to fix that please? 🙏
Did u find and answer to this?
I LOVE #ELEMENTOR PRO
AT 4:07, as you scroll, that pink cube animates to grow as it appears on screen. Is there a tutorial for that? If so, can you share?
Hi everyone, I was wondering where do elementor teams make their beautiful icons (here the skateboarders). Do you have a specific website to create image and icons like that, or do you create them yourself ? Thank you.
Thank you!
when you change the position of the images on mobile does that also change their position when you switch back to desktop?
Just beautiful ❤️
Can I set after a certain scroll distance the icon will appear?
definitely useful video
where do you get these sorts of illustrations?
This only work with pictures or all elements?
It works for an widget.
i beg for help guys
I have the latest elementor pro version but mine doesn’t have the ability to move sections this easy with the mouse! I can’t move sections or widgets optionally just like the video can sb pls help me?what should i do?does it have
any specific settings or what?
Does it work in Gutenberg ?
Is custom positioning feature available for free version of elementor ????
do you need Elementor pro for this?
Hello. Can we use absolute positioning for every elements?
You can use it on an widget.
I cant find this on the free version of elementor...is this option only on the pro?
it is impossible to keep Icons in their absolute position once you change the size of the browser. even if i use the drop down menue on the side to either show or hide elementor functions it ruins my set tup. Is there only one RIGHT size in which I have to use my Browser while i create? .... it is frustrating
Elementor is god for me😍
Can this feature be used in mobile??
I want to use an element ... that comes up in the browser and when it reaches the center of the screen ... it stays fixed. I used a section, I put a column and I put an image ... the center ... and to the section I put full height, the photo I left fixed in the center ... I put stiky on the top ... I moved the upper and lower margins of my image ... and it stays in the center but when using more resolutions it gets out of phase and stays either lower or higher than the center. How can I make an object sticky right in the center of the screen using% so that when shrinking the screen it is always in proportion to the center of the page?
Is it Custom Positioning a Pro version feature???? I can't find it in my menu
Hi Fabio, custom positioning is available for all Elementor users. You'll find it in the Advanced Tab > Positioning > Width > Custom
I change the responsiveness it doesn't work please hepp
Awesome!
SUPER!!
what name of page if just background and button "go to shop" or "shop now"
i want make single full page just big slide background and button "Go Shop" without footer or header.
any name you want. set dont show title. Set background image and choose Heights of section to full screen
Amazing !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
I agree Roy 💯!!!
Thet Seth Effican eksent ;)
it's fantastic !!!!
This is great for a specific fixed-sized page but they are incorrectly calling this a responsive design as it does not work when you change the size of the page. They will not respond to our comments so be aware that if you want this to work correctly, you'll need to learn a lot more about web design (something I'm trying to do to create a truly responsive web design).
It’s like an Illustrator to Wordpress web design
Is this regular or Pro? I don't have it.
Hey Audun, it's in all versions. Custom Positioning is now called Position and can be found under the Advanced > Layout tab.
@@Elementor Found it. It says it's not recommended, maybe something about many values for SEO to deal with? Why is that exactly?
And is there any courses on how to learn elementor?
Is there more positioning options in Elementor Pro? Like a snapping grid or anything.
Hi Audun, we have courses on our Academy: elementor.com/academy/courses.
@@Elementor Thanks. Do you have even more advanced and payed?
So Amazing!! Curious one issue I have is when I click to mobile style I can’t reach some of the off screen elements to adjust to be in screen
How can I do this pls? No way way to use left right up down arrows to move or...? #mobilefirst2019 🙌🏻⚡️📱💪🏻💥👍🏻
Can we build essayshark.com website with elementor, if yes please tell me little bit how I can make latest order page and Top writer page like on this website, plz tell me thanks a lot
You can build any website with Elementor! Here's a link to our quick 3 minute overview th-cam.com/video/-TPpwuB6dnI/w-d-xo.html
Yeah but he never told or show you that how it will react on smaller screens like Laptops for example, now see it on a laptop, its absolutely messed up.
"Cool, cool, cool" - this is absolutely NOT COOL, because it isn't responsive!
Wao
😍
נייס
pagespeed 10 jajajaja