Marina Lotaif
- Jun 28, 2022
- 8 min read

Wix Mobile Editor: Top Wix Mobile Editor Features To Make Your Website Look Totally Professional

Wondering how to use Wix mobile editor? In this Wix website tutorial, you'll learn how to do Wix responsive Wix design using the Wix editor mobile to customize your Wix mobile website. So let's get right into this Wix tutorial on Wix basics on how to make a website with the Wix mobile view using the new Wix editor.

First off, if you don't have a Wix account yet, just click on the link in the description box below to sign up for free. Once you've logged in to your Wix account, locate the website you wish to use the Wix mobile editor on, hover your mouse over it, and then click on the pencil icon to access the Wix editor.

The Wix editor defaults to the desktop editor. In order to access the Wix editor mobile, click on the mobile device on the panel up top to switch to mobile and edit your site for mobile. You can always toggle between the Wix mobile editor and Wix desktop editor from this white panel up top.

If this is your first time using the Wix mobile editor, you'll be prompted with a few questions to set it up. For more details on those questions and what to do when accessing the Wix editor mobile for the first time, make sure to watch my video on 'Wix Mobile Optimization Using The Wix Mobile View'. I'll leave the link to it in the description box below.

Just like with the desktop Wix editor, you can click on any element within the Wix editor mobile to edit it from its individual toolbar. For instance, if you click on this piece of text, you can increase its size by 1 pixel, decrease its size by 1 pixel, click on settings to change the font size, color, enable vertical text or not, and change the alignment, add an animation, hide the element or access help.

You can also click on any section at large, such as on the header or on a page section, and use the options that appear on the right to move that page section up, move that page section down or hide that section.

The Wix editor mobile even suggests proper sizes for your Wix website's header and footer for best results. Another exclusive feature of the mobile editor is the quick action bar. If you click on it, you can then click on 'set up quick actions' to select the elements that should appear within the quick action bar, such as phone, email and Facebook.

You can click and drag on the left-hand side of any existing element to reorder it, or click on the three little dots on the right-hand side of an element to set it up, rename it or remove it. When you click on 'set up', you'll be able to add additional settings for that specific element.

If you wish to add even more elements to your quick action bar, click on 'more actions' at the bottom, and then add a custom action, phone, email, WhatsApp, address, contact form, Facebook, Flickr, Google business profile, Instagram, LinkedIn, Pinterest, TikTok, Twitter, Vimeo, VK, Yelp, YouTube or Line.

Under 'settings' from the quick action bar's individual toolbar, you can select whether you wish to show labels (no or yes).

Under 'layout', you can select which side the quick action bar is on (left or right).

Under 'design', you can discover more action bars, and then click on 'customize design' at the bottom to edit the quick action bar's fill color and opacity, border and shadow when open, and fill color and opacity, border and shadow when closed. You can access these same settings under 'customize design'.

Under 'help' from the quick action bar's individual toolbar, you can learn more Wix editor mobile tips and tricks on how to edit the quick action bar.

Just like with the desktop Wix editor, you can use the left-hand side panel to access additional Wix mobile editor options. Under 'add to mobile', you can add text, an image, button, decorative, box, social or embed to your Wix mobile site. Those elements that you add to your Wix mobile site won't be added to the desktop version.

Under 'menus and pages', you can access your site menu, as well as other page options on your Wix website, such as member pages, store pages, bookings pages, blog pages and lightboxes. Within the site menu, you can click on the three little dots next to any page to access the mobile settings for that page, and select whether the page should have a standard layout or no header and footer layout, and to hide that page on mobile.

Under 'background', you can edit the mobile background to a color, image or video, or select one of the Wix editor mobile's stunning image and video backgrounds, perfect for any page. You can even choose to apply that mobile background to all pages on your mobile site if you so wish.

Under 'mobile tools', you can access tools available just within the Wix editor mobile. These include the quick action bar, which we already covered, as well as a back to top button to get visitors to the top of your site in a click, a welcome screen to introduce your brand in a stunning welcome screen, and browser theme color where you can choose a mobile browser color that matches your site.

