{"id":163747,"date":"2017-05-06T13:00:12","date_gmt":"2017-05-06T13:00:12","guid":{"rendered":"https:\/\/premium.wpmudev.org\/blog\/?p=163747"},"modified":"2017-05-03T07:15:19","modified_gmt":"2017-05-03T07:15:19","slug":"using-canva-for-wordpress","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/using-canva-for-wordpress\/","title":{"rendered":"How to Use Canva to Make Beautiful Images for Your WordPress Site"},"content":{"rendered":"

These days, it\u2019s rare you\u2019ll come across a website that doesn\u2019t have any images. In fact, images are so important to the way we use the internet that they\u2019ve become a necessity \u2013\u00a0especially if you want to market your website, project or service.<\/p>\n

In a study of over one million articles, BuzzSumo looked at how many blogs posts with images were shared, they looked at home many images, per how many words, got the best results.<\/p>\n

What they found was articles with an image once every 75-100 words got double the number of shares of articles with fewer images, and a minimum of 30 more shares than articles with more.<\/p>\n

So yeah, images are important. But what do you do if you\u2019re not a designer? Fortunately, there are lots of free online tools to help you out, but one of the best ones available right now is Canva<\/a>.<\/p>\n

Canva is a web-based graphic editing tool that can be used to create images. At its core, you could be forgiven for thinking of it as \u201cPhotoshop lite,\u201d but it has an interface that is very versatile and definitely faster than even a seasoned Photoshop user like myself could achieve.<\/p>\n

I\u2019ve been using Canva for almost a year now. In this post, I\u2019ll show you how you can use it to create compelling images for featured posts in WordPress that are stylish, quick and easy to achieve no matter what your background in graphic design.<\/p>\n

\n
\"Signing
Signing up is as easy as one click and 90% of the features are free!<\/figcaption><\/figure>\n<\/div>\n

Getting Started with Canva<\/h2>\n

Setting up an account with Canva<\/a> is easy \u2013 just sign up with your Facebook or Google account, or use your email.<\/p>\n

Once you’re signed in, you’ll be taken to the Canva dashboard.<\/p>\n

From the dashboard, you can get started with building the kind of image that you want to do. I\u2019ve been using Canva a lot for my social media posts, including the ones I use for my Facebook ads (check out my article\u00a0How to Set up Facebook Pixel and WordPress for a Winning Sales Funnel<\/a>).<\/p>\n

It is exceptionally easy to get the right sized images that display perfectly by just choosing \u201cFacebook Post\u201d or \u201cTwitter\u201d post from Canva’s list of optimized resolutions for those platforms. Handy, huh?<\/p>\n

Creating\u00a0an Image for Social Media<\/h3>\n

Let’s work through an example and create a social media image to advertise the Facebook Pixel post I just mentioned.<\/p>\n

Step #1:\u00a0Create a New Design<\/h4>\n

Click Create a design <\/strong>to get started creating a design from a template. Otherwise, choose one of the preset designs displayed at the top of the Canva dashboard. I\u2019m going to use the preset\u00a0Social Media<\/strong>\u00a0as this size seems to work well for featured images across a number of platforms.<\/p>\n

\n
\"By
By clicking “Create a Design” you can see perfectly sized frames for most kinds of social media too.<\/figcaption><\/figure>\n<\/div>\n

Step #2: Choose a Layout OR Build from Scratch<\/h4>\n

A new tab will open in your browser displaying the Layouts screen. Scroll through the layouts and choose a design to use at the basis for your image. I’m going with this World Press Freedom Day image.<\/p>\n

Canva’s monetized Layouts (and also Elements and Backgrounds, but more on those shortly) are totally optional: as a general rule, at the top of each of the panels there will mostly be free options to choose from. As you scroll down, there are more and more paid options.<\/p>\n

I mostly use the free elements but some of the paid elements are really fantastically designed, and a lot of them only cost a dollar or so. When I\u2019m building a featured image for a landing page it can sometimes be worth it to drop a few dollars on getting the image just how I like it.<\/p>\n

Don\u2019t worry if you aren\u2019t sure if the image will fit into your design or not, you can place it and finish your design before you are ever asked for your card details.<\/p>\n

\n
\"Choose
Choose a layout to use as the basis for your design, or you might want to skip this step and go straight to working with Elements.<\/figcaption><\/figure>\n<\/div>\n

Alternatively, you may choose to design an image from scratch. In that case, click Elements<\/strong> in the left-hand sidebar.<\/p>\n

\n
\"The
The elements panel on the left has everything you could need to put into your design.<\/figcaption><\/figure>\n<\/div>\n

But for this article, we’re going to go the easy route and edit an existing layout. So let’s continue.<\/p>\n

Step #3: Editing a Design<\/h4>\n

Now we’re up to the fun part. Once you have your layout you can start editing up the components of your image. For this example, I want to replace the text. To do this, I just need to double-click\u00a0the text area and enter my own text, like so:<\/p>\n

\n
\"Updating
Updating the text is easy in Canva \u2013 just double-click the textarea.<\/figcaption><\/figure>\n<\/div>\n

Next, I want to replace the icon at the top with some kind of Facebook logo. To do this, I’ll use the search box to find the image I need and drag over the image I want to use (after deleting the old icon).<\/p>\n

It’s easy to resize images \u2013 just drag out the corners using the round icons at the corners of the image that appear when it’s selected.<\/p>\n

\n
\"Search
Search through Canva’s huge collection of images for what you need.<\/figcaption><\/figure>\n<\/div>\n

Perfect! Looks great, right?<\/p>\n

If you would rather use your own images, you can use the Uploads feature to upload images from your computer.<\/p>\n

And if Canva doesn’t have the image you want, check out our guide to stock photos:\u00a0The Best Places to Find Free Stock Images for Your WordPress Site<\/a>.<\/p>\n

Step #4: Download Image<\/strong><\/p>\n

Click Download<\/strong> at the top of the page to download your image in your chosen format. I’m going to save as PNG.<\/p>\n

\n
\"Download
Download your image and you’re done!<\/figcaption><\/figure>\n<\/div>\n

All done! My final image is ready to share on Facebook to promote my post.<\/p>\n

Making\u00a0Further Edits<\/h3>\n

The example we’ve just covered offers a basic overview of how to create an image with Canva, but the beauty of this free tool is that it offers other features you can use to customize your images.<\/p>\n

Text<\/h4>\n

To change fonts, select Text<\/strong>\u00a0from the sidebar and choose a font from the list. Canva has a lot of fonts available, but if you want to use your own brand\u2019s font and it isn\u2019t on the list, you\u2019ll need to upgrade to a premium Canva account. Make sure you check out Brenda Barron\u2019s article about typography<\/a> as it will help you to define your imagery and brand.<\/p>\n

You can also change the colors for the text, as well as making text all caps, spacing, bullet points and so on. Really easy to use, and all visual so you don\u2019t need to start getting technical like you might have to with Photoshop.<\/p>\n

Elements<\/h4>\n

I love the illustrations search bar. Just type in a word for some kind of element you want on your page and it will find you dozens of paid and free vector graphics to use in your design. You can separate them by photos and illustrations too, so if you are looking for something that will keep with your website\u2019s design, it shouldn\u2019t be too hard.<\/p>\n

If you don\u2019t want to use their stock library, don\u2019t worry. You can upload your own images to put anywhere you like in your design. You can upload a PNG file with transparent backgrounds, and they will automatically port into Canva as well. Just drag and drop them into your design and they will upload (space is limited unless you upgrade, which I did or I would have passed that limit a long time ago).<\/p>\n

Check the “filter” option for backgrounds. This is one of my favorite tools in Canva as it can also be used for images that you import. The filters are really simple and easy to use, and the advanced tab lets you add things like a vignette or change the hue or saturation of an image. It has both numbers and a slider so you can change things visually, and it’s a much simpler way of dealing with this than Photoshop.<\/p>\n

\n
\"Post
Canva’s filters are flexible and great for doing some quick fixes to keep your design balanced.<\/figcaption><\/figure>\n<\/div>\n

<\/h2>\n

Things To Keep In Mind When Using Canva in WordPress<\/h2>\n

Every theme has different ways to display both featured and inline images. Usually, the theme developers will have documentation about the size of how blog featured posts display, so check and find out. Also, take into account how big you need the images to be. You can always use WP Smush<\/a> to reduce the size of the image (and increase loading times by quite a bit), but you should keep image sizes to as large as they need to be and no larger.<\/p>\n

Wrapping Up<\/h2>\n

Remember that Canva isn\u2019t the be all end all. Even with a program as simple and easy to navigate as Canva, you still have to put in a lot of work in understanding design fundamentals and how to use the tool to your best advantage.<\/p>\n

Be sure to go through Canva\u2019s own Design School<\/a>\u00a0program too, as it has a lot of great information including hotkeys, design tips and ways to make your images more engaging. Also, check out our post about\u00a0inspiring websites that are changing the design game<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"

These days, it\u2019s rare you\u2019ll come across a website that doesn\u2019t have any images. In fact, images are so important to the way we use the internet that they\u2019ve become a necessity \u2013\u00a0especially if you want to market your website, project or service. In a study of over one million articles, BuzzSumo looked at how […]<\/p>\n","protected":false},"author":515215,"featured_media":164338,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[263],"tags":[],"tutorials_categories":[],"class_list":["post-163747","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/163747","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/515215"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=163747"}],"version-history":[{"count":9,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/163747\/revisions"}],"predecessor-version":[{"id":164337,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/163747\/revisions\/164337"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/164338"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=163747"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=163747"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=163747"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=163747"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}