{"id":5626,"date":"2020-09-14T07:23:30","date_gmt":"2020-09-14T07:23:30","guid":{"rendered":"https:\/\/colibriwp.com\/blog\/?p=5626"},"modified":"2021-11-15T10:13:36","modified_gmt":"2021-11-15T10:13:36","slug":"wix-vs-wordpress-builders","status":"publish","type":"post","link":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/","title":{"rendered":"Wix vs WordPress Builders: How I Created the Same Web Page in Both Tools"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Or at least I tried\u2026<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Wix vs WordPress, place your bets!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">True story: I wanted to play with the free versions of the Wix website builder and a WordPress builder and see the end results. I picked Colibri for the task because it lets users build everything in a single interface.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The hypothesis: creating the same portfolio page of a photography website (not intended to be pixel perfect).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Let\u2019s see how things turned out in the Wix vs <a href=\"https:\/\/colibriwp.com\/blog\/how-to-build-a-wordpress-website-in-2021\/\">WordPress builders<\/a> battle.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><span style=\"font-weight: 400;\">Template choosing &#8211; Colibri<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">This is how you can browse through Colibri\u2019s templates:<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5631\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/choose-WordPress-theme.png\" alt=\"choose WordPress theme\" width=\"700\" height=\"401\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Not a hard one this one, only one photography template to play with.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5629\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/choose-Colibri-template.png\" alt=\"choose Colibri WordPress template\" width=\"700\" height=\"507\" \/><\/p>\n<h2><span style=\"font-weight: 400;\">Template choosing &#8211; Wix<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">Wix scores a point here, there are tons of templates to choose from.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">I didn\u2019t want to make my life hard, so I picked out a theme with a masonry grid, to resemble the one from the Colibri template.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5642\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/pick-wix-template.png\" alt=\"pick wix template\" width=\"700\" height=\"284\" \/><\/p>\n<h2><span style=\"font-weight: 400;\">Wix vs WordPress builders (Colibri): the setup<\/span><\/h2>\n<p><span style=\"font-weight: 400;\">For Colibri, the left-hand side menu is the \u201cmother of all features\u201d.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Its structure goes as follows:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Header<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Content<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Footer<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">General Settings &#8211; here you can state the global color scheme and typography for the site, so that you don\u2019t need to take every element one by one and alter it, just the ones that need a different styling.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Menu<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Widgets<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Security<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Performance<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400;\">When you select a specific website element, in the right, the left-hand side menu will have the following items: Content, Style, and Advanced. Under advanced you have two states: normal and hover.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The submenu for \u201cAdvanced\u201d is the same for every component. Once you get the hang of this menu, you\u2019ll master many WordPress builders.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The left-hand size Wix menu serves a different purpose, mostly for adding new components.<\/span><\/p>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/bLuRJPkg\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/bLuRJPkg\/Screen%20Recording%202020-08-06%20at%2006.38.12.57%20PM.gif\" alt=\"Screen Recording 2020-08-06 at 06.38.12.57 PM\" width=\"360\" height=\"356\" \/><\/a><\/div>\n<p><span style=\"font-weight: 400;\">What\u2019s nice in Wix is the fact that you can edit each component while clicking on it. In the Colibri WordPress builder, you always need to work with the menu on the left-hand side.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">On the other hand, I couldn\u2019t find how I can alter in Wix the global color and typography schemes.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Typography &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">I\u2019m naming my website LemonBlues. This is a combo stuck in my mind for years&#8230;I feel that it could be the name for a jazz band, don\u2019t you think? But it would also do the trick for a photography website.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The builder allows me to play with tons of fonts (more than the ones available in Wix), colors, animations, spacing&#8230;<\/span><\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-5632 aligncenter\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/copy-style-in-WordPress.png\" alt=\"copy style in WordPress\" width=\"351\" height=\"331\" \/><br \/>\n<span style=\"font-weight: 400;\">Copy style, that\u2019s a cool one! This copy-paste applies to columns as well, and any other components that need to be styled.\u00a0<\/span><span style=\"font-weight: 400;\">I dug a bit and found the same feature in Wix.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Now, the thing I really really love is how Colibri deals with font sizes, we\u2019ve got px, em, and rem. If you\u2019re not familiar with these notions, <\/span><a href=\"https:\/\/medium.com\/code-better\/css-units-for-font-size-px-em-rem-79f7e592bb97\"><span style=\"font-weight: 400;\">here<\/span><\/a><span style=\"font-weight: 400;\">\u2019s a good article on them.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Typography &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">For the brand name, I used the same font type, size, and color as for the Colibri built website.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5645\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/text-settings-in-Wix.png\" alt=\"text settings in Wix\" width=\"550\" height=\"443\" \/><\/p>\n<p><span style=\"font-weight: 400;\">This is a \u201cnice to have\u201d: Get Text Ideas.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5635\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/get-text-ideas-in-Wix.png\" alt=\"get text ideas in Wix\" width=\"600\" height=\"344\" \/><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5646\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/typography-in-Wix.png\" alt=\"typography in Wix\" width=\"500\" height=\"452\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Wix has an extra touch here, with these very basic SEO settings.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5644\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/SEO-features.png\" alt=\"SEO features in wix\" width=\"400\" height=\"393\" \/><span style=\"font-weight: 400;\">In Colibri, for the SEO aspects, I totally recommend the Yoast SEO or Rank Math plugins. I think this is one of WordPress\u2019 superpowers. These plugins can supercharge everything on a website.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Layouts and grids &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">In the builder, I could control the columns, rows, their width and height.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5638 size-full\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/layout-structure-in-WordPress.png\" alt=\"layout structure in WordPress\" width=\"341\" height=\"474\" \/><\/p>\n<p><span style=\"font-weight: 400;\">And the thing I really like is this \u201cunlink\u201d or \u201clink\u201d feature.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">When an element shows up as \u201clinked\u201d it means that all the elements that share the same style benefit from any change. Let\u2019s say you want to change the opacity of a text box, and the text box appears in 5 places, it will change all 5 boxes!\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In my particular case, it spared me the trouble of changing 11 text boxes with their own opacity and font specs.\u00a0<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5639\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/linked-styles.png\" alt=\"linked styles\" width=\"500\" height=\"416\" \/><\/p>\n<h3><span style=\"font-weight: 400;\">Layouts and grids &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">In Wix, you can drag components, pull their margins to the left, right, make them taller or shorter. Nice one!<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5634\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/enlarge-Wix-components.png\" alt=\"drag Wix components\" width=\"500\" height=\"404\" \/><span style=\"font-weight: 400;\">In both products, you can play with borders, opacity, size, animations.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">What I couldn\u2019t figure out is how to group certain elements. And that meant trouble for me when I wanted to make the web page responsive&#8230;.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5650\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/wix-issues-with-grouping-content.png\" alt=\"wix issues with grouping content\" width=\"600\" height=\"229\" \/><\/p>\n<h3><span style=\"font-weight: 400;\">Dealing with images &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">When you import images in Colibri you can provide the image with an Alt attribute (useful in SEO) and also gives you the possibility to crop the image.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">If you want to alter the image in terms of border, spacing, effects, there\u2019s always the left-hand side menu, the \u201cadvanced\u201d section.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Under the style section, there\u2019s a feature that allows you to change the focus of the picture. I found this really helpful to center certain parts of the image. This also comes in handy on mobile devices.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5630\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/choose-focus-in-picture.png\" alt=\"choose focus in picture\" width=\"450\" height=\"480\" \/><\/p>\n<h3><span style=\"font-weight: 400;\">Dealing with images &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">In Wix, you can import images from various sources (own computer, Google Drive, Dropbox, Facebook, and more).<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5633\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/drag-and-drop-files-in-Wix.png\" alt=\"drag and drop files in Wix\" width=\"500\" height=\"419\" \/><\/p>\n<p><span style=\"font-weight: 400;\">They also have a basic photo editor:<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5636\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/image-enhancing-in-wix.png\" alt=\"image enhancing in wix\" width=\"500\" height=\"236\" \/><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">In my particular project, the masonry grid got me in some trouble.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">I found it difficult to arrange some pictures. After arranging them I wanted to make some images switch&#8230;From that moment on it was really difficult to go back to the previous state (without undo). The positioning of the images (as in first, second\u2026) seems to be based on how high it positions itself on the website. This was tricky. <\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5637\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/images-positioning-in-Wix-gallery.png\" alt=\"images positioning in Wix gallery\" width=\"600\" height=\"513\" \/><br \/>\n<img loading=\"lazy\" class=\"aligncenter wp-image-5649\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/Wix-gallery-issues.png\" alt=\"Wix gallery issues\" width=\"600\" height=\"285\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Also, it wasn\u2019t obvious how to change the dimensions of the images&#8230;I wanted to enlarge the landscape ones.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Menu &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">I wanted to align the <a href=\"https:\/\/colibriwp.com\/blog\/wordpress-menus\/\">menu<\/a> for the Colibri built website with the one in Wix and get from<\/span><\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-5640 aligncenter\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/menu.png\" alt=\"menu \" width=\"1120\" height=\"89\" \/><\/p>\n<p><span style=\"font-weight: 400;\">to<\/span><\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-5647 aligncenter\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/website-menu.png\" alt=\"website menu\" width=\"611\" height=\"72\" \/><\/p>\n<p><span style=\"font-weight: 400;\">but keep the \u201cHire me\u201d button.<\/span><\/p>\n<p>This was an easy task. All I had was to organize my pages.<\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5655\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/working-with-wordpress-menus.png\" alt=\"working with wordpress menus\" width=\"250\" height=\"539\" \/><\/p>\n<h3><span style=\"font-weight: 400;\">Menu: Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">All crystal clear here, I just added a button with a \u201cHire me\u201d text on it.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"size-full wp-image-5628 aligncenter\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/adding-new-menu-in-Wix.png\" alt=\"adding new menu items in Wix\" width=\"481\" height=\"622\" \/><\/p>\n<p><span style=\"font-weight: 400;\">The feature is similar in both tools.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Other components &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">If the theme you\u2019re working on does not quite fit your vision, you can always adapt and add new components or blocks.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The blocks are already-made sections that can be added (testimonials, galleries, headers, about us page\u2026).<\/span><\/p>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/DOuxGrZo\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/DOuxGrZo\/Screen%20Recording%202020-08-07%20at%2002.33.42.63%20PM.gif\" alt=\"Screen Recording 2020-08-07 at 02.33.42.63 PM\" width=\"608\" height=\"504\" \/><\/a><\/div>\n<p><span style=\"font-weight: 400;\">The components are tiny items such as headings, images, texts, videos, buttons, icons&#8230;you get the point.\u00a0<\/span><span style=\"font-weight: 400;\">You just drag and drop the content and style them as you wish.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5652\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/WordPress-pre-designed-blocks.png\" alt=\"WordPress pre-designed blocks\" width=\"450\" height=\"483\" \/><\/p>\n<p><span style=\"font-weight: 400;\">A really cool feature is the one that allows you to save certain sections for later usage.<\/span><\/p>\n<h3><img loading=\"lazy\" class=\"aligncenter wp-image-5643\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/reusable-blocks-in-WordPress-builder.png\" alt=\"reusable blocks in WordPress builder\" width=\"500\" height=\"297\" \/><br \/>\n<span style=\"font-weight: 400;\">Other components &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">In Wix, you can also add various components.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">They have something similar to the blocks in the WordPress builder, called \u201cStrip\u201d.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5627\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/add-a-strip-in-wix.png\" alt=\"add a strip in wix\" width=\"500\" height=\"569\" \/><\/p>\n<h3><span style=\"font-weight: 400;\">Contact forms &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">At the end of the image gallery, I added a contact form so that people can get in touch.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">I found the form inside the \u201cAdd component\u201d.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5654\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/working-with-forms.png\" alt=\"working with forms in WordPress\" width=\"450\" height=\"410\" \/><\/p>\n<p><span style=\"font-weight: 400;\">In the advanced settings, I changed the styling of the fields and the \u201cSend\u201d button, and also adjusted the padding.<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">Contact forms &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">In Wix, I selected a contact form template and adjusted it to have the fields in a single column.<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5648\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/wix-contact-forms.png\" alt=\"wix contact forms\" width=\"610\" height=\"487\" \/><\/p>\n<p><span style=\"font-weight: 400;\">No trouble here.<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">Mobile responsiveness &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">That worked out well\u2026<\/span><\/p>\n<p><span style=\"font-weight: 400;\">For tablets and iPads I only had to adjust the number of items in a row, refocus some images, and fix some padding issues for the contact form. Et voila!<\/span><\/p>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/jkuZyOxe\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/jkuZyOxe\/Screen%20Recording%202020-08-07%20at%2003.26.10.11%20PM.gif\" alt=\"Screen Recording 2020-08-07 at 03.26.10.11 PM\" width=\"744\" height=\"544\" \/><\/a><\/div>\n<p><span style=\"font-weight: 400;\">For mobile devices, I switched to a one-column view.<\/span><\/p>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/12uJE7KJ\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/12uJE7KJ\/Screen%20Recording%202020-08-07%20at%2003.42.15.81%20PM.gif\" alt=\"Screen Recording 2020-08-07 at 03.42.15.81 PM\" width=\"456\" height=\"696\" \/><\/a><\/div>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">\u00a0<\/span><\/p>\n<h3><span style=\"font-weight: 400;\">Mobile responsiveness &#8211; Wix<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">Ok&#8230;.this didn\u2019t turn out very well.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The problem came from the fact that I couldn\u2019t group some text boxes and their background images as I mentioned earlier.<\/span><\/p>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/9ZuXWKlr\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/9ZuXWKlr\/Screen%20Recording%202020-08-07%20at%2003.29.53.49%20PM.gif\" alt=\"Screen Recording 2020-08-07 at 03.29.53.49 PM\" width=\"378\" height=\"662\" \/><\/a><\/div>\n<p><span style=\"font-weight: 400;\">I felt like Sisif&#8230;and gave up. It was too much moving every text box, and adjusting each text (it needed smaller fonts).<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Custom CSS &#8211; Colibri<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">For the picky ones: in Colibri, you can add your own CSS, assign classes to specific elements, and work with ids (for those more CSS-savvy).<\/span><\/p>\n<p><img loading=\"lazy\" class=\"aligncenter wp-image-5651\" src=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/WodPress-builder-add-CSS.png\" alt=\"WodPress builder add CSS\" width=\"250\" height=\"528\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Didn\u2019t manage to find the same feature in Wix&#8230;<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><span style=\"font-weight: 400;\">Plugins, the app market<\/span><\/h3>\n<p><span style=\"font-weight: 400;\">When you want to go beyond the functionalities provided by WordPress or Wix, you will need to insert some third-party apps.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In WordPress, there are thousands of such apps, called plugins.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You wanna boost your website performance, there\u2019s a plugin for that.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Wanna optimize the images across all your websites, there\u2019s a plugin for that.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Social media, forms, analytics, security, blogging features, marketing&#8230;you name it, there\u2019s a plugin for everything. Some of them are free, some paid.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">The Colibri WordPress builder integrates seamlessly with some of<\/span><a href=\"https:\/\/premium.wpmudev.org\/projects\/category\/plugins\/\"><span style=\"font-weight: 400;\"> WPmu\u2019s most popular plugins<\/span><\/a><span style=\"font-weight: 400;\">: Forminator (contact form plugin), Defender, Hummingbird, and Smush (optimization, security, and performance tools), or Hustle (marketing tools).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In Wix, you\u2019ve got the Apps Marketplace, which has less than 300 apps available.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><span style=\"font-weight: 400;\">The end result: Colibri WordPress website<\/span><\/h2>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/7KuL2n26\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/7KuL2n26\/Screen%20Recording%202020-08-06%20at%2004.35.45.22%20PM.gif\" alt=\"Screen Recording 2020-08-06 at 04.35.45.22 PM\" width=\"1280\" height=\"672\" \/><\/a><\/div>\n<p>&nbsp;<\/p>\n<h2><span style=\"font-weight: 400;\">The end result: Wix website<\/span><\/h2>\n<div class='embed-container'><a href=\"https:\/\/share.getcloudapp.com\/WnuJw89b\"><img loading=\"lazy\" src=\"https:\/\/p221.p4.n0.cdn.getcloudapp.com\/items\/WnuJw89b\/Screen%20Recording%202020-08-06%20at%2005.11.17.99%20PM.gif\" alt=\"Screen Recording 2020-08-06 at 05.11.17.99 PM\" width=\"1510\" height=\"622\" \/><\/a><\/div>\n<h2><span style=\"font-weight: 400;\">Wix vs WordPress Builders (Colibri): Pros and Cons<\/span><\/h2>\n<p>&nbsp;<\/p>\n<table>\n<tbody>\n<tr>\n<td><strong>Colibri cons<\/strong><\/td>\n<td><strong>Wix cons<\/strong><\/td>\n<\/tr>\n<tr>\n<td>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Can\u2019t change the width, height of an element by dragging it.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">You need to take care of the website security and maintenance (there are plugins for that).<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Almost impossible to get inside the code and make adjustments.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Below 300 apps to use<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">E-commerce functionalities are still in the \u201ccocoon\u201d mode<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">What\u2019s built in Wix, stays in Wix: \u201cYour Wix site and all of its content is hosted exclusively on Wix\u2019s servers, and cannot be transferred elsewhere.\u201d<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Mobile responsiveness can be tricky.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Not a good fit for complex websites<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td><strong>Colibri pros<\/strong><\/td>\n<td><strong>Wix pros<\/strong><\/td>\n<\/tr>\n<tr>\n<td>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Thousands of plugins and integrations available.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">No code limitations, a developer can mess around easily and make custom changes<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Great e-commerce functionality.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Data ownership: you can easily move your WordPress built website to another website builder, or download it.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">It deals better with the mobile responsiveness<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Huge WordPress community and resources at your disposal to fix anything you want.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Fit for both beginner and complex projects.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Blocks can be saved and used in future designs<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Good native blogging features<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Integration with WPmu\u2019s most popular marketing and performance plugins.<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">No need to worry about security and maintenance, WiX has your back on this.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">More templates to choose from<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">The width, height of an element can be changed by dragging it.<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">A good fit for non-technical users<\/span><\/li>\n<li style=\"font-weight: 400;\"><span style=\"font-weight: 400;\">Shorter learning curve<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p>&nbsp;<\/p>\n<h2><span style=\"font-weight: 400;\">Wix vs WordPress Builders: Wrap Up<\/span><\/h2>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">Blink if you\u2019re still with me!<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Let\u2019s see.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">It kinda took me the same amount of time for developing both pages.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Both tools give you a lot of control over the design.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can start with a template, but you can fully customize everything on the inside.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Both of them have their pros and cons, as seen above.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">WordPress offers full flexibility and control, while Wix might have a shorter learning curve. In terms of pricing, they\u2019re pretty close.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Now, the question is, what do you want from your website?<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>[sibwp_form id=1]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Or at least I tried\u2026 Wix vs WordPress, place your bets! True story: I wanted to play with the free versions of the Wix website builder and a WordPress builder and see the end results. I picked Colibri for the task because it lets users build everything in a single interface. The hypothesis: creating the&hellip; <br \/> <a class=\"read-more\" href=\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/\">Read more<\/a><\/p>\n","protected":false},"author":6,"featured_media":5663,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[159],"tags":[180,181],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v17.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Final countdown: Wix vs WordPress. Features compared, pros and cons<\/title>\n<meta name=\"description\" content=\"Wix vs WordPress: place your bets! We&#039;ve built the same page in both tools, wanna see the results? Features compared, pros and cons, it&#039;s all there.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Final countdown: Wix vs WordPress. Features compared, pros and cons\" \/>\n<meta property=\"og:description\" content=\"Wix vs WordPress: place your bets! We&#039;ve built the same page in both tools, wanna see the results? Features compared, pros and cons, it&#039;s all there.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/\" \/>\n<meta property=\"og:site_name\" content=\"ColibriWP Blog\" \/>\n<meta property=\"article:published_time\" content=\"2020-09-14T07:23:30+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-11-15T10:13:36+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1920\" \/>\n\t<meta property=\"og:image:height\" content=\"1276\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Alina Belascu\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"14 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"https:\/\/colibriwp.com\/blog\/#website\",\"url\":\"https:\/\/colibriwp.com\/blog\/\",\"name\":\"ColibriWP Blog\",\"description\":\"WordPress know-how to boost your design skills\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/colibriwp.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg\",\"contentUrl\":\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg\",\"width\":1920,\"height\":1276,\"caption\":\"Wix vs WordPress builders\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#webpage\",\"url\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/\",\"name\":\"Final countdown: Wix vs WordPress. Features compared, pros and cons\",\"isPartOf\":{\"@id\":\"https:\/\/colibriwp.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#primaryimage\"},\"datePublished\":\"2020-09-14T07:23:30+00:00\",\"dateModified\":\"2021-11-15T10:13:36+00:00\",\"author\":{\"@id\":\"https:\/\/colibriwp.com\/blog\/#\/schema\/person\/87f760a68fccd9a3b83d34521adae311\"},\"description\":\"Wix vs WordPress: place your bets! We've built the same page in both tools, wanna see the results? Features compared, pros and cons, it's all there.\",\"breadcrumb\":{\"@id\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/colibriwp.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Wix vs WordPress Builders: How I Created the Same Web Page in Both Tools\"}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/colibriwp.com\/blog\/#\/schema\/person\/87f760a68fccd9a3b83d34521adae311\",\"name\":\"Alina Belascu\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/colibriwp.com\/blog\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/119058219_10158647533825351_1768509508910138441_o.jpg\",\"contentUrl\":\"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/119058219_10158647533825351_1768509508910138441_o.jpg\",\"caption\":\"Alina Belascu\"},\"description\":\"Alina is a digital marketer with a passion for web design. When she's not strategizing she's doing photography, listening to podcasts on history and psychology, and playing with her 2 dogs and cat.\",\"url\":\"https:\/\/colibriwp.com\/blog\/author\/alina-belascu\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Final countdown: Wix vs WordPress. Features compared, pros and cons","description":"Wix vs WordPress: place your bets! We've built the same page in both tools, wanna see the results? Features compared, pros and cons, it's all there.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/","og_locale":"en_US","og_type":"article","og_title":"Final countdown: Wix vs WordPress. Features compared, pros and cons","og_description":"Wix vs WordPress: place your bets! We've built the same page in both tools, wanna see the results? Features compared, pros and cons, it's all there.","og_url":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/","og_site_name":"ColibriWP Blog","article_published_time":"2020-09-14T07:23:30+00:00","article_modified_time":"2021-11-15T10:13:36+00:00","og_image":[{"width":1920,"height":1276,"url":"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Alina Belascu","Est. reading time":"14 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"https:\/\/colibriwp.com\/blog\/#website","url":"https:\/\/colibriwp.com\/blog\/","name":"ColibriWP Blog","description":"WordPress know-how to boost your design skills","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/colibriwp.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#primaryimage","inLanguage":"en-US","url":"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg","contentUrl":"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/michal-parzuchowski-GikVY_KS9vQ-unsplash.jpg","width":1920,"height":1276,"caption":"Wix vs WordPress builders"},{"@type":"WebPage","@id":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#webpage","url":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/","name":"Final countdown: Wix vs WordPress. Features compared, pros and cons","isPartOf":{"@id":"https:\/\/colibriwp.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#primaryimage"},"datePublished":"2020-09-14T07:23:30+00:00","dateModified":"2021-11-15T10:13:36+00:00","author":{"@id":"https:\/\/colibriwp.com\/blog\/#\/schema\/person\/87f760a68fccd9a3b83d34521adae311"},"description":"Wix vs WordPress: place your bets! We've built the same page in both tools, wanna see the results? Features compared, pros and cons, it's all there.","breadcrumb":{"@id":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/colibriwp.com\/blog\/wix-vs-wordpress-builders\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/colibriwp.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Wix vs WordPress Builders: How I Created the Same Web Page in Both Tools"}]},{"@type":"Person","@id":"https:\/\/colibriwp.com\/blog\/#\/schema\/person\/87f760a68fccd9a3b83d34521adae311","name":"Alina Belascu","image":{"@type":"ImageObject","@id":"https:\/\/colibriwp.com\/blog\/#personlogo","inLanguage":"en-US","url":"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/119058219_10158647533825351_1768509508910138441_o.jpg","contentUrl":"https:\/\/colibriwp.com\/blog\/wp-content\/uploads\/2020\/09\/119058219_10158647533825351_1768509508910138441_o.jpg","caption":"Alina Belascu"},"description":"Alina is a digital marketer with a passion for web design. When she's not strategizing she's doing photography, listening to podcasts on history and psychology, and playing with her 2 dogs and cat.","url":"https:\/\/colibriwp.com\/blog\/author\/alina-belascu\/"}]}},"_links":{"self":[{"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/posts\/5626"}],"collection":[{"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/comments?post=5626"}],"version-history":[{"count":2,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/posts\/5626\/revisions"}],"predecessor-version":[{"id":9298,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/posts\/5626\/revisions\/9298"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/media\/5663"}],"wp:attachment":[{"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/media?parent=5626"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/categories?post=5626"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/colibriwp.com\/blog\/wp-json\/wp\/v2\/tags?post=5626"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}