Thanks for your question and for sharing the details of the CSS Style modification you want for your application. The best way to accomplish your goal is to create a custom style template as outlined in this earlier topic:
Can the gallery be made responsive?
For your application you can add a padding style to each gallery-item
as shown below:
<style type='text/css'>
#[+selector+] {
margin: auto;
width: 100%;
}
#[+selector+] .gallery-item {
padding: [+template:[+query:css_padding+]|0px+];
float: [+float+];
margin: [+margin+];
text-align: center;
width: [+itemwidth+];
}
#[+selector+] .gallery-item .gallery-icon img {
border: 2px solid #cfcfcf;
}
#[+selector+] .gallery-caption {
margin-left: 0;
vertical-align: top;
}
/* see mla_gallery_shortcode() in media-library-assistant/includes/class-mla-shortcode-support.php */
</style>
The padding: [+template:[+query:css_padding+]|0px+];
line defines a content template that uses a custom shortcode parameter, css_padding
, to add padding. The default value is 0px
if the parameter is not found in the shortcode.
To create your template:
- Navigate to the Settings/Media Library Assistant Shortcodes tab.
- Click on the “Style” view below the Search Templates text box.
- Hover over the “default (default)” entry and click the “Copy” action link.
- When the page refreshes, the “Edit Template” screen will appear. Change the template Name to (for example) “padding”.
- Scroll to the
#mla_gallery-1 .gallery-item
Styles and add the padding:
template illustrated above.
- Scroll to the bottom and click “Update”.
Once you have the template set up you can add the mla_style=padding
parameter to your [mla_gallery] shortcode to replace the default styles. You can add something like css_padding=10px
or css_padding=1%
to set the padding for the gallery display.
I hope that gets you started on a solution for your application. I am marking this topic resolved, but please update it if you have any problems or further questions regarding custom styles for MLA galleries. Thanks for an interesting question and for your interest in the plugin.