{"id":7824,"date":"2012-12-01T03:43:05","date_gmt":"2012-12-01T03:43:05","guid":{"rendered":"http:\/\/2slick.com\/web\/?p=7824"},"modified":"2012-12-01T03:50:26","modified_gmt":"2012-12-01T03:50:26","slug":"insert-image-into-post-using-wordpress","status":"publish","type":"post","link":"https:\/\/2slick.com\/web\/insert-image-into-post-using-wordpress\/affordablewebsitestips\/tutorials","title":{"rendered":"Insert image into post using WordPress"},"content":{"rendered":"<p>In this tutorial I will show you how to insert your image into a WordPress page or post.<\/p>\n<h3>Insert image in WordPress<\/h3>\n<ol>\n<li>Enter the text content for your post.<\/li>\n<li>Make sure you have the 'Visual' tab selected above your&nbsp;content&nbsp;area.<br \/>\n<a href=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2011\/09\/visual_tab_wordpress.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-1070\" style=\"border: 1px solid black;\" title=\"visual_tab_wordpress\" src=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2011\/09\/visual_tab_wordpress.jpg\" alt=\"\" width=\"458\" height=\"117\" srcset=\"https:\/\/2slick.com\/web\/wp-content\/uploads\/2011\/09\/visual_tab_wordpress.jpg 458w, https:\/\/2slick.com\/web\/wp-content\/uploads\/2011\/09\/visual_tab_wordpress-300x76.jpg 300w\" sizes=\"auto, (max-width: 458px) 100vw, 458px\" \/><\/a>&nbsp;<\/li>\n<li>Place the cursor within your text&nbsp;content field where you want your image to appear.<br \/>\n<a href=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/Wordpress_cursor.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-7826\" style=\"border: 1px solid black;\" title=\"Wordpress_cursor\" src=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/Wordpress_cursor.jpg\" alt=\"\" width=\"550\" height=\"333\" srcset=\"https:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/Wordpress_cursor.jpg 550w, https:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/Wordpress_cursor-300x181.jpg 300w\" sizes=\"auto, (max-width: 550px) 100vw, 550px\" \/><\/a>&nbsp;<\/li>\n<li>Click the 'Add Media' icon <a href=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/media-button.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-7827\" title=\"media-button\" src=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/media-button.png\" alt=\"\" width=\"15\" height=\"15\" \/><\/a>&nbsp;above your content field.<\/li>\n<li>Click the 'Select Files' button, navigated to the image on your computer, select the image and click the 'open' button.<\/li>\n<li>Click the 'Insert Into Post' button.<\/li>\n<li>Your image will probably be to large, but you can&nbsp;resize, by clicking on the image, then selecting the&nbsp;'Edit Image' icon.<br \/>\n&nbsp;<a href=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/WordPress_edit_image.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-7830\" style=\"border: 1px solid black;\" title=\"WordPress_edit_image\" src=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/WordPress_edit_image.jpg\" alt=\"\" width=\"289\" height=\"265\" \/><\/a><\/li>\n<li>Select the ...% amounts under 'Size' to shrink the image by that percent and click the 'Update' button. This step can be repeated to shrink or enlarge an image even more.<\/li>\n<li>If you want the text to flow up against the right or left side of the image, you will have to set the alignment. You can do this by clicking the 'Edit Image' icon again and checking the radio buttons next to 'Alignment'.<\/li>\n<li>Click the 'Update' button.<br \/>\n<a href=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/mantis.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-7831\" style=\"border: 1px solid black;\" title=\"mantis\" src=\"http:\/\/2slick.com\/web\/wp-content\/uploads\/2012\/12\/mantis.jpg\" alt=\"\" width=\"294\" height=\"273\" \/><\/a>&nbsp;<\/li>\n<\/ol>\n<div><strong>Note:<\/strong> If you don't like how close the text is to the image, you may want to <a title=\"create margin around image wordpress\" href=\"http:\/\/2slick.com\/web\/how-to-create-a-margin-around-your-image-using-wordpress\/affordablewebsitestips\/tutorials\" target=\"_blank\">create padding or a margin around the image<\/a>.<\/div>\n<div>&nbsp;<\/div>\n","protected":false},"excerpt":{"rendered":"<p>In this tutorial I will show you how to insert your image into a WordPress page or post. Insert image in WordPress Enter the text content for your post. Make sure you have the &#8216;Visual&#8217; tab selected above your&nbsp;content&nbsp;area. &nbsp; Place the cursor within your text&nbsp;content field where you want your image to appear. &nbsp; [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7792,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,6],"tags":[195,69],"class_list":["post-7824","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","category-wordpress","tag-insert-image","tag-wordpress-2"],"_links":{"self":[{"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/posts\/7824","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/comments?post=7824"}],"version-history":[{"count":6,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/posts\/7824\/revisions"}],"predecessor-version":[{"id":7842,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/posts\/7824\/revisions\/7842"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/media\/7792"}],"wp:attachment":[{"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/media?parent=7824"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/categories?post=7824"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/2slick.com\/web\/wp-json\/wp\/v2\/tags?post=7824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}