Тёмный

How To Make Your WiX Website Look GREAT on ALL Screen Sizes | WiX Classic Editor | Responsive Design 

The Wix Wiz
Подписаться 7 тыс.
Просмотров 102 тыс.
50% 1

Ever design your entire WiX website only to discover that it only looks good on a wide screen or small screen?
Are parts of elements getting cut off or spaced weirdly?
Watch this!
In this video I explain how to build your website so that it looks great on all screen sizes - even in the classic editor!
New to Velo? Try my new Velo for Beginners course:
www.udemy.com/...
Have an idea for a video? suggest it here:
www.thewixwiz....
Have questions? Join the discussion:
www.thewixwiz....
Want to have joint coding session? Book one now:
www.thewixwiz....
Have questions? Need some magic done on your website ASAP?
www.thewixwiz....
Follow along on Twitter @thewixwiz
Facebook page: / thewixwiz
Facebook community: / thewixwiz

Опубликовано:

 

5 окт 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 151   
@thewixwiz
@thewixwiz Год назад
Thanks for watching! I'd love to hear if this helped and what other challenges you have encountered while building your website on WiX👂
@phylectures2023
@phylectures2023 Год назад
Great content. You explained everything very nicely. I am facing problems with the mobile version. The desktop version looks good but when I move to mobile version, everything gets crappy.
@Reneekelley68
@Reneekelley68 8 месяцев назад
I have to try this I hope I can get it to work. Content look but my logo was all the way over to the left in the header, so when I reviewed it on my iPad it wasn’t there, I couldn’t see it.
@robertaquimson
@robertaquimson 3 месяца назад
For some reason mobile on Samsungs is scrunched, but iPhone is fine? Any thoughts?
@TaskSwitcherify
@TaskSwitcherify Год назад
You've done a great job presenting the "solution", which is still very limited by modern standards. Your site will look outdated because the elements won't reshuffle, resize, and move around like they do on most MODERN websites. All we get is some "shrinkage", that's it. Wix should hurry up and modernize their editor (without requiring Editor X).
@factskitty
@factskitty Год назад
whats a good competitor thats more modern?
@TaskSwitcherify
@TaskSwitcherify Год назад
@@factskitty Wix Studio, if you wish to stay with that brand
@miteshmhatre3403
@miteshmhatre3403 11 месяцев назад
@@TaskSwitcherify Sir, Wix owns EditorX (Now Wix Studio I think)
@TUBESTEAKNIG
@TUBESTEAKNIG 3 месяца назад
@@miteshmhatre3403 That's what he's saying. Wix should modernize the editor to be responsive like Editor X, without having to use Editor X which is a separate design platform with separate templates.
@superpayaseria
@superpayaseria 4 месяца назад
I can't Believe it. So you're telling me after I just spent an entire year editing my website to perfection that now I'm gonna have to go back and rearrange each and every single element on the whole thing? No way
@johnwallace5284
@johnwallace5284 4 месяца назад
Yeah ive got the same problem. Designed my site in 1080p and need to optimise for 2k and 4k. Complete nightmare
@Spinstormgaming
@Spinstormgaming Год назад
Wix needs an update really bad. The mobile editor is terrible
@ShantesTravelThings
@ShantesTravelThings Год назад
Exactly why do we gotta do all that
@Spinstormgaming
@Spinstormgaming Год назад
@@ShantesTravelThings Their mobile editor almost makes me want to go to a competitor. It's terrible
@michaelmarrison6939
@michaelmarrison6939 Год назад
There used to be a tool in the mobile editor that did a fairly good job at formatting the mobile version to look like the desktop version. Unfortunately this disappeared in the recent Wix update. Discussed with support but they were uninterested and simply said the tool is no longer needed in the new version. Incorrect! It is now almost like having to build two separate web sites. Terrible!
@BCStrikeProductions
@BCStrikeProductions Год назад
Facts. I hate it so much
@shupan7345
@shupan7345 Год назад
I want to change other editor badly, but because I took long time for the current design, it could cost more time for changing to their competitor. It’s horrible.
@BrandonDJx
@BrandonDJx 4 месяца назад
The Wix resizing for other devices is really bad. Thanks for the tip!
@snehaprasad4148
@snehaprasad4148 Год назад
I am glad I saw this while creating my page instead of after. It definitely helps. Ty!
@onexluv_
@onexluv_ 2 месяца назад
Thanks for this video! This will help my friend's website look more polished and professional, and hopefully help her career too (:
@AdityaSharma-zz5gn
@AdityaSharma-zz5gn 2 месяца назад
This man just saved my website.
@babyfazejuju
@babyfazejuju Год назад
I can't thank you enough! This was so helpful and what a relief. I thought I had to pay more for Editor X, I'm just a small business and chose Wix for the pricepoint. Little did I know the functions are this limited
@thewixwiz
@thewixwiz Год назад
Happy it helped!
@tubeventures5124
@tubeventures5124 6 месяцев назад
A year old but still very helpful. Thanks for this video!
@alexwinter7769
@alexwinter7769 Год назад
This is nice and all unless on certain resolutions you don't want to move the elements attached far apart
@thewixwiz
@thewixwiz Год назад
If you want more control over the design at different breakpoints you should take a look at Editor X.
@stayoverclocked9933
@stayoverclocked9933 Год назад
@@thewixwiz isn't editor x another monthly fee? Makes me feel like Shopify is a better website builder.
@ankurjain9817
@ankurjain9817 Год назад
This is good but what if there is a banner as a single element/image ?
@ivetaermakora
@ivetaermakora Год назад
THEN nothing haha
@myrnabilingue
@myrnabilingue 5 месяцев назад
this was REALLY helpful! thank u so much! well-explained 👏👏
@maleonna
@maleonna 29 дней назад
EXACTLY WHAT I NEEDED! Thank you :)
@BharatDhungana-pk2un
@BharatDhungana-pk2un 4 месяца назад
Great video @The Wix Wiz. Can buying any premium plan from wix also helps to solve this automatically, or do we have to di it as strip and column manually?
@thewixwiz
@thewixwiz 4 месяца назад
Thanks! Buying a premium plan will have no effect on the design (except for removing the ads).
@m110zasz
@m110zasz Год назад
Had I not searched for this I might've hired someone from Wix already and paid more
@harrietcroxton7937
@harrietcroxton7937 Год назад
Just what I needed. The column and strip advise will sort my problem Thanks!
@epicuber1351
@epicuber1351 10 месяцев назад
cheers mate this is genuinely very straight forward and helpful
@TheTesolTrainer
@TheTesolTrainer 6 месяцев назад
you are an absoulte genius. thank you very much for this video : )
@leahollsson129
@leahollsson129 10 месяцев назад
Thank you so much for this!! It was driving me insane.
@lestermcmillan9038
@lestermcmillan9038 Год назад
this has been frustrating me all day, for the website just decides to make decisions for me and restrict me from making simple movements. It feels more like a puzzle than an empty canvas. I'm fed up
@thewixwiz
@thewixwiz Год назад
Have you tried the new Wix Studio?
@summer8334
@summer8334 7 месяцев назад
Thank you very much!! I only have 1 question. How can I add more than 2 columns on the strip? It gives me options to adjust percentages between two. Like 50/50 or 40\60
@thewixwiz
@thewixwiz 7 месяцев назад
Thanks for watching! Through the settings/layou panel of the strip you can add more columns and adjust their sizes.
@thebruckners
@thebruckners 9 месяцев назад
Thank you for the video. I noticed that your colored gradient background image is still cropped when you change your display settings from a higher resolution to a lower resolution (e.g., widescreen to HD). Is there a way for the background image to resize adaptively with the resolution so it is not cropped? This is the trouble I am having. Thank you for any info.
@mcs9451
@mcs9451 Год назад
This is exactly what I needed. Thanks, very helpful.
@dom901
@dom901 4 месяца назад
Great vid thank you! is there a way to do this for the top navigation bar too? my logo vanishes on a smaller screen!
@thewixwiz
@thewixwiz 4 месяца назад
Thanks! Yes, you can implement these same principles in the header.
@langhavalley
@langhavalley 10 месяцев назад
Thank you pal! You saved my website. ❤
@andrewfraser5535
@andrewfraser5535 6 месяцев назад
I've asked this question on another of your videos, if you only have a laptop to design your website would the columns expand on a wide screen monitor?
@thewixwiz
@thewixwiz 6 месяцев назад
The columns will expand but the elements inside will remain the same. (Classic Editor)
@andrewfraser5535
@andrewfraser5535 6 месяцев назад
Thank you.
@ceskymarketing
@ceskymarketing 6 месяцев назад
👍 Thanks for watching!
@wearecoldblood
@wearecoldblood 8 месяцев назад
What about the length?? I am struggling with it to look same at different screen sizes
@thewixwiz
@thewixwiz 8 месяцев назад
Very legitimate question - unfortunately not possible to adjust height based on screen size in the Classic Editor...
@wearecoldblood
@wearecoldblood 8 месяцев назад
THEN WHICH EDITOR?@@thewixwiz
@brianwaite854
@brianwaite854 Месяц назад
Great job Eitan.
@TheHunterzofOz
@TheHunterzofOz 6 месяцев назад
THANKYOU SO MUCH!! I was dying!
@kambriacookofficial
@kambriacookofficial 11 месяцев назад
This was very helpful. Thank you!
@BeRichinlife
@BeRichinlife 9 месяцев назад
Bro you came in clutch!
@vboy-youtube
@vboy-youtube Год назад
really good suggestion! Thanks a ton :)
@thisha36
@thisha36 10 месяцев назад
thank you so much that’s really helpful
@itsshitposter
@itsshitposter Год назад
Thanks a lot, my header buttons were overlapping but your solutions helped me fix it!
@thewixwiz
@thewixwiz Год назад
My pleasure! Thanks for your support!
@bobbydale8061
@bobbydale8061 6 месяцев назад
I have a simple subscription based site and I want to upgrade by adding strips and a transparent background panel. How do i resize my strips and get the same background color as my panels?
@devilviso
@devilviso Год назад
Really Really Thank you for this Great solution
@magedmohammed8674
@magedmohammed8674 Год назад
I have a question, my strip background is my banner it has an image and text on it, on my ultra wide monitor and my second 27 monitor it’s perfect but on a small device like the iPad 11 inch it’s cropped and part of the text is not showing. The text is built into the image so I can’t move it manually.
@thewixwiz
@thewixwiz 11 месяцев назад
Hey, thanks for commenting and sharing about your project! I offer viewers two options for getting assistance with their projects: 1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video. 2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding I appreciate your support and thanks for watching!
@earlypurplestudio
@earlypurplestudio Год назад
is there a way to make text scale in WIX? or to make a small enough desktop screen force to mobile view/layout?
@thewixwiz
@thewixwiz Год назад
Not with the classic editor. On Editor X you can.
@giovanniantonio91
@giovanniantonio91 Год назад
Gee fkn whizz Wix sucks
@netarichie
@netarichie Год назад
so i made my two columbs out of my strip but my columbs just have one dotted line instead of two like yours? how can i get two dotted lines?
@thewixwiz
@thewixwiz Год назад
From the column settings you can decide the placement. Center, right or left.
@xb2856
@xb2856 8 месяцев назад
@@thewixwiz You can explain where this setting is? I do not have any options for this in column management
@Mini_Arj
@Mini_Arj Год назад
I have 2 buttons on my screen, one fills the whole of the left side of the screen and the other fills up the whole of the right size (I'm going for a minimalistic design lol) and whenever I view the website on a different sized screen, it doesn't look good and so I've watched this video but I can't seem to be able to make use of strips along with buttons to make the website responsive. Please help me
@thewixwiz
@thewixwiz Год назад
Using velo you can make non button elements act like buttons. Probably your best bet
@Mini_Arj
@Mini_Arj Год назад
@@thewixwiz Thank you so much, I'll try it tomorrow and let you know what happens!
@blueblue-tm9uk
@blueblue-tm9uk 11 месяцев назад
so useful, thanks!
@melissagoh7884
@melissagoh7884 Год назад
Thanks, very helpful👍
@StaticX73
@StaticX73 6 месяцев назад
Can you make a tutorial in how to create a loading page?
@thewixwiz
@thewixwiz 6 месяцев назад
Thanks for the suggestion!
@egggy69420
@egggy69420 Год назад
I love you bro ❤ thank you so much
@roseyred1010
@roseyred1010 Год назад
THANK you!
@Nike3.00
@Nike3.00 6 месяцев назад
Can you show us how to do this but on a widescreen and a phone?
@thewixwiz
@thewixwiz 6 месяцев назад
Widescreen would follow the same principles! Mobile adaptiveness works a little differently. It will basically reflect what you see in the editor on all mobile screen sizes.
@ChillBuddies
@ChillBuddies Год назад
great vid!
@iamcatholic_
@iamcatholic_ Год назад
Thanks!
@iRGORoofing
@iRGORoofing 8 месяцев назад
hello this is great how about when it shows for the phone? it shows there is a huge gap
@thewixwiz
@thewixwiz 8 месяцев назад
You should be able to adjust that in the mobile editor!
@iRGORoofing
@iRGORoofing 8 месяцев назад
@@thewixwiz I was not able too do you have a different video I can watch to guide me if so! please send me the link!! Thank you!!
@tiffsterritoryonyoutube
@tiffsterritoryonyoutube Год назад
Helpful, thanks
@jmmorgenstern7005
@jmmorgenstern7005 Год назад
Yeah so shouldn't wait take that into very major consideration because I don't know how where to put strips so how am I supposed to do it which needs to be a little bit redesigned that you don't have to put strips everywhere actually I'm experiencing this problem and you notice exact problem that being described over here I don't know what where what went to do I hope Wick support is actually able to help me and put the strips where they need because I would not know where to put it
@thewixwiz
@thewixwiz Год назад
This may help you: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-rXtoeZygJbY.html
@MrKhaled247
@MrKhaled247 Год назад
Thank you
@bhavesh516
@bhavesh516 Год назад
Can u show how to add expand on click search bar to wix
@thewixwiz
@thewixwiz Год назад
Hi Bhavesh, can you share a link to a website with a similar feature?
@thewixwiz
@thewixwiz Год назад
@@bhavesh516 I have a video coming out soon about toggle buttons which I think will help you. If not let me know.
@bhavesh516
@bhavesh516 Год назад
@@thewixwiz waiting
@thejwb1
@thejwb1 Год назад
What about mobile??? The dang thing throws the images all at the bottom for 2 column layout! I put the images below the headings and the image laps over the text! Can't change the HTML either? VERY lame usability so far in Wix!
@thewixwiz
@thewixwiz Год назад
On mobile you have the option to switch the order of the columns within a strip with the up and down arrows. Also you can make additional edits by moving around elements to suit your needs.
@thejwb1
@thejwb1 Год назад
@@thewixwiz i realized i gotta make the mobile site separate from desktop. So it's ok.
@alessandrogibogini3526
@alessandrogibogini3526 8 месяцев назад
Thank you so much for the tutorial is super useful. I have just a problem with navigations arrows in the banner, I can see them on a wide screen monitor but Wix crop them out of the view when I switch to the laptop screen, and I can't move them freely like a button.. can you help me? I also have a very annoying white border on left and right of the banner in the wide screen view..I tried everything but I can't get rid of..
@thewixwiz
@thewixwiz 8 месяцев назад
Thanks for watching! You can check if the element you are using has a stretch property.
@alessandrogibogini3526
@alessandrogibogini3526 8 месяцев назад
@@thewixwiz Thank you. I resolved redoing completely the element, this time as element>Interactive>Slideshows. And now is responsive, Idk what kind of element was the first time (it was a website originally made from someone else).
@jackobrien4638
@jackobrien4638 Год назад
Thanks bruv!
@SergeyRaevsky
@SergeyRaevsky Год назад
Thanks a lot
@najwahadi5543
@najwahadi5543 Год назад
Thank you 🌸 I Would ask about browsing my website by mobile in Desktop site Chrome screen size looks different, is it normal?
@thewixwiz
@thewixwiz Год назад
Yes that is normal on the Classic editor! The website decides which version to display based on the device type.
@najwahadi5543
@najwahadi5543 Год назад
@@thewixwiz Thank you so much, now I have a great website. How can I reverse content from the left to the right side? I wanna add Arabic language. 😶Can you help me plz?
@resone3645
@resone3645 Год назад
im having problems with my strip image sizes. I have uploaded 4k images for best quality, and have converted them into JPG files for wix. When I set these images as strip background they are stretched and zoomed. When i zoom out on my browser to -200% the images are still stretched from edge to edge... I am trying to figure out how to resize my entire wix website but in the toolbar option the Width is grey'd out and locked making height the only thing I can adjust. Is there anyway to re-format my website to be a standard 1920x1080? right now it seems my website is 4K..even when I adjust margins on site it just create white spaces so my screen fit image is not truly a screen fit. It says the standard page size is 960px but again, when I zoom out on browser you can see the footer being stretched from edge to edge, meaning the site is not standardized on 960x but rather 4k or 8k. contemplating on leaving wix when I called and talked to technical support they told me to purchase editor X ( a completely separate platform than wix) and integrate that into my site if i wish to change site size.
@thewixwiz
@thewixwiz Год назад
Strips can be stretched either to screen or to page. If the image is the strip background it stretch accordingly. If you wish to discuss this further please post your question on the forum along with supporting screenshots: www.eitanwaxman.com/forum
@vinnycarvalho8561
@vinnycarvalho8561 Год назад
Great vid
@aloy5413
@aloy5413 Год назад
is there other ways where we can just adjust it via code at the html editor?
@thewixwiz
@thewixwiz Год назад
No... Wix doesn't allow direct access to the DOM
@huynhuctrung3451
@huynhuctrung3451 Год назад
TY ❤❤
@El.cattivo
@El.cattivo Месяц назад
When I edit on mobile it screw up my pc wersion. How to fix that?
@thewixwiz
@thewixwiz Месяц назад
Changing the mobile version shouldn't affect your desktop version. Vice versa is not the case, so make sure your desktop version is down pat before moving on to mobile.
@thejwb1
@thejwb1 Год назад
The menu links work on desktop but hidden on mobile. How to fix I tried everything!
@thewixwiz
@thewixwiz Год назад
Hi, please reach out on the forum with screenshots and an explanation of your problem. eitanwaxman.com/forum
@wouldntyouliketoknow12345
@wouldntyouliketoknow12345 Год назад
My site is not responsive... like at all. My text is all in the safe zones and when the screen size is adjusted, it just cuts is off anyway.
@thewixwiz
@thewixwiz Год назад
Hmmm if you would like us to take a look please provide the details and screenshots on the forum: www.thewixwiz.com/forum
@TrixxOfficial747
@TrixxOfficial747 Год назад
My logo comes out extremely small each time I put I, idk what to do anymore.
@thewixwiz
@thewixwiz Год назад
Hey, thanks for commenting and sharing about your project! I offer viewers two options for getting assistance with their projects: 1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video. 2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding I appreciate your support and thanks for watching!
@terrydorn
@terrydorn Год назад
recreating the home page strips has become a nightmare. sections with strips and strips for partitions with columns... so far a nightmare unresponsive to mobile screen. the previous strip home page was easily responive. hours and hours and hours of trying to get it right.
@thewixwiz
@thewixwiz Год назад
Sorry to hear ..
@rogeliocatubig6127
@rogeliocatubig6127 Год назад
The website that I creates in Wix are not responsive please help me.
@thewixwiz
@thewixwiz Год назад
Hey, thanks for commenting and sharing about your project! I offer viewers two options for getting assistance with their projects: 1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video. 2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding I appreciate your support and thanks for watching!
@ShantesTravelThings
@ShantesTravelThings Год назад
For the life of me wix refuses to have my tablet view look right
@thewixwiz
@thewixwiz Год назад
If tablet view is a priority to you you may want to consider Editor X
@kallinikos100
@kallinikos100 Год назад
How about on Editor X?
@thewixwiz
@thewixwiz Год назад
Here you go: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-sYNThLzRu_4.html
@dreamlandchannell
@dreamlandchannell 6 месяцев назад
god bless you >3
@selinartjourney
@selinartjourney Год назад
Hi, I just made a website in wix and try to make it responsive. It works well in preview mode (desktop & mobile), also live site on my tablet and my phone. But the problem is, in some mobile devices it appear like this: when the page reload, it displays correctly, but after seconds, the screen going slightly outside the device screen width, leaving white space and looks like the page cut off. So the user have to drag it to the correct position. Anyone can help to fix it? so it will be responsive for all devices. Thankyou.
@thewixwiz
@thewixwiz Год назад
This is something I would reach out to Wix support about
@bhavesh516
@bhavesh516 Год назад
Hey
@Dthedutch4
@Dthedutch4 11 месяцев назад
i have a large photo i want to fit...so columns won't work...it looks good on large screen but not on tablet. what can i do to have that fit properly? thank you
@thewixwiz
@thewixwiz 11 месяцев назад
Hey, thanks for commenting and sharing about your project! I offer viewers two options for getting assistance with their projects: 1. My free forum: thewixwiz.com.com/forum - I try to address questions there at least once a week. Please support your question with code snippets, screenshots, and even video. 2. Offering my services as a developer. You can schedule a consult at thewixwiz.com/book-online or fill out this onboarding form: thewixwiz.com/client-onboarding I appreciate your support and thanks for watching!
@dr.bbsambo8565
@dr.bbsambo8565 Год назад
Is there anyone worrying about auto-shifting of elements on Wix?
@Inferiorrrr
@Inferiorrrr Год назад
this method completely destroyed my mobile site, totally unusable and now need to completely get rid of all the strips. DO NOT DO THIS METHOD
@thewixwiz
@thewixwiz Год назад
Sorry to hear you think that, please note that any changes you make to your desktop site affect your mobile site and you may have to readjust it. Good luck with the rest of your site!
@FangsofYima
@FangsofYima 10 месяцев назад
Can I just say, I hate tablets.
@thewixwiz
@thewixwiz 10 месяцев назад
😅
@popaandrei3257
@popaandrei3257 4 месяца назад
Very useful. Thank you!🫡
@EmpireEcho
@EmpireEcho Год назад
I've got a question. WHY we need to put everything inside the grid that wix show us and not doing it by its self like HTML or CSS does?
@thewixwiz
@thewixwiz 11 месяцев назад
As a platform Wix restricts access to the DOM. As to why, it's probably a mixture of security and trying to prevent DIYs from messing things up.
@npcertificationacademyllc8926
@npcertificationacademyllc8926 10 дней назад
PLS SUBSCRIBE- HE IS GOOD
Далее
Stop Making These Mistakes on Your Wix Website!
12:23
skibidi toilet multiverse 042 Trailer
01:57
Просмотров 3,1 млн
BEST Website Builder 2024 (My TOP Recommendation)
15:27
Why is THIS the Perfect Homepage?
14:21
Просмотров 578 тыс.
15 WEBSITE MISTAKES AND HOW TO FIX THEM ON WIX
16:18
Просмотров 117 тыс.
Setting Site Width in Wix Studio | Wix Fix
6:35
Просмотров 8 тыс.
Reacting to 21 Design Portfolios in 22 Minutes
22:41
Просмотров 609 тыс.