{"id":26,"date":"2022-11-06T17:50:40","date_gmt":"2022-11-07T01:50:40","guid":{"rendered":"https:\/\/devjamie.com\/?p=26"},"modified":"2022-11-13T20:29:59","modified_gmt":"2022-11-14T04:29:59","slug":"using-wordpress-image-blocks","status":"publish","type":"post","link":"https:\/\/devjamie.com\/index.php\/2022\/11\/06\/using-wordpress-image-blocks\/","title":{"rendered":"Using WordPress Image Blocks"},"content":{"rendered":"\n<p>Editing images in the image blocks and messing with overlays seem pretty simple in WordPress.  Overlays can be used on pictures or solid backgrounds. Similar to the way you can on Facebook posts . You can also do more than allowed on a Facebook post. <\/p>\n\n\n\n<p>You can use a solid color and adjust the opacity to what fits you over a picture. You can do duotone if that fits your needs. Padding is used to add space from the border to the contents. All these setting are easy to tweak to get it just right.<\/p>\n\n\n\n<p>You can add several blocks within an overlay. This is handy when you have an Idea that requires the use of several blocks in an overlay. Titles with content all in one neat place. <\/p>\n\n\n\n<div class=\"wp-block-cover has-small-font-size\" style=\"padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-vivid-red-background-color has-background-dim\"><\/span><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"980\" height=\"735\" class=\"wp-block-cover__image-background wp-image-27\" alt=\"Picture of the fabric on a pizza parlor booth. The pattern looks like the word ass. \" src=\"https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040.jpg?resize=980%2C735&#038;ssl=1\" data-object-fit=\"cover\" srcset=\"https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?resize=1024%2C768&amp;ssl=1 1024w, https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?resize=300%2C225&amp;ssl=1 300w, https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?resize=768%2C576&amp;ssl=1 768w, https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?resize=1536%2C1152&amp;ssl=1 1536w, https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?resize=2048%2C1536&amp;ssl=1 2048w, https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?w=1960&amp;ssl=1 1960w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<h2 class=\"has-text-align-center wp-block-heading\">Naughty furniture<\/h2>\n\n\n\n<p class=\"has-text-align-left has-large-font-size\">When you sit down to have some food at a pizza parlor and your eyes see something in the pattern of the furniture that is sending you a message.<\/p>\n<\/div><\/div>\n\n\n\n<p>I think using the cover blocks for quotes gives your page a magazine feel. Just a way of making you post look polished. Things are only limited by you creativity on using the blocks <\/p>\n\n\n\n<div class=\"wp-block-cover wp-duotone-1a4548-000000-1\" style=\"min-height:254px;aspect-ratio:unset;\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-primary-background-color has-background-dim-100 has-background-dim\"><\/span><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"has-text-align-center has-large-font-size\">When you sit down to have some food at a pizza parlor and your eyes see something in the pattern of the furniture that is sending you a message.<\/p>\n<cite>Jamie<\/cite><\/blockquote>\n<\/div><\/div>\n\n\n\n<p>I love that you can use overlays with all types of media. This makes you content alive an interesting. It can help you relay information or emotion on posts. <\/p>\n\n\n\n<div class=\"wp-block-cover\"><span aria-hidden=\"true\" class=\"wp-block-cover__background has-background-dim\"><\/span><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" width=\"500\" height=\"226\" class=\"wp-block-cover__image-background wp-image-29\" alt=\"\" src=\"https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/minions.gif?resize=500%2C226&#038;ssl=1\" data-object-fit=\"cover\"\/><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<p class=\"has-text-align-center has-large-font-size\">Minions Rule!<\/p>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Editing images in the image blocks and messing with overlays seem pretty simple in WordPress. Overlays can be used on pictures or solid backgrounds. Similar to the way you can [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":27,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[5,3],"tags":[],"class_list":["post-26","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-assignments","category-cosw240"],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/devjamie.com\/wp-content\/uploads\/2022\/11\/IMG_20210511_195206_040-scaled.jpg?fit=2560%2C1920&ssl=1","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/posts\/26","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/comments?post=26"}],"version-history":[{"count":2,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/posts\/26\/revisions"}],"predecessor-version":[{"id":30,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/posts\/26\/revisions\/30"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/media\/27"}],"wp:attachment":[{"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/media?parent=26"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/categories?post=26"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devjamie.com\/index.php\/wp-json\/wp\/v2\/tags?post=26"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}