Extends the SiteOrigin Widgets Bundle by extending the Image widget to include a caption feature.
Instructions:
- Back up the current version of your website
- Open your website directory and navigate to
~/app/public/wp-content/plugins/so-widgets-bundle/widgets/
- Within the widgets directory, delete and replace the image folder with the
image
folder in this repository\ - Add the code below to the bottom of
functions.php
- Save and reload your site
- You should now have the ability to set up an image caption and align it left, right, or center to the image
CSS Classes:
.sow-image-caption-container
.sow-image-caption
TO DO:
- Refactor
- Remove inline width style and feed it through .less file
- Once refactored, submit to SO as PR
Add this code to functions.php within the Theme being used (note: suggest using child theme):
function mytheme_extend_image_form_caption($form_options, $widget)
{
// Split form_options
$form_options_slice_to_six = array_slice($form_options, 0, 6);
$form_options_slice_after_six = array_slice($form_options, 6);
// Prep items to insert into form_options
$insert_array_caption = ['caption' => [
'type' => 'text',
'label' => __('Caption text', 'so-widgets-bundle'),
]
];
$insert_array_caption_text = ['caption_align' => [
'type' => 'select',
'label' => __('Caption alignment', 'so-widgets-bundle'),
'default' => 'hidden',
'options' => [
'default' => __('Default', 'so-widgets-bundle'),
'left' => __('Left', 'so-widgets-bundle'),
'right' => __('Right', 'so-widgets-bundle'),
'center' => __('Center', 'so-widgets-bundle'),
]
]
];
// Merge caption items into form_options
$form_options = array_merge(
$form_options_slice_to_six,
$insert_array_caption,
$insert_array_caption_text,
$form_options_slice_after_six
);
return $form_options;
}
add_filter('siteorigin_widgets_form_options_sow-image', 'mytheme_extend_image_form_caption', 10, 2);