Merge pull request #348 from thec4aa/feat-promo-image

Feature: adding promo image

acf-json/group_669e8e410d49a.json

@@ -0,0 +1,64 @@
+{
+    "key": "group_669e8e410d49a",
+    "title": "Promo Image",
+    "fields": [
+        {
+            "key": "field_669e8e428049a",
+            "label": "Promo Image",
+            "name": "promo-image",
+            "aria-label": "",
+            "type": "image",
+            "instructions": "Image for promotion, social media, etc.",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "promo-image",
+                "id": ""
+            },
+            "return_format": "array",
+            "library": "all",
+            "min_width": 1000,
+            "min_height": 1000,
+            "min_size": "",
+            "max_width": 4000,
+            "max_height": 4000,
+            "max_size": "",
+            "mime_types": "jpg, png, jpeg, gif",
+            "preview_size": "medium"
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "post"
+            }
+        ],
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "page"
+            }
+        ],
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "whisper"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "side",
+    "style": "default",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": true,
+    "description": "promo-image",
+    "show_in_rest": 1,
+    "modified": 1721790583
+}

blocks/promo-image/block.json

@@ -0,0 +1,80 @@
+{
+    "$schema": "https://github.com/AdvancedCustomFields/schemas/blob/main/json/block.json",
+    "apiVersion": 3,
+    "name": "c4aa-org/promo-image",
+    "version": "0.0.1",
+    "title": "Promo image",
+    "description": "Display promotional image",
+    "category": "C4AA",
+    "icon": "cover-image",
+    "keywords": [
+        "promo",
+        "image",
+        "social"
+    ],
+    "styles": [
+        {
+            "name": "default",
+            "label": "Default",
+            "isDefault": true
+        }
+    ],
+    "editorStyle": "file:./style.css",
+    "style": [
+        "file:./style.css",
+        "promo-image-shared-style"
+    ],
+    "viewStyle": [
+        "file:./style.css",
+        "promo-image-view-style"
+    ],
+    "acf": {
+        "renderTemplate": "render.php",
+        "mode": "preview",
+        "blockVersion": 2
+    },
+    "supports": {
+        "color": {
+            "background": false,
+            "text": false,
+            "link": false
+        },
+        "dimensions": {
+            "aspectRatio": true,
+            "minHeight": true
+        },
+        "filter": {
+            "duotone": true
+        },
+        "multiple": true,
+        "spacing": {
+            "margin": true,
+            "padding": true,
+            "blockGap": true
+        },
+        "typography": {
+            "fontSize": false,
+            "lineHeight": false,
+            "textAlign": true
+        }
+    },
+    "selectors": {
+        "filter": {
+            "duotone": ".acf-promo-image-container img"
+        }
+    },
+    "example": {
+        "attributes": {
+            "promo-image": "https://c4aa.org/wp-content/uploads/2024/07/C4AA_Icon_MagicHand-Red.png"
+        }
+    },
+    "attributes": {
+        "style": {
+            "dimensions": {
+                "aspectRatio": {
+                    "default": "1/1"
+                }
+            }
+        }
+    }
+}

blocks/promo-image/render.php

@@ -0,0 +1,15 @@
+<?php
+// add code to display promo-image block:
+$image = get_field('promo-image', get_the_ID());
+?>
+<div class="acf-promo-image-container">
+    <?php
+    if (!empty($image)): ?>
+        <img class="acf-promo-image" src="<?php echo esc_url($image['url']); ?>"
+            alt="<?php echo esc_attr($image['alt']); ?>" />
+
+    <?php elseif (has_post_thumbnail()): ?>
+        <?php the_post_thumbnail('medium_large'); // add code to display a default image or message when no image is provided ?>
+
+    <?php endif; ?>
+</div>

functions.php

@@ -244,13 +244,14 @@ function twentynineteen_post_thumbnail() {
 
 
 
-/* Register blocks for showing People's info in block editor */
+/* Register themes's custom blocks */
 
 add_action( 'init', 'register_c4aa_org_blocks' );
 
 function register_c4aa_org_blocks() {
     register_block_type( dirname(__FILE__) . '/blocks/person-title');
     register_block_type( dirname(__FILE__) . '/blocks/person-email' );
+	register_block_type( dirname(__FILE__) . '/blocks/promo-image' );
 }
 
 /* Register Block Category */