How to Make DIY Updates to Your Wix Studio Website With Content Mode

Content Mode is an easy to use editing mode for your Wix Website designed with Wix Studio, that let's you make your own updates to your text, images, and links, without effecting your websites design, layout, or mobile responsiveness.

This guide will help you navigate the capabilities of Content Mode which can be accessed directly from your Wix Dashboard.

Table of Contents

Wix Studios Content Mode vs Full Editing Mode

If your site was designed with The Libby Link, Your site permissions will give you access to two different editing modes for your website, Full Mode, and Content Mode.

Content Mode

Content Mode was designed specifically to make basic website updates accessible and stress free for the average Coach, Photographer, Designer, Artist, Creative, and Service Provider.

With Content Mode, you can update your websites text, images, and links (as well as make some basic changes to your app page designs) on your own, without needing to engage and pay for the services of a professional.

Changes made in Content Mode (provided your website was designed by a Wix Studio Partner like The Libby Link) will not effect your websites layout, overall design, or mobile responsiveness, so you can keep your content fresh knowing your site will retain its aesthetic and professional appeal across all device types.

Full Editing Mode

Full Mode, whilst giving complete control over all design elements, should be avoided by those inexperienced with responsive web design, CSS, and the Wix Studio platform for designers and agencies.

*For more on the comparison between Wix and Wix Studio, see this post explaining the difference and why a Wix Studio website is the best option for a premium, high end site.

You should avoid Full Editing Mode unless you are experienced Web Designer familiar with responsive web design and the Wix Studio platform. Even minor changes made in Full Mode can have drastic effects on your websites architecture and mobile responsiveness.

How to Navigate Content Mode with Wix Studio

From the left hand menu on your Wix Dashboard. select the Home tab.

Select Select Edit Site, then Content Mode from the top right of the page. 

The Content Mode editor will open on a new page where you can access the following tools from the top navigation banner.

• Left hand logo to go to your Dashboard.

• Page selector to switch between different pages of your site.

• Canvas size & breakpoints to adjust the screen size that displays whilst editing and to review different breakpoints like desktop, tablet and mobile.

• Undo & redo buttons to move back and forth between changes you've made to your site.

• Edit content panel which can be toggled on and off to collapse or expand the Edit Content panel.

• Site preview to preview your changes before you publish your site.

• Publish button: to send your changes and updated site live.

How to Use Content Mode to Update Your Websites Text, Images, and Links

From inside Content Mode, select the page section you want to update then toggle the Edit Content panel on.

Prefer a live walkthrough? You can watch the video tutorial here.

*Sections will highlight with a blue border when selected.

Editing Site Text

From inside the Edit Content panel, select the text element you want to update.

The text editor for that element will expand where you can update your text and it's formatting including:

• Updating the written copy for headings, subheadings, or paragraphs

• Adding bold, italics, and underline.

• Linking a portion of text to another page, a document, or an external webpage.

• Changing the text alignment

• Adding a numbered or bulleted list

• Changing the direction of text

Click to expand images

*Fonts and text sizes have been configured during your site design and cannot be overridden in Content Mode.

Editing Site Images

From inside the Edit Content panel, select Change next to the image you want to update

The Image Selector will expand where you can select from the following to replace the existing image:

• Upload new media from your device or import from another program.

• Select an image from your existing site files.

• Select an image from the Wix, Unsplash, and Shutterstock image libraries.

Click to expand images

From inside the Edit Content panel, select the Settings Icon next to the image you have just replaced.

The Image Settings will expand where you can adjust the following

• Adjust to add filters to your image, add cropping, and other design adjustments

• Reset image to revert the image back to its original state before any changes were made

• Display mode to change how the image sits inside its bounding box

• Add a link to the image that opens on click

• Update the images Alt Text (see how to optimise your site images for SEO for more info).

Editing Site Buttons and Links

From inside the Edit Content panel, select the button or link you want to update to edit the button or link text that displays on your site.

From inside the Edit Content panel, select the Settings Icon next to the button or link you want to update to edit the link or button settings.

The Link Settings will expand where you can adjust the link settings and select the Link Icon to change where the button or link directs to including:

• Unlink the element.

• Link the element to another page on your site.

• Link the element to a document that you can then upload to your site.

• Link the element to another web address.

• Link the element to an email address or phone number.

• Link the element to another element on your site.

Click to expand images

Editing Section Backgrounds

From inside the Edit Content panel, select Change next to the Section Background you want to update.

The Section Background settings will expand where you can :

• Change the backgrounds colour and opacity.

• Add background or pattern overlays.

• Add media to your section background

  
  

If you are selecting to add or update media, The Image Selector will expand where you can select from the following to add or replace the existing background image:

• Upload new media from your device or import from another program.

• Select an image or video from your existing site files.

• Select an image or video from the Wix, Unsplash, and Shutterstock image libraries.

Click to expand images

How to to Optimise Your Updated Website Images for SEO

Optimal Image Formats and File Sizes

Images can impact your sites loading time if they are not optimised which could in turn impact your ranking on Search Engines like Google.

Wix automatically optimises images for best online quality and fast download, so you don't need to resize or compress images under 25MB before uploading them. For images that are larger than 25MB, it's best to resize or compress them as required.

*Accepted image formats for general site images: AVIF, PNG, or JPEG.

Adding Image Alt Text to Updated Images

Alt text is a short written description attached to the images on your website. It's not visible on your site, but it helps your images show up in search results by helping search engines like Google understand the content of the image so they have a better idea of what search terms your site relates to.

Alt text also enhances your accessibility as screen readers use it to provide meaningful descriptions of your images to visually impaired persons who visit your website.

Your alt text should paint a detailed mental picture of the scene whilst naturally including SEO keywords.

Think: 'A smiling business coach with shoulder-length blonde hair, wearing a relaxed pink blazer, sits at a desk with a laptop open, ready to help clients' over 'photo of a woman on laptop'.

From inside the Edit Content panel in Content Mode, select the Settings Icon next to the image you have replaced.

The Image Settings will expand where you can add your alt text.

How to Use Content Mode to Update Dynamic Content and CMS Collections

From inside the Edit Content panel, select the Pencil Icon next to the content you want to update.

The Content Management System collection will open in a new window where you can update your existing entries or select + New Item to add additional items to the collection.

Prefer a live walkthrough? You can watch the video tutorial here.

Click to expand images

How to Update the Display Settings on Your Wix App Pages

Navigate to the relevant apps site page using the top navigation bar.

From inside the Edit Content panel, select Settings.

From inside Content Mode, select the app page you want to update from the top navigation bar then toggle the Edit Content panel on.

The display settings for that app will expand where you can configure the display settings from the left of the screen.

Options for Advanced Design Edits

Website Updates Done For You

To enquire about done for you website updates for a site designed with Wix Studio, please contact me for more information on a Design Day (limited half and full days are available).

Upskilling with The Wix Studio Academy

Prefer to do it all yourself? I recommend exploring the education available via the Wix Studio Academy to expand your responsive web design knowledge and explore the advanced customisation options available with Wix Studios Full Edit Mode.

---

Need more information on managing your Wix Website and it's applications? See the related posts below or visit the Wix Help Centre.

Are you a coach or creative looking to take your business to the next level with premium strategic web design? Enquire here for next available spots.