Let's cover each one of these Wix editor mobile tools individually. Let's first click on 'add to site' next to the 'back to top button'. From the back to top button's individual toolbar, you can click on 'change icon' to select another icon for that button, and then click on 'customize design' at the bottom to edit the button design's fill colors and shadows. You can access these same settings under 'design'.

Under 'animated', you can select an animation to add to your back to top button, and then click on 'customize' at the bottom to change that animation's duration. Under 'help', you can learn more about what you can do with the back to top button, including how to change the button icon, upload your own button, change the position of your button, and change the size of your button.

Let's x out of these back to top button settings, click on 'mobile tools' from the left-hand side panel, and then click on 'add to site' next to 'welcome screen'. From here, you can click on the play button to see your welcome screen in action.

You can also upload your logo as either an image or vector art to increase your brand awareness, choose your logo animation (none, bounce in, fade in, float in, expand in, spin in, fly in or blur in), select the direction (from left, from right, from top or from bottom), choose the background color, select the background animation (none, slide in, fade in or expand in), as well as its direction (from left, from right, from top or from bottom).

Once you're done setting the welcome screen design settings, click on 'done' at the bottom. Lastly, let's click on 'mobile tools' from the left-hand side panel, and then click on 'add to site' next to 'browser theme color'. All you have to do is click on the color picker to choose a color, and then click on 'done' at the bottom.

Under 'hidden on mobile' from the left-hand side panel, you'll be able to locate all of the elements that are visible on your Wix desktop website that you hid from your Wix mobile website. If for some reason you can't find an element, you can view and organize any element on a page from the layers panel.

The layers panel is this option at the bottom of the left-hand side panel. From here, you can click on any element within the header, page and footer to locate it, and then edit it from its individual toolbar.

Under 'page layout optimizer' from the left-hand side panel, you can click on 'optimize now' to optimize and update the mobile layout of this page. Once you're done using the Wix editor mobile, make sure to click on 'save' and then on 'publish' on the top, right-hand side to make your changes active.

If you're serious about using the Wix mobile editor, make sure to sign up for a free Wix account by clicking on the link in the description box below, check out our Wix tutorials playlist for even more Wix tips and tricks, as well as our FREE Complete Website Creation Guide below this video to learn more about how to create your own website step-by-step without stress or overwhelm.

Leave a comment below and let me know if you'll be creating a responsive Wix site using the Wix editor mobile. If you liked this video, make sure you give it a thumbs up and subscribe to my channel so that you can navigate the tech side of online business with ease, and stay tuned for our next video which is about how to make money with Wix. As you wait for my next video to go live, check out these two videos I have right here, and I'll see you in my next video.

WIX EDITOR MOBILE: How To Use Wix Mobile Editor. Wondering how to use Wix mobile editor? In this Wix website tutorial, you'll learn how to do Wix responsive Wix design using the Wix editor mobile to customize your Wix mobile website. If you want to do Wix website design with a Wix designer or Wix web designer, this Wix editor tutorial and Wix training is for you. So let's get right into this Wix tutorial on Wix basics on how to make a website with the Wix mobile view using the new Wix editor. Get excited to Wix my website with web design tips.

SUBSCRIBE FOR NEW VIDEOS EVERY TUESDAY & THURSDAY: http://bit.ly/youtubeyestotech

RESOURCES MENTIONED:

○ FREE Complete Website Creation Guide: https://www.yestotech.com/complete-website-creation-guide

○ Try Wix For FREE: http://bit.ly/wixforfree

○ Wix Mobile Optimization Using The Wix Mobile View: https://youtu.be/ECtFqZs_nNs

○ Wix Tutorials Playlist: https://www.youtube.com/watch?v=1BBbnbmCPEg&list=PLbLPqE_rHXqvDRl3aCifnia27BYFqpYgR

○ Read The Post: https://www.yestotech.com/post/wix-editor-mobile-how-to-use-wix-mobile-editor

CLICK TO TWEET: https://ctt.ac/x0yF4

Yes To Tech

Wix Mobile Editor: Top Wix Mobile Editor Features To Make Your Website Look Totally Professional

Recent Posts