How to use the add_render_attribute
The add_render_attribute allow to add things to the code. it seems to me that it is rendered when the page load up, or when I change a state in the editor such as a switcher. changing values on a slider seemed not have an interactive response, so be aware of that!
the 3 paramaters are:
1. A name that serves as a refrence later when I call the added attribute
2. What kind of attribute it is
3. Information I want to pass
$this->add_render_attribute('imageCss', 'style', 'position:absolute;
color: blue;');
In this example I am creating an CSS – I am calling it ‘imageCss ‘ and I declare it to be a ‘style’ then I declare what I want to be in the style which in this case is wrtitten in a css style:
element name, value and closing ;
in order to use this info – in this case add this css to an image of class ‘thisImage’. I am calling the attribute through the $this->get_render_attribute_string( ‘imageCss’ ) . ‘;
Note that I am not putting this inside a “style = “, it seems to be already taken from the declration of the render attribute ‘style’
echo '<img decoding="async" class ="theImage" src="' . $settings['theImage']['url'] . '"
' . $this->get_render_attribute_string( 'imageCss' ) . ';
">';
What i found missing in the documentation is the explenation how to use the reset option.
So far it works when I check if the popover-toggle returns a yes and do something accordingly
if('yes' == $settings['ImageCss_popover_toggle']){
$this->add_render_attribute('imageCss', 'style', 'position:absolute;');
}
else{
//reset the css by setting a filter to nothing
$this->add_render_attribute('imageCss', 'style', 'position:absolute; filter: blur(0px);');
}
In this case I am adding a custom css, in which if the return value from the popover is yes, then it will have no special value and the filter will come from somewhere else. Howevere if the return value is no (that will happen when I click the reset in the popover toggle window) then I am adding a css rule of an empty filter, which will over ride the values that come from within the popover controller.