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

Поділитися
Вставка
  • Опубліковано 25 сер 2024

КОМЕНТАРІ • 148

  • @thewixwiz
    @thewixwiz  Рік тому +10

    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 Рік тому +1

      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 7 місяців тому

      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 2 місяці тому

      For some reason mobile on Samsungs is scrunched, but iPhone is fine? Any thoughts?

  • @TaskSwitcherify
    @TaskSwitcherify Рік тому +61

    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 10 місяців тому +1

      whats a good competitor thats more modern?

    • @TaskSwitcherify
      @TaskSwitcherify 10 місяців тому +6

      @@factskitty Wix Studio, if you wish to stay with that brand

    • @miteshmhatre3403
      @miteshmhatre3403 10 місяців тому +2

      @@TaskSwitcherify Sir, Wix owns EditorX (Now Wix Studio I think)

    • @TUBESTEAKNIG
      @TUBESTEAKNIG 2 місяці тому

      @@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.

  • @Spinstormgaming
    @Spinstormgaming Рік тому +69

    Wix needs an update really bad. The mobile editor is terrible

    • @ShantesTravelThings
      @ShantesTravelThings Рік тому +3

      Exactly why do we gotta do all that

    • @Spinstormgaming
      @Spinstormgaming Рік тому +5

      @@ShantesTravelThings Their mobile editor almost makes me want to go to a competitor. It's terrible

    • @michaelmarrison6939
      @michaelmarrison6939 Рік тому +6

      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 Рік тому +3

      Facts. I hate it so much

    • @shupan7345
      @shupan7345 10 місяців тому

      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.

  • @snehaprasad4148
    @snehaprasad4148 Рік тому +9

    I am glad I saw this while creating my page instead of after. It definitely helps. Ty!

  • @AdityaSharma-zz5gn
    @AdityaSharma-zz5gn Місяць тому +1

    This man just saved my website.

  • @superpayaseria
    @superpayaseria 3 місяці тому +3

    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 2 місяці тому +1

      Yeah ive got the same problem. Designed my site in 1080p and need to optimise for 2k and 4k. Complete nightmare

  • @onexluv_
    @onexluv_ Місяць тому +1

    Thanks for this video! This will help my friend's website look more polished and professional, and hopefully help her career too (:

  • @BrandonDJx
    @BrandonDJx 2 місяці тому +2

    The Wix resizing for other devices is really bad. Thanks for the tip!

  • @tubeventures5124
    @tubeventures5124 4 місяці тому +1

    A year old but still very helpful. Thanks for this video!

  • @myrnabilingue
    @myrnabilingue 3 місяці тому +1

    this was REALLY helpful! thank u so much! well-explained 👏👏

  • @m110zasz
    @m110zasz 11 місяців тому +1

    Had I not searched for this I might've hired someone from Wix already and paid more

  • @itsshitposter
    @itsshitposter Рік тому +3

    Thanks a lot, my header buttons were overlapping but your solutions helped me fix it!

    • @thewixwiz
      @thewixwiz  Рік тому +1

      My pleasure! Thanks for your support!

  • @alexwinter7769
    @alexwinter7769 Рік тому +5

    This is nice and all unless on certain resolutions you don't want to move the elements attached far apart

    • @thewixwiz
      @thewixwiz  Рік тому +2

      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 Рік тому +10

    This is good but what if there is a banner as a single element/image ?

  • @babyfazejuju
    @babyfazejuju Рік тому +5

    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

  • @harrietcroxton7937
    @harrietcroxton7937 Рік тому +1

    Just what I needed. The column and strip advise will sort my problem Thanks!

  • @epicuber1351
    @epicuber1351 9 місяців тому +1

    cheers mate this is genuinely very straight forward and helpful

  • @thebruckners
    @thebruckners 8 місяців тому +2

    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.

  • @TheTesolTrainer
    @TheTesolTrainer 5 місяців тому

    you are an absoulte genius. thank you very much for this video : )

  • @dom901
    @dom901 3 місяці тому +1

    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  3 місяці тому +1

      Thanks! Yes, you can implement these same principles in the header.

  • @summer8334
    @summer8334 5 місяців тому +1

    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  5 місяців тому +1

      Thanks for watching! Through the settings/layou panel of the strip you can add more columns and adjust their sizes.

  • @andrewfraser5535
    @andrewfraser5535 5 місяців тому +1

    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  5 місяців тому +1

      The columns will expand but the elements inside will remain the same. (Classic Editor)

    • @andrewfraser5535
      @andrewfraser5535 5 місяців тому +1

      Thank you.

  • @langhavalley
    @langhavalley 8 місяців тому

    Thank you pal! You saved my website. ❤

  • @leahollsson129
    @leahollsson129 8 місяців тому

    Thank you so much for this!! It was driving me insane.

  • @BharatDhungana-pk2un
    @BharatDhungana-pk2un 3 місяці тому +1

    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  3 місяці тому +2

      Thanks! Buying a premium plan will have no effect on the design (except for removing the ads).

  • @mcs9451
    @mcs9451 Рік тому

    This is exactly what I needed. Thanks, very helpful.

  • @lestermcmillan9038
    @lestermcmillan9038 Рік тому +2

    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  Рік тому +1

      Have you tried the new Wix Studio?

  • @TheHunterzofOz
    @TheHunterzofOz 4 місяці тому

    THANKYOU SO MUCH!! I was dying!

  • @ceskymarketing
    @ceskymarketing 5 місяців тому +1

    👍 Thanks for watching!

  • @BeRichinlife
    @BeRichinlife 7 місяців тому

    Bro you came in clutch!

  • @bobbydale8061
    @bobbydale8061 5 місяців тому

    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?

  • @thisha36
    @thisha36 9 місяців тому

    thank you so much that’s really helpful

  • @magedmohammed8674
    @magedmohammed8674 10 місяців тому +1

    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  10 місяців тому +1

      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!

  • @kambriacookofficial
    @kambriacookofficial 10 місяців тому

    This was very helpful. Thank you!

  • @vboy-youtube
    @vboy-youtube 10 місяців тому

    really good suggestion! Thanks a ton :)

  • @devilviso
    @devilviso Рік тому

    Really Really Thank you for this Great solution

  • @blueblue-tm9uk
    @blueblue-tm9uk 10 місяців тому

    so useful, thanks!

  • @roseyred1010
    @roseyred1010 11 місяців тому

    THANK you!

  • @wearecoldblood
    @wearecoldblood 6 місяців тому +1

    What about the length?? I am struggling with it to look same at different screen sizes

    • @thewixwiz
      @thewixwiz  6 місяців тому +1

      Very legitimate question - unfortunately not possible to adjust height based on screen size in the Classic Editor...

    • @wearecoldblood
      @wearecoldblood 6 місяців тому +1

      THEN WHICH EDITOR?@@thewixwiz

  • @melissagoh7884
    @melissagoh7884 Рік тому

    Thanks, very helpful👍

  • @egggy69420
    @egggy69420 Рік тому

    I love you bro ❤ thank you so much

  • @ChillBuddies
    @ChillBuddies Рік тому

    great vid!

  • @Mini_Arj
    @Mini_Arj Рік тому +3

    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  Рік тому +1

      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!

  • @netarichie
    @netarichie Рік тому +2

    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  Рік тому +1

      From the column settings you can decide the placement. Center, right or left.

    • @xb2856
      @xb2856 7 місяців тому +1

      @@thewixwiz You can explain where this setting is? I do not have any options for this in column management

  • @iamcatholic_
    @iamcatholic_ Рік тому

    Thanks!

  • @MrKhaled247
    @MrKhaled247 Рік тому

    Thank you

  • @earlypurplestudio
    @earlypurplestudio Рік тому +2

    is there a way to make text scale in WIX? or to make a small enough desktop screen force to mobile view/layout?

  • @tiffsterritoryonyoutube
    @tiffsterritoryonyoutube Рік тому

    Helpful, thanks

  • @vinnycarvalho8561
    @vinnycarvalho8561 Рік тому

    Great vid

  • @jackobrien4638
    @jackobrien4638 Рік тому

    Thanks bruv!

  • @SergeyRaevsky
    @SergeyRaevsky Рік тому

    Thanks a lot

  • @StaticX73
    @StaticX73 4 місяці тому

    Can you make a tutorial in how to create a loading page?

    • @thewixwiz
      @thewixwiz  4 місяці тому

      Thanks for the suggestion!

  • @El.cattivo
    @El.cattivo 7 днів тому

    When I edit on mobile it screw up my pc wersion. How to fix that?

    • @thewixwiz
      @thewixwiz  6 днів тому

      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.

  • @Nike3.00
    @Nike3.00 4 місяці тому

    Can you show us how to do this but on a widescreen and a phone?

    • @thewixwiz
      @thewixwiz  4 місяці тому

      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.

  • @resone3645
    @resone3645 Рік тому +1

    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

  • @huynhuctrung3451
    @huynhuctrung3451 Рік тому

    TY ❤❤

  • @iRGORoofing
    @iRGORoofing 6 місяців тому

    hello this is great how about when it shows for the phone? it shows there is a huge gap

    • @thewixwiz
      @thewixwiz  6 місяців тому

      You should be able to adjust that in the mobile editor!

    • @iRGORoofing
      @iRGORoofing 6 місяців тому

      @@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!!

  • @thejwb1
    @thejwb1 Рік тому +1

    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.

  • @dreamlandchannell
    @dreamlandchannell 5 місяців тому

    god bless you >3

  • @popaandrei3257
    @popaandrei3257 3 місяці тому

    Very useful. Thank you!🫡

  • @alessandrogibogini3526
    @alessandrogibogini3526 7 місяців тому

    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  7 місяців тому +1

      Thanks for watching! You can check if the element you are using has a stretch property.

    • @alessandrogibogini3526
      @alessandrogibogini3526 7 місяців тому +1

      @@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).

  • @aloy5413
    @aloy5413 11 місяців тому

    is there other ways where we can just adjust it via code at the html editor?

    • @thewixwiz
      @thewixwiz  11 місяців тому

      No... Wix doesn't allow direct access to the DOM

  • @bhavesh516
    @bhavesh516 Рік тому +1

    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

  • @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  Рік тому +1

      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?

  • @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: ua-cam.com/video/rXtoeZygJbY/v-deo.html

  • @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!

  • @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!

  • @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  11 місяців тому

      This is something I would reach out to Wix support about

  • @kallinikos100
    @kallinikos100 Рік тому

    How about on Editor X?

    • @thewixwiz
      @thewixwiz  Рік тому

      Here you go:
      ua-cam.com/video/sYNThLzRu_4/v-deo.html

  • @bhavesh516
    @bhavesh516 Рік тому +1

    Hey

  • @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.

  • @ShantesTravelThings
    @ShantesTravelThings Рік тому +1

    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

  • @Dthedutch4
    @Dthedutch4 10 місяців тому

    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  10 місяців тому

      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?

  • @FangsofYima
    @FangsofYima 9 місяців тому

    Can I just say, I hate tablets.

  • @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!

  • @EmpireEcho
    @EmpireEcho 10 місяців тому

    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  10 місяців тому

      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.