Updated on 5 Nov 2024
This Pro tutorial shows how images uploaded to posts as the value of a 'Hover Image' field can be set to appear when the featured images in a Bricks posts query loop are hovered.
Step 1
[Optional] Let's register a new image size for the images.
Add the following in child theme's functions.php (w/o the opening PHP tag) or a code snippets plugin:
<?php
add_image_size( 'project-image', 682, 430, true );
where project-image is your custom image size handle.
Step 2
Add a new field group for your post type having an image-type custom field named say hover_image.
Add/edit posts and set the hover image for each.
Step 3
Edit the single template for your post type with Bricks.
Copy the JSON of the fully-built Section from the link below and paste.
Note: ACSS classes are used.
This is a BricksLabs Pro tutorial.
For full access login below or create your BricksLabs Pro account
